返回：唐霜｜书

Objext完全手册

前言

Objext是一个现代js对象模型，它通未经授权，禁止复制转载。【作者：唐霜】过丰富的api扩展js原生模型，使一个对【本文受版权保护】【原创内容，转载请注明出处】象拥有更丰富的操作和数据读写能力，同时可【作者：唐霜】未经授权，禁止复制转载。以使之更符合响应式编程的需要。

著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshua著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。ng.net

之所以开发Objext，一开始是为了解决【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net在表单中创建一个可编辑和撤销编辑的对象。【本文受版权保护】【关注微信公众号：wwwtangshuangnet】在这个场景中，当一个对象被表单打开时，它【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net进入可编辑状态，当提交表单时，它会被更新【未经授权禁止转载】【原创内容，转载请注明出处】，当放弃提交表单时，它恢复到编辑前的数据【本文受版权保护】本文作者：唐霜，转载请注明出处。。在这个原始需求的基础上，我增加，当一个【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。属性发生变动时，可以执行某些操作，就像v【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】ue可以更新视图一样，通过提供一个$wa转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.nettch方法，这种能力被封装的近乎完美。除【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net了解决属性变动的监听，我还想到表单的校验著作权归作者所有，禁止商业用途转载。【本文受版权保护】问题，提交表单的时候需要对表单数据进行校未经授权，禁止复制转载。【本文受版权保护】验。最后，一个包含如下功能的Objext【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。对象就诞生了：

通过keyPath获取、设置数据

本文版权归作者所有，未经授权不得转载。

【原创不易，请尊重版权】

【原创内容，转载请注明出处】

响应式，可以通过$watch监听某个ke【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.netyPath

未经授权，禁止复制转载。

著作权归作者所有，禁止商业用途转载。

本文作者：唐霜，转载请注明出处。

数据版本控制，通过$commit和$re【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。set，可以随时创建快照或恢复数据

转载请注明出处：www.tangshua【转载请注明来源】【作者：唐霜】ng.net

【本文受版权保护】

数据校验

【作者：唐霜】

原创内容，盗版必究。

数据锁，锁住之后，不能做任何数据修改

【访问 www.tangshuang.n本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】et 获取更多精彩内容】

【关注微信公众号：wwwtangshua【本文受版权保护】【原创内容，转载请注明出处】ngnet】

计算属性和依赖收集

原创内容，盗版必究。

本文版权归作者所有，未经授权不得转载。

上述功能，都被集中于Objext对象一体【转载请注明来源】转载请注明出处：www.tangshuang.net，一个看上去像是普通js对象的对象，却可【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。以隐藏上述所有功能。

快速上手

安装和使用

objext通过npm进行安装：

著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshua【原创内容，转载请注明出处】未经授权，禁止复制转载。ng.net转载请注明出处：www.tangshua原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。ng.net【原创不易，请尊重版权】

npm i objext

安装之后，可以通过不同的方式在项目中引入【本文受版权保护】【关注微信公众号：wwwtangshuangnet】：

原创内容，盗版必究。【原创不易，请尊重版权】转载请注明出处：www.tangshua【未经授权禁止转载】本文作者：唐霜，转载请注明出处。ng.net

// ES6
import Objext from 'objext'

// CommonJS
const { Objext } = require('objext')

浏览器中也可以直接引入使用：

<script src="node_moudules/objext/dist/objext.js"></script>
<script>
const { Objext } = window.objext
</script>

创建实例

创建一个Objext实例超级简单，只需要【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。传入一个等同结构的js原生对象即可。

【访问 www.tangshuang.n著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】et 获取更多精彩内容】本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】【作者：唐霜】

const objx = new Objext({
  name: 'susan',
  children: [
    { name: 'tomy', age: 9 },
    { name: 'lily', age: 10 },
  ],
})

这样就创建了一个Objext的实例。它的【本文受版权保护】【原创不易，请尊重版权】使用几乎可以和普通的js对象一样：

const child1 = objx.children[0]
child1.age = 10

你可能会问，这有什么意思呢？单纯这样用当转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。然没意思，你可以通过$watch方法监听【作者：唐霜】【原创内容，转载请注明出处】某个属性的变化来实现同步更新：

objx.$watch('children[0].age', ({ newValue }) => {
  objx.children[1].age = newValue + 1
})

这样可以保持两个孩子的年龄同步增长。这是【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。一种响应式的方法，你可以试试。还有一种响【作者：唐霜】转载请注明出处：www.tangshuang.net应式的方法，是“计算属性”，它的用法和j【原创不易，请尊重版权】未经授权，禁止复制转载。s原生的计算属性一致。

const some = new Objext({
  weight: 120,
  get height() {
    return this.weight + 50
  }, 
})

这样，height就是一个计算属性，它依【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。赖于weight，当weight发生变化【版权所有，侵权必究】【未经授权禁止转载】的时候，height也发生变化，但是和原【作者：唐霜】【关注微信公众号：wwwtangshuangnet】生的计算属性相比，objext实例的计算著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。属性使用来缓存，当weight发生变化的【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】时候，缓存被更新，获取height时，直转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。接读取缓存。

这样看来，是不是有点意思了？没关系，我们【未经授权禁止转载】【本文首发于唐霜的博客】后面还有更好玩的东西。

基于keyPath的数据操作

keyPath是指获取一个多层级数据节点未经授权，禁止复制转载。【原创内容，转载请注明出处】的属性链的字符串表达形式，例如obx.b【作者：唐霜】【访问 www.tangshuang.net 获取更多精彩内容】ody.hands.left这个属性节点本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。，它的keyPath就是’b【作者：唐霜】【本文首发于唐霜的博客】ody.hands.left’【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】;，而在objext中，我们可以使用ke未经授权，禁止复制转载。【原创不易，请尊重版权】yPath来获取或更新数据。

本文作者：唐霜，转载请注明出处。原创内容，盗版必究。

之所以提供这种方式，是因为，我们直接ob未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】x.body.hands.left会遇到著作权归作者所有，禁止商业用途转载。【作者：唐霜】问题，在某些情况下，这个属性节点并不存在未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】，比如obx.body根本就不存在，那么【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。这个操作就会报错，影响程序执行。而通过o未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。bjext的keyPath进行操作，则不本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net会影响。

$get

通过keyPath获取属性节点。

keyPath 要获取的属性节点的key原创内容，盗版必究。转载请注明出处：www.tangshuang.netPath

【关注微信公众号：wwwtangshua本文作者：唐霜，转载请注明出处。【转载请注明来源】ngnet】

原创内容，盗版必究。

本文作者：唐霜，转载请注明出处。

const left = objx.$get('body.hands.left')

当body这个属性节点不存在时，直接返回【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。undefined，而不会报错。

本文作者：唐霜，转载请注明出处。【本文受版权保护】【未经授权禁止转载】未经授权，禁止复制转载。

需要注意的是，$get得到的，不是一个数【原创内容，转载请注明出处】【版权所有，侵权必究】据的原始值，而是objext实例的属性节未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。点，如果该节点对应的原始数据是一个对象，本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。那么这个节点本身将会是一个objext实本文作者：唐霜，转载请注明出处。原创内容，盗版必究。例，同时具备了一切objext的特性。这【原创不易，请尊重版权】【原创不易，请尊重版权】涉及到objext的内部层级问题，后文会【作者：唐霜】【关注微信公众号：wwwtangshuangnet】更深入的讲解。

另外，如果你直接在objext实例上添加【本文首发于唐霜的博客】【未经授权禁止转载】一个属性，例如 objx.age = 1【版权所有，侵权必究】【作者：唐霜】0 这种，$get是获取不到这种属性的。【作者：唐霜】原创内容，盗版必究。这是一个比较忌讳的做法，因此，一定要记住本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。，永远不要直接在objext实例对象上添【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。加属性，也不要用delete操作符直接删【原创不易，请尊重版权】【本文首发于唐霜的博客】除属性，而要使用objext的实例方法$【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.netset和$remove。

【未经授权禁止转载】【关注微信公众号：wwwtangshua本文作者：唐霜，转载请注明出处。【本文受版权保护】ngnet】

$set

通过keyPath更新或添加一个属性节点【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。。

本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】【关注微信公众号：wwwtangshua转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.netngnet】

keyPath 要设置的属性节点的key原创内容，盗版必究。原创内容，盗版必究。Path

本文版权归作者所有，未经授权不得转载。

【原创内容，转载请注明出处】

value 值

著作权归作者所有，禁止商业用途转载。

【本文受版权保护】

著作权归作者所有，禁止商业用途转载。

objx.$set('body.hands.left', true')

【作者：唐霜】【原创内容，转载请注明出处】【未经授权禁止转载】

objext的特点是响应式的，可以通过$原创内容，盗版必究。原创内容，盗版必究。watch对属性的变化进行响应。当你使用【作者：唐霜】【作者：唐霜】$set进行数据更改或添加时，对应的wa【作者：唐霜】【未经授权禁止转载】tcher会被触发。注意，添加数据也会触【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。发watcher哦。

未经授权，禁止复制转载。【本文受版权保护】【未经授权禁止转载】【作者：唐霜】

【访问 www.tangshuang.n本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】et 获取更多精彩内容】【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。

那如果要添加一个不是响应式的，但是又不会【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。被删掉的属性怎么办呢？需要用到后面的$d【转载请注明来源】原创内容，盗版必究。efine，后文会详细介绍。

【未经授权禁止转载】转载请注明出处：www.tangshua【作者：唐霜】未经授权，禁止复制转载。ng.net原创内容，盗版必究。

而另外一种情况是，如果你想在单个操作中，未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。仅仅更新属性值，而不触发watcher怎【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net么办呢？$set的第三个参数设置为fal原创内容，盗版必究。【作者：唐霜】se即可：

【版权所有】唐霜 www.tangshu转载请注明出处：www.tangshuang.net【本文受版权保护】ang.net【关注微信公众号：wwwtangshua【转载请注明来源】【版权所有】唐霜 www.tangshuang.netngnet】转载请注明出处：www.tangshua【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】ng.net【版权所有，侵权必究】

dispatch 是否要触发watche本文版权归作者所有，未经授权不得转载。【作者：唐霜】r，默认为true

objx.$set('body.hands.left', true, false)

这样就不会触发通过$watch绑定的wa【转载请注明来源】【原创内容，转载请注明出处】tcher。

【作者：唐霜】原创内容，盗版必究。【本文首发于唐霜的博客】

$has

判断是否存在一个属性节点。

keyPath 要判断的属性节点keyP【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。ath

著作权归作者所有，禁止商业用途转载。

【作者：唐霜】

if (objx.$has('body.hands')) {
  // ...
}

本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。

$update

批量更新/添加属性节点。

本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】原创内容，盗版必究。

object 将要更新的内容通过一个对象未经授权，禁止复制转载。【原创内容，转载请注明出处】的形式组织起来

【关注微信公众号：wwwtangshua原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。ngnet】

本文版权归作者所有，未经授权不得转载。

【转载请注明来源】

本文作者：唐霜，转载请注明出处。

objx.$update({
  name: 'susan',
  age: 34,
})

通过这种方式可以一次性写入多个属性。当一本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。个属性不存在时，会自动创建该属性。

未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。

使用$update的好处是批量。这听上去【版权所有，侵权必究】【原创内容，转载请注明出处】是废话，但是并不是，普通$set一个一个【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。更新属性，不仅写法上比较麻烦，而且每一次【本文首发于唐霜的博客】【原创内容，转载请注明出处】$set都会触发watcher去执行，这著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】会影响后面的$set的值。但是$upda【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.nette会在一次更新完之后，才会去执行所有涉原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.net及到的所有watcher。这就可能出现比【版权所有，侵权必究】转载请注明出处：www.tangshuang.net较有趣的现象，当你使用一组$set和使用【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】$update的时候，虽然他们都是更新相【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。同的一批数据，但是有可能执行完毕之后，整【转载请注明来源】著作权归作者所有，禁止商业用途转载。个objx的值不同，这是因为watche【关注微信公众号：wwwtangshuangnet】【转载请注明来源】r的执行顺序可能不同导致的。因此，在使用【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net的时候，你需要注意。

著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。【转载请注明来源】

$put

重置整个objext实例的数据为传入的新【原创不易，请尊重版权】【原创内容，转载请注明出处】数据，之前的所有数据会被清空。

【本文受版权保护】本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。

object 要使用的新数据

【本文首发于唐霜的博客】

【原创不易，请尊重版权】

本文版权归作者所有，未经授权不得转载。

未经授权，禁止复制转载。未经授权，禁止复制转载。【未经授权禁止转载】【访问 www.tangshuang.n【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。et 获取更多精彩内容】

【访问 www.tangshuang.n原创内容，盗版必究。【本文首发于唐霜的博客】et 获取更多精彩内容】【转载请注明来源】【关注微信公众号：wwwtangshua【未经授权禁止转载】本文作者：唐霜，转载请注明出处。ngnet】【原创不易，请尊重版权】

const age = objx.$get('age')
objx.$put({
  name: 'susan',
})

上面这段代码执行之后，age没有了，因此【作者：唐霜】【未经授权禁止转载】要提前把age取出来。

$remove

从objext实例上删除一个属性。

【本文首发于唐霜的博客】【本文首发于唐霜的博客】

keyPath 要移除的属性节点keyP【作者：唐霜】转载请注明出处：www.tangshuang.netath

本文作者：唐霜，转载请注明出处。

objx.$remove('body.hands')

有人可能会问，移除直接delete不就行【转载请注明来源】【原创内容，转载请注明出处】了嘛。听上去很简单，实际上，在objex本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。t内部存在依赖关系，如果一个属性依赖另外【未经授权禁止转载】本文作者：唐霜，转载请注明出处。一个属性，那么当被依赖的属性被移除时，应【作者：唐霜】【本文受版权保护】该解除这种依赖关系。单纯delete做不转载请注明出处：www.tangshuang.net【作者：唐霜】到，因此，必须使用$remove来移除所本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】有你需要移除的属性。

响应式

Objext的一个特征是完全的响应式，它未经授权，禁止复制转载。【转载请注明来源】可以塑造多种响应式方式，而且脱离了任何业【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】务场景，是一个纯粹的对象响应式的库。它不【本文受版权保护】【本文首发于唐霜的博客】考虑界面响应的问题，它可以用来解决任何需未经授权，禁止复制转载。【本文首发于唐霜的博客】要观察数据变化而跟随变化的场景，虽然需要【访问 www.tangshuang.net 获取更多精彩内容】【版权所有，侵权必究】自己编写被响应的代码。

著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】

计算属性

计算属性被大规模应用是vue出现的时候，【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net在vue中，我们需要将普通的数据和计算属著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。性数据分开写，这不是没有道理的，因为计算【未经授权禁止转载】本文作者：唐霜，转载请注明出处。属性意味着不可以手动去修改它的值。在ob【作者：唐霜】转载请注明出处：www.tangshuang.netjext中也是一样的，如果一个属性是计算著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。属性，就不能通过$set或者赋值的方式去本文作者：唐霜，转载请注明出处。原创内容，盗版必究。修改它的值。

著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】【原创不易，请尊重版权】【未经授权禁止转载】

所以，到底应该怎么使用计算属性呢？

未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。

创建计算属性

【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshua【本文受版权保护】转载请注明出处：www.tangshuang.netngnet】未经授权，禁止复制转载。

创建计算属性超级简单：

【本文受版权保护】【本文受版权保护】

const objx = new Objext({
  age: 10, 
  get weight() {
    return age * 10
  }, 
})

就像js原生对象的getter一样。但是未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。需要注意的是，如果你还设置了一个sett著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】er，那setter会被直接忽略，你不可【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。以在objext中使用setter，se转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。tter应该被$watch替代。

著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshua著作权归作者所有，禁止商业用途转载。【作者：唐霜】ngnet】

使用计算属性

原创内容，盗版必究。原创内容，盗版必究。【关注微信公众号：wwwtangshua原创内容，盗版必究。转载请注明出处：www.tangshuang.netngnet】【本文首发于唐霜的博客】

原创内容，盗版必究。【本文受版权保护】【本文受版权保护】

console.log(objx.weight) // 100
objx.age = 11
console.log(objx.weight) // 110

计算器中的this

本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。

原创内容，盗版必究。【访问 www.tangshuang.n【未经授权禁止转载】【转载请注明来源】et 获取更多精彩内容】原创内容，盗版必究。

const objx = new Objext({
  age: 10,
  get weight() {
    return this.age * 10
  },
})

const objx2 = new Objext({
  age: 20,
})
objx.$bind(objx2)

使用$bind方法，使objx的weig【访问 www.tangshuang.net 获取更多精彩内容】【原创不易，请尊重版权】ht计算器中的this换绑到objx2上【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】面，这样，当objx2.age发生变化的【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】时候，objx.weight就会自动更新【作者：唐霜】原创内容，盗版必究。。但是，需要注意的是，$bind方法会使著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net所有的计算器的this都换绑，而不是只换本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。绑一个计算器。因此，在使用$bind时，本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。也要理解它的运作规律才使用。

当一个计算属性依赖另外一个objext对著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】象的某个属性时，可以使用$depend方未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】法创建这种依赖关系：

未经授权，禁止复制转载。原创内容，盗版必究。

const objx = new Objext({
  get weight() {
    return objx2.age * 10 // 依赖objx2的age属性
  },
})

这里，objx依赖objx2.age，o【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.netbjx2也是一个objext对象，但是o【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】bjx2的age属性发生变化的时候，并不原创内容，盗版必究。【关注微信公众号：wwwtangshuangnet】能直接触发objx的weight发生变化【原创不易，请尊重版权】【作者：唐霜】，为了解决这个问题，你需要使用$depe本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。nd方法：

【本文受版权保护】原创内容，盗版必究。转载请注明出处：www.tangshua原创内容，盗版必究。【转载请注明来源】ng.net

objx.$depend(objx)

这需要你手动调用，而不能靠objext自【未经授权禁止转载】【本文首发于唐霜的博客】动实现。

【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。

$watch

$watch方法为objext实例提供一本文作者：唐霜，转载请注明出处。【本文受版权保护】个观察者，对特定keyPath的属性进行【转载请注明来源】【原创内容，转载请注明出处】观察，当该属性发生变化时，执行传入的回调【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。函数。它的使用非常像angular的$w转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。atch方法。

keyPath 要观察的属性

【未经授权禁止转载】

本文作者：唐霜，转载请注明出处。

fn 属性发生变化时要执行的函数

本文版权归作者所有，未经授权不得转载。

本文作者：唐霜，转载请注明出处。

【关注微信公众号：wwwtangshua著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.netngnet】

deep 是否要进行深度观察，当keyP【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。ath对应的是对象或数组时可以设为tru【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】e

【本文受版权保护】

【转载请注明来源】

著作权归作者所有，禁止商业用途转载。

本文版权归作者所有，未经授权不得转载。

objx.$watch('body.hands.left', ({ newValue }) => {
  console.log(newValue)
})

$watch方法是实现objext内部响【原创内容，转载请注明出处】未经授权，禁止复制转载。应式功能的基础方法，因此，它会被广泛用到【本文首发于唐霜的博客】【转载请注明来源】，包括objext内部的响应式实现方式，【未经授权禁止转载】【原创不易，请尊重版权】例如计算属性的自动更新。

【未经授权禁止转载】【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。

回调函数fn的参数包括：

e 一个包含属性变化信息的对象

原创内容，盗版必究。

【关注微信公众号：wwwtangshua本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。ngnet】

【本文受版权保护】

newValue 新值

【本文首发于唐霜的博客】

本文作者：唐霜，转载请注明出处。

oldValue 老值

【本文受版权保护】

未经授权，禁止复制转载。

转载请注明出处：www.tangshua本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】ng.net

其中e，也就是第一个参数，会包含如下信息未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net：

match $watch时的keyPat【作者：唐霜】未经授权，禁止复制转载。h

本文版权归作者所有，未经授权不得转载。

【未经授权禁止转载】

著作权归作者所有，禁止商业用途转载。

deep $watch时的deep

【作者：唐霜】

【访问 www.tangshuang.n【原创内容，转载请注明出处】【原创内容，转载请注明出处】et 获取更多精彩内容】

【原创内容，转载请注明出处】

path 当前变化的真实节点的keyPa转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】th

本文作者：唐霜，转载请注明出处。

【访问 www.tangshuang.n【作者：唐霜】【未经授权禁止转载】et 获取更多精彩内容】

target 当前objext对象

原创内容，盗版必究。

newValue 新值

【转载请注明来源】

【作者：唐霜】

【原创内容，转载请注明出处】

oldValue 老值

【关注微信公众号：wwwtangshua【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】ngnet】

【访问 www.tangshuang.n转载请注明出处：www.tangshuang.net【本文受版权保护】et 获取更多精彩内容】

stopPropagation 阻止冒泡

著作权归作者所有，禁止商业用途转载。

preventDefault 阻止继续执著作权归作者所有，禁止商业用途转载。【作者：唐霜】行其他回调函数

转载请注明出处：www.tangshua【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】ng.net

stack 调用栈

原创内容，盗版必究。

本文作者：唐霜，转载请注明出处。

stopPropagation

本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。

objext的$watch的第三个参数d本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshuang.neteep让你可以对一个本身是对象的属性进行【转载请注明来源】著作权归作者所有，禁止商业用途转载。深度观察。当深层次的节点发生变化的时候，著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。代表着被观察的节点也发生了变化。它的内部原创内容，盗版必究。【作者：唐霜】实现机理和DOM的事件冒泡一样，一层一层本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】向上传递，触发对应的回调函数。但是，如果【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。你在向上冒泡的过程中，调用了stopPr本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.netopagation方法的话，冒泡就会停止转载请注明出处：www.tangshuang.net原创内容，盗版必究。，向上的后续回调函数就不会执行了。例如：

objx.$watch('body.hands', ({ newValue }) => {
  console.log(newValue)
}, true)
objx.$watch('body.hands.left', ({ newValue, stopPropagation }) => {
  if (newValue === true) {
    stopPropagation()
  }
})

上面这段代码中，如果body.hands【转载请注明来源】本文作者：唐霜，转载请注明出处。.left被设置为true，那么第一个$【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】watch的回调函数不会被触发。

转载请注明出处：www.tangshua原创内容，盗版必究。【原创内容，转载请注明出处】ng.net本文版权归作者所有，未经授权不得转载。

preventDefault

本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshua【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。ng.net未经授权，禁止复制转载。

而preventDefault方法也和D【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】OM事件中的preventDefault原创内容，盗版必究。【本文首发于唐霜的博客】一致，它会阻止剩下的其他回调函数被执行：

本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】

objx.$watch('body.hands.left', ({ newValue, preventDefault }) => {
  if (newValue === true) {
    preventDefault()
  }
})
objx.$watch('body.hands.left', (e, newValue) => {
  console.log(newValue)
})

上面的代码中，如果body.hands.著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。left为true，那么第二个回调函数就【作者：唐霜】原创内容，盗版必究。不会被执行了。

特殊符号

原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。

特殊符号*表示对所有的变化进行观察：

原创内容，盗版必究。【访问 www.tangshuang.n转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】et 获取更多精彩内容】【原创不易，请尊重版权】

objx.$watch('*', ({ path, match }) => {
  console.log('观察' + match)
  console.log('发生变化的是' + path)
})

$unwatch

未经授权，禁止复制转载。【本文受版权保护】【未经授权禁止转载】

objx.$watch('body', callback)
// ...
objx.$unwatch('body', callback)

$silent

是否开启安静模式更新数据，当安静模式开启【本文首发于唐霜的博客】【转载请注明来源】后，所有对数据的修改都不会触发watch【本文受版权保护】原创内容，盗版必究。er。

【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】

status 使用状态true/fals未经授权，禁止复制转载。【作者：唐霜】e，true表示开启安静模式，false未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net表示关闭安静模式。

未经授权，禁止复制转载。

$isSilent

判断是否处于安静模式中。

著作权归作者所有，禁止商业用途转载。【本文受版权保护】未经授权，禁止复制转载。

数据版本控制

Objext对象的一个特点是可以随意的修著作权归作者所有，禁止商业用途转载。【本文受版权保护】改和恢复数据，特别是在一些编辑的时候，你【作者：唐霜】著作权归作者所有，禁止商业用途转载。可以提供临时保存和恢复的能力。当你放弃进【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。行编辑的时候，一个方法就可以让数据恢复到著作权归作者所有，禁止商业用途转载。【转载请注明来源】编辑之初的状态。

【原创不易，请尊重版权】【本文首发于唐霜的博客】【访问 www.tangshuang.n原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。et 获取更多精彩内容】【作者：唐霜】

$commit

创建一个名为tag的快照。

原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。

tag 快照名称

著作权归作者所有，禁止商业用途转载。

未经授权，禁止复制转载。

本文版权归作者所有，未经授权不得转载。

【本文受版权保护】

objx.$commit('tag1')

【关注微信公众号：wwwtangshua【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。ngnet】【原创内容，转载请注明出处】

不能存在同名快照，如果已经存在了同名快照转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】，会被新快照覆盖。

本文版权归作者所有，未经授权不得转载。【作者：唐霜】【本文受版权保护】【原创不易，请尊重版权】

$reset

恢复到名为tag的快照的数据。

tag 快照的名称。如果不传的话，直接恢【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。复到最后一个创建的快照，即使已经存在同名【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net快照，也会被认为是最后一个。

【作者：唐霜】

本文版权归作者所有，未经授权不得转载。

著作权归作者所有，禁止商业用途转载。

objx.name = 'tomy'
objx.$commit('version1')
objx.name = 'jimy'
objx.$reset('version1')
console.log(objx.name) // => 'tomy'

reset之后名为tag的快照还是存在的【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。，只是当前的数据被设置为快照的内容。

【转载请注明来源】转载请注明出处：www.tangshua未经授权，禁止复制转载。原创内容，盗版必究。ng.net【本文受版权保护】本文版权归作者所有，未经授权不得转载。

$revert

删除名为tag的快照。

tag 快照的名称。如果不传，表示删除上转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】一个创建的快照，规则和reset相同。

【原创不易，请尊重版权】

【关注微信公众号：wwwtangshua本文版权归作者所有，未经授权不得转载。著作权归作者所有，禁止商业用途转载。ngnet】

【未经授权禁止转载】

objx.name = 'tomy'
objx.$commit('version1')
objx.name = 'jimy'
objx.$commit('version2')
objx.name = 'gofei'
objx.$revert() // 删除version2
objx.$reset() // 恢复到version1
console.log(objx.name) // => 'tomy'

数据锁

在一些情况下，我们可以锁死objext实【本文首发于唐霜的博客】【转载请注明来源】例，使它不能进行任何修改。

$lock

锁死数据。

【作者：唐霜】本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。

objx.name = 'digou'
objx.$lock()
objx.name = 'ximeon'
console.log(objx.name) // digou

锁死后，属性不能被修改。

转载请注明出处：www.tangshua著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。ng.net【原创内容，转载请注明出处】【原创内容，转载请注明出处】

objext具有继承性，父级属性锁死后，著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。子属性也不能修改。

著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】本文作者：唐霜，转载请注明出处。

objx.body.$lock()
objx.body.hands.left = true // 无法进行修改

$unlock

解锁数据，使返回可修改状态。

【作者：唐霜】【关注微信公众号：wwwtangshua【访问 www.tangshuang.net 获取更多精彩内容】【关注微信公众号：wwwtangshuangnet】ngnet】

$isLocked

判断是否被锁死。

数据校验

$formulate

设置校验规则。

【未经授权禁止转载】原创内容，盗版必究。【转载请注明来源】

validators 可以是一个数组，也【未经授权禁止转载】【未经授权禁止转载】可以是单个对象，对象内容为：
- path 要校验的keyPath
- determine 一个函数，用以决定是本文作者：唐霜，转载请注明出处。【本文受版权保护】否要执行当前这个校验规则
- validate 校验器函数，返回tru【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.nete/false
- message 校验不通过时，会返回一个【作者：唐霜】原创内容，盗版必究。Error，该message将作为错误信【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】息
- warn 一个函数，用以接受校验失败时返【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。回的error，然后进行下一步处理
- deferred 是否异步校验，为tru【本文受版权保护】【本文受版权保护】e时表示异步校验，异步校验不会阻塞校验过未经授权，禁止复制转载。【版权所有，侵权必究】程，需要在warn中接受error进行后【本文首发于唐霜的博客】【本文首发于唐霜的博客】续处理
- order 校验顺序值，值越大越早校验

【未经授权禁止转载】

【原创不易，请尊重版权】

objx.$formulate({
  path: 'body.hands.left',
  validate: value => typeof value === 'boolean',
  message: '必须为true/false',
  warn: error => window.toast(error.message),
})

objx.$strict()
objx.body.hands.left = 'true' // 报错

determine, validate,原创内容，盗版必究。未经授权，禁止复制转载。 warn中都可以使用this，指向当前本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。context，当前context通过$转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.netbind方法绑定，没有绑定时，表示obj【原创内容，转载请注明出处】【版权所有，侵权必究】ext对象自身。

$validate

执行校验器。

【访问 www.tangshuang.n原创内容，盗版必究。【原创内容，转载请注明出处】et 获取更多精彩内容】本文作者：唐霜，转载请注明出处。【作者：唐霜】

keyPath 要校验的keyPath，【本文受版权保护】【本文受版权保护】可选，不传的时候，表示一次性执行整个ob【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。jext对象的所有校验器

转载请注明出处：www.tangshua【本文受版权保护】【本文受版权保护】ng.net

【未经授权禁止转载】

nextData 该keyPath将要使【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】用的值，可选

原创内容，盗版必究。

【本文受版权保护】

其中，nextData表示提前进行校验，著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。比如，你准备要对某个keyPath进行设【本文首发于唐霜的博客】【本文首发于唐霜的博客】置新值时，可以提前通过nextData来本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】校验一下，看看是否符合校验规则。

【本文首发于唐霜的博客】【转载请注明来源】

objx.$validate('name', 'Timy')

$strict

切换严格模式。严格模式下，修改属性值也会【作者：唐霜】本文作者：唐霜，转载请注明出处。进行校验。默认情况下，严格模式是关闭的。【未经授权禁止转载】本文作者：唐霜，转载请注明出处。在前面的代码中已经有演示，这里不赘述。

【关注微信公众号：wwwtangshua【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】ngnet】【关注微信公众号：wwwtangshua本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。ngnet】

status 设为true表示开启，fa原创内容，盗版必究。转载请注明出处：www.tangshuang.netlse表示关闭

原创内容，盗版必究。

【本文首发于唐霜的博客】

【本文受版权保护】

和$silent很像，也具有继承性。

【作者：唐霜】【关注微信公众号：wwwtangshua著作权归作者所有，禁止商业用途转载。【转载请注明来源】ngnet】【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。

$isStrict

判断是否处于严格模式下。

【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。

高级用法

【访问 www.tangshuang.n【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。et 获取更多精彩内容】【本文首发于唐霜的博客】未经授权，禁止复制转载。未经授权，禁止复制转载。

批量更新

我们可能会一次性更新多个值，普通模式下，【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。每一次更新，都会触发watcher，一次本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.netwatcher执行，可能带来不同的结果，【本文受版权保护】本文版权归作者所有，未经授权不得转载。特别是有依赖性时。一般来讲，我们使用$u【本文受版权保护】【转载请注明来源】pdate进行批量更新，但是，你也可以自【原创内容，转载请注明出处】未经授权，禁止复制转载。己构造批量更新。

【关注微信公众号：wwwtangshua【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。ngnet】【原创内容，转载请注明出处】

$start

开启批量更新模式，开启后，watcher本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】不会被触发，直到调用$end。

本文作者：唐霜，转载请注明出处。【转载请注明来源】

$end

objx.$start()
objx.name = 'tom'
objx.age = 10
objx.name ='tomi'
objx.$end()

实例依赖

普通对象中的this仅会指向自身，但是由本文作者：唐霜，转载请注明出处。原创内容，盗版必究。于objext具备响应式能力，因此，有更未经授权，禁止复制转载。【原创不易，请尊重版权】丰富的依赖接口。例如objx1依赖obj本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.netx2，那么当objx2中的某个发生变化时本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。，objx1对应的属性也应该发生变化。

【未经授权禁止转载】原创内容，盗版必究。转载请注明出处：www.tangshua转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】ng.net

$depend

跨实例的属性依赖。

keyPath 当前实例的哪一个keyP【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】ath

本文版权归作者所有，未经授权不得转载。

原创内容，盗版必究。

转载请注明出处：www.tangshua本文版权归作者所有，未经授权不得转载。【作者：唐霜】ng.net

【本文受版权保护】

【未经授权禁止转载】

const objx1 = new Objext({
  get weight() {
    return objex2.age
  },
})
objx1.$depend('weight', objx2)

本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.n原创内容，盗版必究。未经授权，禁止复制转载。et 获取更多精彩内容】【原创内容，转载请注明出处】

这里需要注意的是，由于现实的限制，上面的【转载请注明来源】【未经授权禁止转载】代码中，如果没有$depend那一句，o【未经授权禁止转载】【作者：唐霜】bjx1.weight将永远使用第一次初未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。始化的缓存，而不会被修改。因此，如果要使【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。之根据实际情况进行修改，那么必须调用$d本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。epend绑定响应式关系。

本文版权归作者所有，未经授权不得转载。转载请注明出处：www.tangshua【转载请注明来源】本文版权归作者所有，未经授权不得转载。ng.net本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.n本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。et 获取更多精彩内容】

$undepend

$depen的反函数，解除依赖关系。

$bind

修改当前objext实例的context本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。。在objext实例的计算器、校验器等函本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。数中的this，将会使用$bind的参数【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。取代。

未经授权，禁止复制转载。【本文受版权保护】

著作权归作者所有，禁止商业用途转载。

未经授权，禁止复制转载。

本文版权归作者所有，未经授权不得转载。

const objx1 = new Objext({
  age: 10,
  get weight() {
    return this.age + 10
  },
})
const objx2 = new Objext({
  age: 11,
})
objx1.$bind(objx2)

上面代码中的$bind导致objx1中的【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。计算属性中的this指代objx2。

【转载请注明来源】著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】

要使得解除绑定关系，恢复this指代当前【转载请注明来源】【未经授权禁止转载】实例，$bind参数为null即可。

【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】

对比

通过objext进行数据对比超级方便。

$hash

objx1.$hash === objx2.$hash

静态方法

Objext提供了几个静态方法，可帮助开【作者：唐霜】本文作者：唐霜，转载请注明出处。发者快速实现一些功能。

【原创内容，转载请注明出处】【转载请注明来源】

isEqual

判断两个对象/值是否具有相同的内容。

原创内容，盗版必究。未经授权，禁止复制转载。【作者：唐霜】

Objext.isEqual(obj1, obj2)

isEmpty

【未经授权禁止转载】转载请注明出处：www.tangshua【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。ng.net

isArray

判断是否为数组。

【本文受版权保护】【本文首发于唐霜的博客】

isObject

判断是否为纯对象。所谓纯对象，是指非实例原创内容，盗版必究。【原创内容，转载请注明出处】的字面量对象，比如 o = {} 这种。

【原创不易，请尊重版权】未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。

inArray

判断一个值是否存在于数组中。

Objext.inArray(item, items)

inObject

判断一个key是否存在于对象中。只有可枚未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。举的key被识别。

本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。

Object.inObject(key, obj)

isInstanceOf

判断一个对象是否是一个类的实例。

Objext.isInstanceOf(obj, ClassObj)

parse

通过keyPath解析获得属性值。

let value = Objext.parse(obj, 'body.hands.left')

assign

通过keyPath设置值。

本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。【本文首发于唐霜的博客】

Objext.assign(obj, 'some.name.len', 10)

clone

克隆一个对象。

结语

Objext是一个具有丰富思想的扩展包，【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。它主要用于对数据进行管理的场景，但是它不【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】是纯粹的数据管理工具，而是对碎片数据的扩【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net展，使得一个数据拥有更丰富的接口，可进行【本文受版权保护】原创内容，盗版必究。各类操作。

基于Objext，你可以扩展出更有意思的【原创不易，请尊重版权】【本文首发于唐霜的博客】工具出来，它提供了一个思想，让你可以对自【原创内容，转载请注明出处】【原创不易，请尊重版权】己的对象数据为所欲为。

本文作者：唐霜，转载请注明出处。【转载请注明来源】【原创不易，请尊重版权】

原创内容，盗版必究。转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。未经授权，禁止复制转载。未经授权，禁止复制转载。【转载请注明来源】【版权所有，侵权必究】【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】【未经授权禁止转载】原创内容，盗版必究。未经授权，禁止复制转载。未经授权，禁止复制转载。未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】【本文首发于唐霜的博客】原创内容，盗版必究。【作者：唐霜】【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net

如果你觉得本书对你有帮助，通过下方的二维码向我打赏吧，帮助我写出更多有用的内容。

2019-02-10 | 响应式