我在东北烤地瓜

I am kaodigua I am chirourou I am qiaodaima

导航

Object API

目录

Object API

创建对象

  1. 对象字面量

    let obj = {}

    语法糖,最终会被引擎转化为 let obj = new Object()

  2. 原型继承的方式

    let obj2 = Object.create({})

    通过原型继承的方式来创建对象,创建出的对象o是一个空对象,并且o的原型指向了{}

    Object.create = function(obj2){
     let F = function(){}
     f.prototype = obj2
    return new F()
}
理解为F为一个空的构造函数,F原型指向传入的参数,返回F的实例
通过Object.create生成的对象的原型指向了传入的参数,实现原型继承

    这种方式下,

    obj2._proto_指向{}空对象
obj2._proto_._proto_指向对象的原型
obj2._proto_._proto_ == Object.prototype

  3. new 构造函数

    当用new运算符调用一个函数时,函数返回一个对象,通过构造函数内this指向要返回的对象

function Person (name){
    this.name = name
}
let a = new Person('cici')
//此时a = Person{name:'cici'}


function Person2 (name){
    let obj = {}
    this.name = name
    return obj
}
let a2 = new Person('cici')
//此时a2 = person{name:'cici'}

function Person3 (name){
    this.name = name
    return 'xixi'
}
let a3 = new Person3('cici')

//此时a3 = person{name:'cici'}
//console.log(Person3()) //xixi
//console.log(a3()) // a3 is not a function
//console.log(a3)  //Person3 {name: "cici"}
  1. Object.entries

将对象中的所有key:value转为[key,value]格式，返回包含所有健值对的二维数组

    let obj = {name: 'derek',age:18}
    let result = Object.entries(obj) 
    console.log(result) // => [['name','derek'],['age',18]]
  1. Object.fromEntries()

把Object.entries转换后的二维数组重新转换为对象

    let obj = {a:1,b:2}
    let entrise = Object.entries(obj)//[[a:1],[b:2]]
    let obj2 = Object.fromEntries(entries)   // {x:3,y:4}

6.Object.assign()

将多个对象合并到目标的属性合并到目标对象中，相同属性的值以最后一个合并对象的为准，返回目标对象，不改变被合并对象，可以实现浅克隆

  • 语法: Object.assign(obj,obj1,obj2...)
  • obj: 目标对象，可传{}
  • obj1,obj2...: 被合并的对象，一个或多个
  • PC端IE全不兼容，移动端只有少量浏览器兼容
  let obj = {name: 'derek',age: 18}
  let obj1 ={ name: 'tom', sex: 'F' }
  let result = Object.assign({},obj,obj1,{aa:1})
  console.log(result)   // => {name:'tom',age:18,sex: 'F',aa:1}
  console.log(obj)     // => {name: 'derek',age: 18}
  console.log(obj1)   // => { name: 'tom', sex: 'F' }
  1. Object.defineProperty()

Object.defineProperty(obj,prop,descriptor):对obj对象上对prop属性进行定义或修改，其中descriptor为被定义或修改的属性符。

其中对于descriptor属性符可以设置的值如下显示

  • value:表示属性的值，默认为undefined
  • writable:该属性是否为可写，如果直接在对象上定义属性，则默认为true。如果设置为false，则属性仅为可读。
  • configurable: 如果为false的话，则不能修改（writabel,configurable,enumerable），如果直接在对象上定义属性，则默认为true
  • enumerable:是否能够被枚举，如果直接在对象上定义属性，则默认为true
  • get:当对象访问prop属性的时候，会调用这个方法，并返回结果。默认为undefined
  • set:当对象设置该属性的时候，会调用这个方法，默认为undefined 注意：兼容性不错，移动端几乎全兼容，PC端兼容IE9以上，IE8也能运行，但是只能传dom对象
      var obj = {}, value = null;
  Object.defineProperty(obj, "num", {
      get: function(){
          console.log('执行了 get 操作')
          return value;
      },
      set: function(newValue) {
          console.log('执行了 set 操作')
          value = newValue;
      }
  })
 
  obj.num = 1 // 执行了 set 操作
 
  console.log(obj.num) // 1 执行了 get 操作
  1. Object.getOwnPropertySymbols()

Object.getOwnPropertySymbols(obj): 返回一个对象中所有以Symbol类型为key的的数组

  let obj = {name: 'derek'}
  let a =Object.getOwnPropertySymbols(obj)
  console.log(a) // => []
  let sys = Symbol()
  obj[sys] = 'test'
  let b =Object.getOwnPropertySymbols(obj)
  console.log(b) // => [Symbol()]
  1. Object.freeze()`

Object.freeze(obj):浅冻结一个对象，使其不能做任何修改，深层级的还是可以修改

如果要实现深度冻结，可以通过递归来实现

  let obj = {name: 'derek',child:{age:18}}
  Object.freeze(obj)
  obj.name = 'tom' // 不能修改原有属性对应的值
  console.log(obj) // => {name:'derek'}  
  obj.test = 'test' // 不能给对象添加新属性
  console.log(obj)  // => {name: 'derek'}
  delete obj.name   // 不能删除对象的属性
  console.log(obj)  // => {name: 'derek'}
 
  obj.child.age=22 // 可以对深层级的进行修改
  console.log(obj.child) // => {age:22}
  1. Object.isFrozen()

判断一个对象是否被冻结,是放回true，反之返回false

  let obj = {name: 'derek'}
  Object.isFrozen(obj) //=> false
  Object.freeze(obj)
  Object.isFrozen(obj) //=> true
  1. Object.getOwnPropertySymbols()

返回一个对象中所有以Symbol类型为key的的数组

  let obj = {name: 'derek'}
  let a =Object.getOwnPropertySymbols(obj)
  console.log(a) // => []
  let sys = Symbol()
  obj[sys] = 'test'
  let b =Object.getOwnPropertySymbols(obj)
  console.log(b) // => [Symbol()]
  1. Object.keys()

查找目标对象的所有key值，并返回一个包含所有key值的数组，和Object.getOwnPropertyNames()效果一致

  let obj = {name: 'derek',age:22,sex:'M'} 
  let a = Object.keys(obj)
  console.log(a) //=> ['name','age','sex']
  1. Object.values()

返回一个对象的所有value值的数组集合

  let obj = {name: 'derek',age:18}
  let result = Object.values(obj) 
  console.log(result) // => ['derek',18]
  1. Object.seal()

对一个对象进行密封，并返回被密封的对象，这些对象都是不能够添加属性，不能删除已有属性，以及不能够修改已有属性的可枚举型、可配置型、可写性

  let obj = {name: 'derek'}
  Object.seal(obj)
  obj.name = 'tom' // 可以修改原有属性对应的值
  console.log(obj) // => {name:'tom'}  
  obj.test = 'test' // 不能给对象添加新属性
  console.log(obj)  // => {name: 'tom'}
  delete obj.name   // 不能删除对象的属性
  console.log(obj)  // => {name: 'tom'}
  1. Object.isSealed()

判断一个对象是否被密封,是放回true，反之返回false

  let obj = {name: 'derek'}
  Object.isSealed(obj) //=> false
  Object.freeze(obj)
  Object.isSealed(obj) //=> true
  1. Object.preventExtensions()

让一个对象永远不能添加新的属性，严格模式下会报错

  let obj = {name: 'derek'}
  obj.age = 22 
  console.log(obj.age) // => 22
  Object.preventExtensions(obj)
  obj.sex = 'M'  // 报错
  obj._proto_.sex = 'M'  //可以在原型对象上添加属性
  console.log(obj.sex) // => 'M'
  1. Object.isExtensible()

判断一个对象是否可以修改属性,是放回true，反之返回false

    let obj = {name: 'derek'}
    Object.isExtensible(obj) //=> true
  1. Object.is(val1,val2)

确定两个值是否是相同的值

  • 注意：与=相比，其会将-0和+0看成不等，并且对于两个NaN的比较，Object.is()会看成是相等的，而=会将0、-0、+0看成相等的，两个NaN看成不等
  Object.is(0,-0) // => false
  Object.is(0,0) // => true
  Object.is(NAN,0/0) // => true
  Object.is(3,3/1) // => true
  1. Object.getPrototypeOf(obj):

该方法返回对象的原型对象，如果没有的话，则返回null。

  let obj = {name: 'derek',age:22,sex:'M'} 
  let a = Object.getPrototypeOf(obj)
  1. Object.getOwnPropertyDescriptor(obj,prop)

查询prop属性存是否在对象obj上，在则返回其属性描述符，如果不存在就返回undefined

属性描述符包括：

  • value:表示属性的值，默认为undefined
  • writable:该属性是否为可写，如果直接在对象上定义属性，则默认为true。如果设置为false，则属性仅为可读。
  • configurable: 如果为false的话，则不能修改（writabel,configurable,enumerable），如果直接在对象上定义属性，则默认为true
  • enumerable:是否能够被枚举，如果直接在对象上定义属性，则默认为true
  • get:当对象访问prop属性的时候，会调用这个方法，并返回结果。默认为undefined
  • set:当对象设置该属性的时候，会调用这个方法，默认为undefined
  let obj = {name: 'derek',age:22,sex:'M'}
  let a = Object.getOwnPrepertyDescriptor(obj,'name')
  let b = Object.getOwnPrepertyDescriptor(obj,'test')
  console.log(a) // => {value:'derek',writable: true,enumerable: true,configurable: true}
  console.log(b) // => undefined
  1. Object.getOwnPropertyNames(obj)

查找目标对象的所有key值，并返回一个包含所有key值的数组，和Object.keys()效果一致

  • 枚举的顺序,返回一个数组，枚举出来对象的属性
  • 对象的顺序其实是浏览器厂商自行规定
    先排数字，升序 再排其他，按照书写顺序、
  let obj = {name: 'derek',age:22,sex:'M'} 
  let a = Object.getOwnPropertyNames(obj)
  console.log(a) //=> ['name','age','sex']
  1. hasOwnProperty(propertyName String)

检查指定的属性是不是自有属性的

区分对象的那些属性是自己的，那些是共有

属性（从父对象哪里继承来的）？

如果要检查是共有属性的话，还需要排除没有这个属性 共有属性是指在原型对象中声明的属性

参数：
propertyName String类型指定的属性名称

返回值:
函数的返回值为Boolean类型。如果对象object具有名称为propertyName的属性，则返回true，否则返回false。

  1. Object.setPrototypeOf()

设置某个对象的隐式原型 proto

    let obj1 = {a:1}
    let obj2 = {b:2}

    Object.setPrototypeOf(obj1,obj2)
    console.log(obj1.__proto__)//{b:2}

posted on 2021-09-26 18:01  我在东北烤地瓜  阅读(24)  评论(0)  编辑  收藏  举报