资讯专栏INFORMATION COLUMN

犀牛书——CHAP6:对象

philadelphia / 1649人阅读

摘要:对象是属性的无序集合。使用对象直接量创建的对象的原型就是,使用运算符创建的对象的原型是构造函数的的值。主要目的是将对象锁定,避免外界干扰。判断对象是否封闭。删除属性可删除对象的自有属性且为的属性。

对象是属性的无序集合。因此,这一章主要从对象和属性两个方面来阐述。

1. 对象 1.1 对象的定义
对象是属性的无序集合,也可以看做是从字符串到值的映射。
1.2 对象的分类
对象可分为三类:
- 内置对象(native object):由ECMAScript规范定义的对象。如数组、函数、日期、正则表达式等都是内置对象。
- 宿主对象(host object):JS解释器所嵌入的宿主环境(比如Web浏览器)定义的。如客户端JS中的HTMLElement对象就是宿主对象。
- 自定义对象(user-defined object):运行中的JS代码创建的对象。
1.3 对象的操作 1.3.1 创建对象
创建对象主要有3种方法:对象直接量、new运算符、Object.create()
(1) 对象直接量:
    `var empty = {}`
    `var point = {x:0,y:0}`
 (2) new运算符:new + 函数调用(该函数称为构造函数constructor).使用对象直接量创建对象相当于使用 new Object()
 (3) `Object.create()`
 **每一个JS对象(null除外)都和另一个对象相关联,另一个对象就是该对象的原型。** 使用对象直接量创建的对象的原型就是Object.prototype,使用new运算符创建的对象的原型是构造函数的prototype的值。
 Object.create()接受两个参数。第一个是要创建的对象的原型对象,第二个可选,内容是属性描述符。
 对于前两种创建对象的方法,用Object.create()表示即为:Object.create(Object.prototype),Object.create(Func.prototype).
 当有第二个参数时:
        var bob = Object.create(userB, {
     "id" : {
       value: MY_GLOBAL.nextId(),
       enumerable:true // writable:false, configurable(deletable):false by default
     },
     "name": {
       value: "Bob",
       enumerable: true
     }
        });
1.3.2 序列化对象
对象序列化是指将对象的状态转化为字符串,也可将字符串还原为对象。函数、RegExp、Error、undefined值不能序列化和还原。
`JSON.stringify()`将任意的JavaScript值序列化成JSON字符串,并且**只能序列化对象的可枚举属性**。
`JSON.parse()`将一个 JSON 字符串解析成为一个 JavaScript 值。
1.4 对象的方法
所有的对象都会从Object.prototype继承属性和方法(除了以null为原型),这里先介绍Object.prototype的几个方法,其他的将会在后面的部分介绍。
- `toString()`:返回调用这个方法的对象值的字符串。返回信息少。在需要将对象转换为字符串的时候,JS会调用这个方法。
- `toLocaleString()`:返回对象的本地化字符串。Object的该方法调用toString(),Date 和 Number 则对日期、数字做本地化的转换。
- `valueOf()`:返回对象的原始值。
1.5 对象的属性
- 原型属性:每个对象都有一个原型(Object.prototype除外),ECMAScript提供了两种方法查询对象的原型。
    a. `Object.getPrototypeOf()`:返回作为参数传入的对象的原型。
    b. `isPrototypeOf()`:检测一个对象是否是另一个对象的原型。p.isPrototypeOf(o)检测p是否是o的原型。
- 可扩展性:是否可以给对象添加新属性。主要**目的是将对象锁定,避免外界干扰**。关于可扩展性有以下几种方法:
    a. `Object.isExtensible()` :检测传入的对象是否是可扩展的,返回布尔值。
    b. `Object.preventExtens()` :将对象设置为不可扩展的,意味着不能给对象添加新的属性。**将对象设置为不可扩展后不能重新设置为可扩展。**
    c. `Object.seal()`:将对象设置为不可扩展+不可配置自有属性,意味着不能给对象添加新的属性+不能对已有属性进行删除或配置。
    d. `Object.isSeal()`:判断对象是否封闭(seal)。
    e. `Object.freeze()`:不可扩展+不可配置+数据属性只读。
    f. `Object.isFrozen()`判断对象是否冻结(freeze)
2.属性 2.1 属性的分类
a.按照原型和继承可分为: 继承属性和自由属性。
b.按照属性的描述符可分为: 数据属性和存取器属性(accessor property)。
2.2 属性的描述符
属性的描述符主要是对针对属性可以进行的操作的描述。
数据属性和存取器属性共有的属性描述符是:
    - enumerable:是否可枚举,即能佛欧通过for/in 或者 Object.keys()循环。
    - configurable: 是否可以删除属性或者对属性描述符进行修改。如果configurable为false,则不能对writable之外的描述符进行修改,同时数据属性和存取器属性不可转换。也不能将可写性从false改为true。
数据属性多带带有的属性描述符是:
    - value:属性的值。
    - writable:属性的值是否可通过赋值运算符修改。
存取器属性多带带有的属性描述符是:
    - set:给属性提供setter方法,若无则为undefined.
    - get:给属性提供getter方法,若无则为undefined.

针对属性的描述符有以下几种方法:
- `Object.getOwnPropertyDescriptor()` :获得对象的特定的**自有属性**的属性描述符。第一个参数为对象,第二个为属性名。
- `Object.defineProperty(obj, prop, descriptor)` :给对象添加新的属性或者修改已有属性的属性描述符,并返回该对象。通过该方法添加的属性,其默认的属性描述符都为false.通过赋值运算符设置的属性的属性描述符默认为true.
- `Object.defineProperties(obj, props)`:同时修改或添加多个属性。
2.3 对属性的操作 2.3.1 查询和设置
有两种方式可查询设置对象的属性:.和[]。.的右侧必须是有效标识符且不能是保留字。而[]则可以动态获取属性以及可以转换为字符串的属性。由于[]访问与数组很相似,因此也叫作关联数组。
属性的赋值会先检查原型链,若原型链有该属性且该属性为不可写,则不能给该属性赋值。若原型链存在且可写,或者原型链不存在该属性,则该属性就变为自有属性,且不会修改原型对象的属性值。
2.3.2 删除属性
`delete`可删除对象的自有属性且configurable为true的属性。注意:delete只是断开属性与对象的关系,而不是操作属性中的属性。由此可能造成内存泄漏。
2.3.3 检测属性
检测属性主要检测两方面:(1)属性是否存在在对象中;(2)哪些属性是自有属性.提供的方法如下:
- `in`操作符。检测自有和继承属性中是否包含该属性。同时若属性值为undefined,返回true,若属性不存在返回false. property in obj
- `hasOwnProperty()`: obj.hasOwnProperty("x")检测属性”x”是否是obj对象的自有属性。
- `propertyIsEnumerable()`: obj.propertyIsEnumerable("x")检测属性”x”是否是obj对象的自有属性+该属性是否可枚举.当同时为true时才返回true.
2.3.4 枚举属性
枚举属性主要有三种方法:
- `for/in`:遍历所有**可枚举**的自有+继承属性。把属性名称赋值给循环变量。(枚举+所有)
- `Object.keys()`:以**数组形式**返回对象的所有**可枚举**的**自有属性**的名称。(枚举+自有)
- `Object.getOwnpropertyNames()`:以**数组形式**返回对象的所有自有属性。(自有+可枚举+不可枚举)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79837.html

相关文章

  • 犀牛——CHAP8:函数

    摘要:若有函数名,则在函数体内指代该函数本身,并且只存在于函数体中。返回值与普通函数相同。如果嵌套函数作为普通函数调用,则指向全局对象或者构造函数调用在函数或者方法调用之前使用关键字,则为构造函数调用。创建一个新的对象继承构造函数的属性。 showImg(https://box.worktile.com/view/ddbade8c84bb41cdb20db15228584b8e?pid=4b...

    he_xd 评论0 收藏0
  • 如何循序渐进地学习Javascript

    摘要:如果在初学一门语言的时候第一想到的是问别人,是很难取得进步的。如果你真想学好,我有个大概的自学轨迹供你们参考。第一步,学习的编程。立即可以尝试的实例,也可以让的初学者马上看到效果。读懂别人的代码是学习,而改进别人的代码则是创造了。 javascript入门太容易了,导致几乎人人随便看看就能上手,零基础的人学个三五天都能对外宣称自己掌握了js。可是真正掌握js是一件很难的事情。如果在初学...

    DTeam 评论0 收藏0
  • 犀牛——CHAP7:数组

    摘要:数组有以下特点无类型数组元素可以是任意元素。因此,当小于数组最大索引时,大于的数组元素会被删除。原数组不会改变将数组元素转换为字符串并连接在一起。默认将数组元素用,连接,传入的参数即为连接符。 showImg(https://box.worktile.com/view/fcfcdf2c99b14edfb6768085955ae253?pid=4b0845b09ca94218a955f8...

    Alfred 评论0 收藏0
  • 犀牛——CHAP10:正则表达式

    摘要:设计目的是为了让在全局范围内有效。在正则表达式后部引用前面的子表达式。传入分隔符或正则表达式。对象属性以下属性返回布尔值。是否包含修饰符以下不返回布尔值整个字符串下一次搜索开始的位置。返回布尔值,若匹配则返回。 1. 正则表达式语法 1.1 表示方法 - `//`字面量模式,`/表达式/修饰符` - 使用`new RegExp(字符串,修饰符 | 正则表达式)`构造函数。 在ES5中,...

    JessYanCoding 评论0 收藏0
  • 如果想成为一名顶尖的前端,这份单你一定要收藏!

    摘要:其中负载均衡那一节,基本上是参考的权威指南负载均衡的内容。开发指南读了一半,就是看这本书理解了的事件循环。哈哈创京东一本骗钱的书。 欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由腾讯IVWEB团队 发表于云+社区专栏作者:link 2014年一月以来,自己接触web前端开发已经两年多了,记录一下自己前端学习路上看过的,以及道听途说的一些书,基本上按照由浅入深来介绍...

    callmewhy 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<