javascript中對象的經常使用方法,深克隆和淺克隆以及凍結,擴展,密封三大屬性的區別

對象做爲引用類型,工做中免不了複製對象,下面來看看克隆的方法

Object.assign() 方法用於將全部可枚舉屬性的值從一個或多個源對象複製到目標對象。它將返回目標對象。淺克隆:
const obj1 = {
    a: 1,
    b: 2,
    title: {
        name: '張三'
    }
};
const obj2 = Object.assign({}, obj1);
console.log(obj2); //{ a: 1, b: 2 ,title:{name:'張三'}}
obj1.title.name = '李四';  //修改obj1的值,再來打印看下obj2的值
console.log(obj2)   //{ a: 1, b: 2,title:{name:'李四'} }
console.log(obj1)  //{ a: 1, b: 2,title:{name:'李四'} }
Object深克隆的一種方式,主要方式是把對象轉爲JSON字符串,而後再轉爲對象
var cloneObj = JSON.parse(JSON.stringify(obj));
對象中有凍結,擴展,密封三大屬性,freeze,seal,preventExtensions,來看看3個屬性的區別
Object.freeze(obj) 方法能夠凍結一個對象,不能修改,新增,刪除任何屬性和值
let freeze1 = {
    a: '1'
};
let freeze2 = Object.freeze(freeze1);
freeze2.a = 2;
console.log(freeze2) //1
Object.isFrozen(obj) 方法判斷對象是否被凍結
console.log(Object.isFrozen(freeze2))   //true
Object.seal(obj) 方法封閉一個對象,阻止添加新屬性並將全部現有屬性標記爲不可配置。當前屬性的值只要可寫就能夠改變。
let seal = {};
Object.seal(seal);  //封閉對象
Object.isSealed(obj) 方法判斷一個對象是否被密封。
console.log(Object.isSealed({}), '------'); //false
console.log(Object.isSealed(seal), '------'); //true
Object.preventExtensions(obj) 方法讓一個對象變的不可擴展,也就是永遠不能再添加新的
Object.isExtensible(obj) 法判斷一個對象是不是可擴展的是否能夠在它上面添加新的屬性。

對象可枚舉屬性和不可枚舉屬性,一直傻傻分不清,在javascript中,對象的屬性氛圍可枚舉和不可枚舉之分,屬性的枚舉性主要影響一下三個函數的結果,

for ...in 
Object.keys()
JSON.stringify()

先看一個例子,建立一個對象javascript

function Person() {
    this.name = 'KEY'
}

Person.prototype = {
    constructr: Person,
    jos: 'student'
};

var key = new Person();
Object.defineProperty(key, 'sex', {
    value: 'female'
})
console.log(key.sex, '------') //female ------  直接訪問能夠獲取的key.sex
for (var pro in key) {         //遍歷沒法打印不可枚舉對象
    console.log('pro:' + pro + ';' + key[pro])
}
 pro:name;KEY    
 pro:constructr;function Person(){
     this.name='KEY'
 }
 pro:jos;student
obj.propertyIsEnumerable(prop) 方法返回一個布爾值,表示指定的屬性是否可枚舉
console.log(Number.propertyIsEnumerable('parseint')) //false
Object.defineProperties();方法直接在一個對象上定義新的屬性或修改現有屬性,並返回該對象。
Object.defineProperties(obj, props) 
*obj 爲源對象
*props是一個對象,裏面有configurable,enumerable,value,writable,get,set
*configurable 屬性描述符的類型能夠被改變而且該屬性能夠從對應對象中刪除。默認false
*enumerable 是否爲枚舉屬性  默認爲false
*value 任意值,默認undefined
*writable 能夠經過賦值改變  默認false
*get 返回value值,默認undefinde
*set 設置value值,默認undefine

var defind = {};
Object.defineProperties(defind, {
    'v1': {
        value: '12'
    }
});
console.log(defind.v1) //12
Object.defineProperty() 方法會直接在一個對象上定義一個新屬性,或者修改一個對象的現有屬性, 並返回這個對象。
Object.defineProperty(obj,name, prop)  
*obj 爲源對象  name爲修改的屬性名或設置,prop同上

Object.defineProperty(defind, "key", {
    enumerable: false,
    configurable: false,
    writable: false,
    value: "static"
});
Object.entries() 方法返回一個給定對象自身可枚舉屬性的鍵值對數組
Object.getOwnPropertyDescriptor(obj, prop) //方法返回指定對象上一個自有屬性對應的屬性描述符
console.log(Object.getOwnPropertyDescriptor(freeze1, 'a'));
{ value: '1',
 writable: false,
enumerable: true,
 configurable: false }
Object.is(value1, value2)方法判斷兩個值是不是相同的值。
console.log(Object.is({}, {})); //false
console.log(Object.is([], {})); //false
console.log(Object.is([], [])); //false
obj.hasOwnProperty(prop) 檢查對象有沒有該屬性
var o = {
    prop: 'exists'
};
console.log(o.hasOwnProperty('prop'));             // 返回 true
console.log(o.hasOwnProperty('hasOwnProperty'));   // 返回 false

天天進步一點,但願你們喜歡,也但願喜歡的朋友點個贊,後續繼續更新...java

相關文章
相關標籤/搜索