本文實(shí)例總結(jié)了javascript 易錯(cuò)知識(shí)點(diǎn)。分享給大家供大家參考，具體如下：

為什么 typeof null === 'object'

原理是這樣的，不同的對(duì)象在底層都表示為二進(jìn)制，在JavaScript中二進(jìn)制前三位都為0的話會(huì)被判斷為 object 類型， null 的二進(jìn)制表示是全0，自然前三位也是0，所以執(zhí)行 typeof 時(shí)會(huì)返回“ object ”。

對(duì)象屬性的存在性

如 myObject.a 的屬性訪問返回值可能是 undefined ，但是這個(gè)值有可能是屬性中存儲(chǔ)的 undefined ，也可能是因?yàn)閷傩圆淮嬖谒苑祷?undefined 。那么如何區(qū)分這兩種情況呢？

var myObject = {
  a:2
};

// 方案一
("a" in myObject); // true
("b" in myObject); // false

// 方案二
myObject.hasOwnProperty( "a" ); // true
myObject.hasOwnProperty( "b" ); // false

// 方案三
Object.prototype.hasOwnProperty.call(myObject, 'b')

對(duì)象繼承的三種方法

參考如下代碼：

		function Foo(name) {
			this.name = name;
		}

		Foo.prototype.myName = function() {
			console.log(this.name)
		}

		function Bar(name, label) {
			Foo.call(this, name);
			this.label = label;
		}
        
        // 方法1
		Bar.prototype = Object.create(Foo.prototype)
        
        // 方法2
		Bar.prototype = Foo.prototype;

        // 方法3
        Bar.prototype = new Foo();

		//Bar.prototype.constructor = Bar;

		Bar.prototype.sayName = function() {
			console.log(this.name)
		}

		
		var b = new Foo('fayin')
	
		b.sayName()

上例中，三種方法都可以使 Bar 繼承 Foo.prototype 上的方法，但它們之間又有微妙的差別：

Object.create(..) 會(huì)憑空創(chuàng)建一個(gè)“新”對(duì)象并把新對(duì)象內(nèi)部的 [[Prototype]] 關(guān)聯(lián)到你指定的對(duì)象（本例中是 Foo.prototype ）。

Bar.prototype = Foo.prototype 并不會(huì)創(chuàng)建一個(gè)關(guān)聯(lián)到 Bar.prototype 的新對(duì)象，它只是讓 Bar.prototype 直接引用 Foo.prototype 對(duì)象。因此當(dāng)你執(zhí)行類似 Bar.prototype.myLabel = ... 的賦值語(yǔ)句時(shí)會(huì)直接修改 Foo.prototype 對(duì)象本身。

Bar.prototype = new Foo() 的確會(huì)創(chuàng)建一個(gè)關(guān)聯(lián)到 Bar.prototype 的新對(duì)象。但是它使用了 Foo(..)的“構(gòu)造函數(shù)調(diào)用”，如果函數(shù) Foo 有一些副作用（比如寫日志、修改狀態(tài)、注冊(cè)到其他對(duì)象、給 this 添加數(shù)據(jù)屬性，等等）的話，就會(huì)影響到 Bar() 的“后代”，后果不堪設(shè)想。

結(jié)論

因此，要?jiǎng)?chuàng)建一個(gè)合適的關(guān)聯(lián)對(duì)象，我們必須使用 Object.create(..) 而不是使用具有副作用的 Foo(..) 。這樣做唯一的缺點(diǎn)就是需要?jiǎng)?chuàng)建一個(gè)新對(duì)象然后把舊對(duì)象拋棄掉，不能直接修改已有的默認(rèn)對(duì)象。

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript傳值操作技巧總結(jié)》、《javascript編碼操作技巧總結(jié)》、《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

最新評(píng)論