JavaScript对象（Object）

唯有奶茶解百忧
111 阅读2分钟

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第3天，点击查看活动详情

大家好！我是前端爬楼工程师🚹，一个野生程序员。好奇新技术，仰慕牛大佬。如果喜欢我的文章，可以关注➕点赞，为我注入能量，与我一同成长吧～

说到对象，首先得提提JavaScript的数据类型：

类型

六种数据类型：string number boolean undefined null object 其中前五种是简单基本类型，最后一个是复杂基本类型

区别:

  • undefined 和 null 只有文字的形式； 
    var a = undefined
  • string number boolean 有字面量的形式，也有对应的构造形式; 与上面的区别就是这几种类型有自己属性和方法可以调用，调用的时候，引擎会将这些类型转换为对象，调用完毕，还原成简单基本类型； 
    // 文字形式：
var a = "1"
// 构造形式：
var a = new String("1")
  • 其他object的类型只有构造形式， 也称内置对象；比如说:Array, Date, Function, RegExp, Error

api

对于属性的约束，对象有如下几个api:

  • Object.defineProperty: 可自由配置；
  • Object.preventExtensions： 不能创建属性；
  • Object.seal：除了不能创建属性，还不能配置(这里的配置指的是调用Object.defineProperty)或者删除现有属性，但可以修改;
  • Object.freeze 什么都不能干；
//创建一个常量
var myObject1 = {}
Object.defineProperty(myObject1, "prop" , {
    value: 42,
    writable: false,
    configurable: false
})
// preventExtensions
var myObject2 = {
 a:2
}
Object.preventExtensions(myObject2)
delete myObject2.a
myObject2.b = 3 // 严格模式会抛TypeError错误
myObject2.b // undefined 创建失败 
// seal
var myObject3 = {
 a:2
}
Object.seal(myObject3)
myObject3.a = 3
myObject3.a  // 3
delete myObject3.a // false

对象的特殊属性

  • [[Get]]：在我们访问属性的时候会实现了[[Get]]操作，首先会在对象上查找该属性，如果没有找到，就去[[Prototype]]（原型链上找），如果也没找到返回 undefined
  • [[Put]]: 这操作是配置属性和创建属性触发的。 如果配置或创建的属性存在该对象上
    • 首先判断属性是否是访问描述符（Getter），如果是并且存在setter就调用setter
    • 如果描述符writable为false, 静默失败，严格模式抛出异常
    • 如果都不是就设置属性的值
  • Getter和Setter 会影响返回的值或设置的值；

如何区分一个属性是因为设置的undefined还是由于找不到该属性而返回的undefined？ 答案是：in 操作符

存在性

'a' in obj // 检查属性是否在对象上或原型链上
obj.hasOwnProperty('a') // 检查属性是否在对象上
// obj 为null时
Object.prototype.hasOwnProperty.call(obj, 'a')

枚举

可枚举的都能用for..in遍历出来,for..in循环遍历在对象是包含是对象的属性，在数组上不仅有属性还有索引

obj.propertyIsEnumerable('a') //js判断一个属性是否可枚举: 
Object.keys(obj) // 返回可枚举的属性
Object.getOwnPropertyNames(obj) // 返回所有属性
avatar
文章
阅读
粉丝