解析Javascript中難以理解的11個(gè)問(wèn)題
1.原始值與引用值
原始值存放在棧里, 引用值存放在堆里. 如程序:
function Person(id,name,age){
this.id = id;
this.name = name;
this.age = age;
}
var num = 10;
var bol = true;
var str = "abc";
var obj = new Object();
var arr = ['a','b','c'];
var person = new Person(100,"笨蛋的座右銘",25);
2.undefined和null
undefined: 變量未定義; 是Undefined類(lèi)型的專(zhuān)屬值;
null:引用未分配; 是Null類(lèi)型的專(zhuān)屬值.
typeof(undefined) == undefined;
typeof(null) == object;
undefined==null;
undefined!==null;
null instanceof Object == false;
undefined instanceof Object == false;
雖然有Undefined和Null類(lèi)型, 但是通過(guò)下面的例子說(shuō)明這兩個(gè)類(lèi)型是不可見(jiàn)的, 也就是說(shuō)我們只能使用他們的值:
alert(undefined instanceof Undefined);
alert(null instanceof Null);
3.偽數(shù)組
特點(diǎn):
1) 具有l(wèi)ength屬性;
2) 像數(shù)組一樣按索引順序存取數(shù)據(jù);
3) 不具備數(shù)組特有的操作數(shù)據(jù)的方法如push, pop, slice...
偽數(shù)組都可以通過(guò)Array.prototype.slice轉(zhuǎn)換為真正的數(shù)組:
var faceArray = {0: 'a', 1: 'b', length: 2}//標(biāo)準(zhǔn)的偽數(shù)組;
var realArray = Array.prototype.slice.call(fakeArray);
js中的偽數(shù)組:arguments, node.childNodes, document.getElementsByTagName()...
IE中的問(wèn)題 : IE中node.childNodes是不能用slice轉(zhuǎn)化的.
Jquery中的偽數(shù)組 : Jquery本身就是一個(gè)偽數(shù)組:
alert($('.class1').length); alert($('.class1').[0].tagName);
4.關(guān)于簡(jiǎn)單類(lèi)型的字面量
var a = 1; b = true, c = "ccc";
字面量看起來(lái)有類(lèi)型
alert(typeof a);//number
alert(typeof b);//boolean
alert(typeof c);//string
但是通過(guò)instanceof卻測(cè)不出來(lái)
alert(a instanceof Number)//false
alert(a instanceof Object)//false
alert(b instanceof Boolean)//false
alert(b instanceof Object)//false
alert(c instanceof String)//false
alert(c instanceof Object)//false
5.函數(shù)的prototype屬性和對(duì)象實(shí)例的內(nèi)部prototype屬性
每個(gè)function(構(gòu)造函數(shù))都有一個(gè)prototype屬性, 每個(gè)對(duì)象實(shí)例都有一個(gè)不可見(jiàn)的(mozilla把它公開(kāi)了, 可以通過(guò)__proto__來(lái)取得)內(nèi)部的prototype屬性, 它指向構(gòu)造函數(shù)的prototype屬性. prototype還可以有它自己的prototype屬性, 這構(gòu)成了prototype鏈, Object是最頂?shù)膶?duì)象, 所以所有的prototype鏈最終會(huì)指向Object.prototype. 當(dāng)訪問(wèn)對(duì)象實(shí)例的屬性/方法的時(shí)候, 從對(duì)象實(shí)例自己開(kāi)始搜索, 若果搜索不到, 沿著prototype鏈向上搜索, 直到Object.prototype.prototype == null 為止.
6.構(gòu)造函數(shù)的一個(gè)小秘密
var s = new function(){return "sss"};
alert(s);//[object Object]
s = new function(){return new String("sss")};
alert(s);//sss
關(guān)于這段代碼的解釋:
只要 new 表達(dá)式之后的 constructor 返回(return)一個(gè)引用對(duì)象(數(shù)組,對(duì)象,函數(shù)等),都將覆蓋new創(chuàng)建的匿名對(duì)象,如果返回(return)一個(gè)原始類(lèi)型(無(wú) return 時(shí)其實(shí)為 return 原始類(lèi)型 undefined),那么就返回 new 創(chuàng)建的匿名對(duì)象.
7.對(duì)象的創(chuàng)建的過(guò)程
function Person(name){
this.name = name;
}
Person.prototype = {
getName: function(){return this.name}
};
var p = new Person('zhangsan');
解密p的創(chuàng)建過(guò)程:
◦創(chuàng)建一個(gè)build-in object對(duì)象obj并初始化;
◦將p的內(nèi)部[[Prototype]]指向Person.prototype;
◦將p作為this,使用arguments參數(shù)調(diào)用Person的內(nèi)部[[Call]]方法, 即執(zhí)行Person函數(shù)體, 并返回返回值, 如果沒(méi)有return, 則返回undefined;
◦如果前一步返回的是Object類(lèi)型, 則返回這個(gè)值給p, 否則返回obj.
8.對(duì)象的自有屬性和繼承屬性
function Person(name){
this.name = name;
}
Person.prototype = {
type: 'human',
getName: function(){return this.name}
};
var p = new Person('zhangsan');
alert(p.hasOwnProperty('type'));//false
p.type = 'ren';
alert(p.hasOwnProperty('type'));//true
運(yùn)行結(jié)果很明確,對(duì)象的屬性無(wú)法修改其原型中的同名屬性,而只會(huì)自身創(chuàng)建一個(gè)同名屬性并為其賦值。
9.函數(shù)對(duì)象的創(chuàng)建過(guò)程
創(chuàng)建一個(gè)build-in object對(duì)象fn;
將fn的內(nèi)部[[Prototype]]設(shè)為Function.prototype;
設(shè)置內(nèi)部的[[Call]]屬性,它是內(nèi)部實(shí)現(xiàn)的一個(gè)方法,處理函數(shù)調(diào)用的邏輯。(簡(jiǎn)單的理解為指向函數(shù)體);
設(shè)置fn.length為funArgs.length,如果函數(shù)沒(méi)有參數(shù),則將fn.length設(shè)置為0;
fn.prototype的constructor指向fn自己;
返回fn.
10.instanceof的原理
查看a是不是B的實(shí)例, 就是看B的prototype(構(gòu)造函數(shù)的prototype屬性)指向的對(duì)象在不在a的原形鏈上.
11.關(guān)于Function和Object的猜測(cè)
alert(Function instanceof Function);//true
alert(Function instanceof Object);//true
alert(Object instanceof Function);//true
alert(Object instanceof Object);//true
想了好久, 沒(méi)有想透......
相關(guān)文章
es5 類(lèi)與es6中class的區(qū)別小結(jié)
這篇文章主要給大家介紹了關(guān)于es5 類(lèi)與es6中class區(qū)別的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11js動(dòng)態(tài)生成按鈕并動(dòng)態(tài)生成8位隨機(jī)數(shù)
用js生成按鈕,動(dòng)態(tài)生成8位隨機(jī)數(shù)的腳本2008-09-09JavaScript實(shí)現(xiàn)封閉區(qū)域布爾運(yùn)算的示例代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)封閉區(qū)域布爾運(yùn)算的示例代碼,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-06-06超好玩js頁(yè)面效果之實(shí)現(xiàn)數(shù)值的動(dòng)態(tài)變化
這篇文章主要給大家介紹了關(guān)于超好玩js頁(yè)面效果之實(shí)現(xiàn)數(shù)值的動(dòng)態(tài)變化的相關(guān)資料,文中通過(guò)示例代碼及圖文介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-10-10JavaScript實(shí)現(xiàn)垂直滾動(dòng)條效果
這篇文章為大家詳細(xì)主要介紹了JavaScript實(shí)現(xiàn)垂直滾動(dòng)條效果的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-01-01javascript將ip地址第四段用星號(hào)代替的兩種方法
javascript將ip地址第四段用星號(hào)代替的方法,需要的朋友可以參考下。2010-03-03Javascript驗(yàn)證上傳圖片大小[前臺(tái)處理]
在做上傳圖片的時(shí)候,如果不限制上傳圖片大小,后果非常的嚴(yán)重。解決這個(gè)問(wèn)題有兩種方式:后臺(tái)處理、前臺(tái)處理2014-07-07JavaScript實(shí)現(xiàn)設(shè)置默認(rèn)日期范圍為最近40天的方法分析
這篇文章主要介紹了JavaScript實(shí)現(xiàn)設(shè)置默認(rèn)日期范圍為最近40天的方法,結(jié)合實(shí)例形式分析了javascript結(jié)合HTML5 date元素進(jìn)行時(shí)間運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下2017-07-07