JavaScript 中的屬性復制是指將一個對象的屬性值復制到另一個對象中的過程。常見的應用場景包括初始化對象,擴展對象和繼承對象等。下面我們來看一些具體的例子:
// 初始化對象 let obj1 = {"name": "Tom", "age": 18}; let obj2 = {"name": "", "age": 0}; for(let key in obj1){ obj2[key] = obj1[key]; } console.log(obj2); // {"name": "Tom", "age": 18} // 擴展對象 let obj3 = {"name": "Jerry"}; let obj4 = {"age": 20}; for(let key in obj4){ obj3[key] = obj4[key]; } console.log(obj3); // {"name": "Jerry", "age": 20} // 繼承對象 let parent = {"name": "Anna", "age": 30}; function child(){ this.gender = "female"; } child.prototype = parent; let obj5 = new child(); console.log(obj5.name); // "Anna" console.log(obj5.age); // 30
可以看到,JavaScript 中的屬性復制可以通過 for...in 循環遍歷對象,將源對象的屬性值逐一賦給目標對象,實現屬性復制的過程。屬性復制還可以通過淺拷貝和深拷貝實現不同程度的屬性復制。
淺拷貝指將一個對象的屬性值復制到另一個對象中,如果屬性值是引用類型,則復制的只是引用,而不是值本身。這意味著,修改復制后對象中的引用類型屬性值,會影響源對象中的屬性值。下面我們來看一個例子:
let obj1 = {"name": "Tom", "age": 18, "pets": {"dog": "happy", "cat": "lucky"}}; let obj2 = Object.assign({}, obj1); console.log(obj2.pets.dog); // "happy" obj2.pets.dog = "sad"; console.log(obj1.pets.dog); // "sad"
可以看到,修改 obj2 中的 pets 屬性值,也會修改 obj1 中的 pets 屬性值。
深拷貝則是將一個對象的屬性值復制到另一個對象中,如果屬性值是引用類型,則復制的是引用類型值本身,而不是引用,這樣就可以實現修改復制后對象中的引用類型屬性值,不會影響源對象中的屬性值。下面我們來看一個例子:
let obj1 = {"name": "Tom", "age": 18, "pets": {"dog": "happy", "cat": "lucky"}}; let obj2 = JSON.parse(JSON.stringify(obj1)); console.log(obj2.pets.dog); // "happy" obj2.pets.dog = "sad"; console.log(obj1.pets.dog); // "happy"
可以看到,修改 obj2 中的 pets 屬性值,不會影響 obj1 中的 pets 屬性值。
JavaScript 中的屬性復制是一種常見的操作,不僅可以用于對象初始化、對象擴展和對象繼承等場景,還可以通過淺拷貝和深拷貝實現不同程度的屬性復制。在實際開發中,可以根據需要選擇合適的復制方式,并結合具體的業務需求,靈活運用屬性復制技術,提高開發效率。