- A+
所属分类:Web前端
javascript Object常用方法使用总结
1、Object构造函数-继承
-只有构造函数才有prototype属性
-js每个对象都有一个__proto__属性 === 构造函数的prototype属性
objectInherit() { function conObj () {} conObj.prototype.age = '12' let newPreObj = new conObj() console.log(newPreObj.age) // 12 console.log(newPreObj.__proto__ === conObj.prototype) // true },
2、Object.assign()-用于将一个或者多个对象的可枚举的值从源对象复制到目标对象。返回目标对象
testForObjectAssign() { let target = {name: 'xiaomin'} let source = {age: '14',name:'hua'} // 如果目标对象中有相同的属性,源对象的属性值将覆盖目标对象的属性值(name:'xioamin'>'hua') const finalObj = Object.assign(target, source) console.log(target, finalObj) // {name: 'hua', age: '14'} // 关于可枚举属性值 // for-in无法遍历出来的属性-不可枚举 let obj1 = {a:1,b:2,c:{d:3}} for(let key in obj1) { console.log(key) // a b c } let finalObj2 = Object.assign({}, obj1) obj1.a = 5 finalObj2.b = 6 obj1.c.d = '4' // 可枚举出来的属性值相当于深拷贝,{d:4}是不可枚举的属性;所以Object.assign并不能完全的用于深拷贝 console.log(obj1) // {a:5,b:2,c:{d:4}} console.log(finalObj2) // {a:1,b:2,c:{d:4}} },
3、Object.defineProperty()-用于直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象
// Object.defineProperty()用于直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象 testForObjectDefineProperty() { let obj1 = { name: 'xiaomin' } // 新增age属性 Object.defineProperty(obj1, 'age', { value: '12', // value:数据描述符 writable: false, // 数据描述符;writable:false情况下(即默认情况下),使用 Object.defineProperty() 添加的属性值是不可修改(immutable)的 enumerable: true, // enumerable:true(默认false)时,新增的属性时可枚举属性 configurable: true // configurable:tue(默认值为false),属性描述值可修改 }) // 修改name属性 Object.defineProperty(obj1, 'name', { value: 'xiaohua' }) // 属性描述值修改-configurable:true Object.defineProperty(obj1, 'age', { writable: true }) // obj1.age = '14' for(let key in obj1) { console.log(key, '枚举出来的属性') // enumerable:true // name 枚举出来的属性 // age 枚举出来的属性 // enumerable:false // name 枚举出来的属性 } console.log(obj1) // {name: 'xioahua', age: '12'} // Object.defineProperty的存取描述符get()和set()方法 // testDate-newobject.num的值会互相影响(vuejs双向绑定的原理) let newobject = {} let testDate = 88 Object.defineProperty(newobject, 'num', { get(){return testDate}, set(val){ testDate = val }, enumerable: true, configurable: true }) newobject.num = '000' // 数据的双向绑定 console.log(newobject.num, testDate) },
4、Object.keys()、Object.values()
Object.keys()返回一个指定对象可枚举属性的属性名组成的数组
Object.values()返回一个指定对象可枚举属性的属性值组成的数组
// 可用于判断对象是否为空 testForObjectkeys() { let myObj = {name:'xioamin', age:'12'} console.log(Object.keys(myObj)) // ["name", "age"] console.log(Object.values(myObj)) // ["xiaomin", "12"] }