這篇文章給大家分享的是有關(guān)JavaScript對象拷貝與賦值操作的示例分析的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
站在用戶的角度思考問題,與客戶深入溝通,找到工農(nóng)網(wǎng)站設(shè)計與工農(nóng)網(wǎng)站推廣的解決方案,憑借多年的經(jīng)驗,讓設(shè)計與互聯(lián)網(wǎng)技術(shù)結(jié)合,創(chuàng)造個性化、用戶體驗好的作品,建站類型包括:網(wǎng)站設(shè)計、網(wǎng)站制作、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣、申請域名、虛擬空間、企業(yè)郵箱。業(yè)務(wù)覆蓋工農(nóng)地區(qū)。
具體如下:
今天在做公司面試題的時候,遇到了一道關(guān)于JavaScript之對象拷貝與賦值的問題,突然覺得很有意義,想和大家一起來分享一下!
首先,先擺出代碼,如下:
/** * Created by Administrator on 2016/12/7. */ var obj={ name:"dahuang", age:10 } var newObj=obj; newObj.name="xiaohuang"; console.log(obj.name); console.log(newObj.name);
這個程序的結(jié)果是兩個都輸出了被修改后的名字:xiaohuang。
上述代碼使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun得到如下運行結(jié)果:
那么,大家是不是感覺到很奇怪呢,明明只修改了newObj這個對象的name值,為什么obj對象的name值也被篡改了呢?
其實原因很簡單,這是因為實際上newObj對象獲得的只是一個內(nèi)存地址,而不是真正的拷貝,所以obj對象被篡改。
但是當(dāng)我們用Object.create
這個函數(shù)創(chuàng)建一個對象時,obj對象就不會被篡改,話不多說,先上代碼:
var obj2 = { name: "dahuang", age: 10 } var newObj2 = Object.create(obj2); newObj2.name = "xiaohuang"; console.log(obj2.name); console.log(newObj2.name);
這個程序的結(jié)果是newobj2.name
的值為xiaohuang,而obj2.name
的值為dahuang,仍然保持不變。
上述代碼使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun得到如下運行結(jié)果:
使用Object.create()
方法進(jìn)行對象的拷貝,Object.create()
方法可以創(chuàng)建一個具有指定原型對象和屬性的新對象。
Object.create()方法簡介:
Object.create()
方法創(chuàng)建一個擁有指定原型和若干個指定屬性的對象。
語法
Object.create(proto, [ propertiesObject ])
參數(shù)
proto 一個對象,作為新創(chuàng)建對象的原型。 propertiesObject可選。該參數(shù)對象是一組屬性與值,該對象的屬性名稱將是新創(chuàng)建的對象的屬性名稱,值是屬性描述符(這些屬性描述符的結(jié)構(gòu)與
Object.defineProperties()
的第二個參數(shù)一樣)。注意:該參數(shù)對象不能是 undefined,另外只有該對象中自身擁有的可枚舉的屬性才有效,也就是說該對象的原型鏈上屬性是無效的。
拋出異常
如果 proto 參數(shù)不是 null 或一個對象值,則拋出一個 TypeError 異常。
eg:
//Shape - superclass function Shape() { this.x = 0; this.y = 0; } Shape.prototype.move = function(x, y) { this.x += x; this.y += y; console.info("Shape moved."); }; // Rectangle - subclass function Rectangle() { Shape.call(this); //call super constructor. } Rectangle.prototype = Object.create(Shape.prototype); var rect = new Rectangle(); rect instanceof Rectangle //true. rect instanceof Shape //true. rect.move(1, 1); //Outputs, "Shape moved."
上述代碼使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun得到如下運行結(jié)果:
感謝各位的閱讀!關(guān)于“JavaScript對象拷貝與賦值操作的示例分析”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!