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"] }
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/76822.html
標籤:JavaScript
上一篇:BFC
下一篇:JavaScript變數
