新聞中心
前兩天看到kraaas大神的關(guān)于基本數(shù)據(jù)類(lèi)型和引用類(lèi)型的區(qū)別的文章覺(jué)得寫(xiě)得非常不錯(cuò),就想著在其基礎(chǔ)上加上自己平時(shí)看到的一些知識(shí)點(diǎn)和理解,所以就有了以下的文章

創(chuàng)新互聯(lián)建站專(zhuān)注于瑪多企業(yè)網(wǎng)站建設(shè),自適應(yīng)網(wǎng)站建設(shè),商城開(kāi)發(fā)?,敹嗑W(wǎng)站建設(shè)公司,為瑪多等地區(qū)提供建站服務(wù)。全流程按需開(kāi)發(fā),專(zhuān)業(yè)設(shè)計(jì),全程項(xiàng)目跟蹤,創(chuàng)新互聯(lián)建站專(zhuān)業(yè)和態(tài)度為您提供的服務(wù)
js基本數(shù)據(jù)類(lèi)型:
js基本數(shù)據(jù)類(lèi)型包括:undefined,null,number,boolean,string.基本數(shù)據(jù)類(lèi)型是按值訪問(wèn)的,就是說(shuō)我們可以操作保存在變量中的實(shí)際的值
1. 基本數(shù)據(jù)類(lèi)型的值是不可變的
任何方法都無(wú)法改變一個(gè)基本類(lèi)型的值,比如一個(gè)字符串:
var name = "change"; name.substr();//hang console.log(name);//change var s = "hello"; s.toUpperCase()//HELLO; console.log(s)//hello
通過(guò)這兩個(gè)例子,我們會(huì)發(fā)現(xiàn)原先定義的變量name的值始終沒(méi)有發(fā)生改變,而調(diào)用substr()和toUpperCase()方法后返回的是一個(gè)新的字符串,跟原先定義的變量name并沒(méi)有關(guān)系
或許有人會(huì)有以下的疑問(wèn),看代碼:
var name = "change"; name = "change1"; console.log(name)//change1
這樣看起來(lái)name的值“改變了”其實(shí),var name = “change”,這里的基礎(chǔ)類(lèi)型是string,也就是”change”,這里的”change”是不可以改變的,name只是指向”change”的一個(gè)指針,指針的指向可以改變,所以你可以name = “change1″.此時(shí)name指向了”change1″,同理,這里的”change1″同樣不可以改變
也就是說(shuō)這里你認(rèn)為的改變只是“指針的指向改變”
這里的基礎(chǔ)類(lèi)型指的是”change”,而不是name,要區(qū)分清楚
2. 基本數(shù)據(jù)類(lèi)型不可以添加屬性和方法
var p = "change";
p.age = 29;
p.method = function(){console.log(name)};
console.log(p.age)//undefined
console.log(p.method)//undefined通過(guò)上面的代碼,我們知道不能給基本類(lèi)型添加屬性和方法,也再次說(shuō)明基本類(lèi)型是不可變的
3. 基本數(shù)據(jù)類(lèi)型的賦值是簡(jiǎn)單賦值
如果從一個(gè)變量向另一個(gè)變量賦值基本類(lèi)型的值,會(huì)在變量對(duì)象上創(chuàng)建一個(gè)新值,然后把該值復(fù)制到為新變量分配的位置上
var a = 10; var b = a; a++; console.log(a)//11 console.log(b)//10
上面的代碼中,a中保存的值是10.當(dāng)使用a的值來(lái)初始化b時(shí),b中也保存了值10.但b中的10和a中的10是完全獨(dú)立的.b中的值知識(shí)a中值的一個(gè)副本.所以這兩個(gè)變量可以參與任何操作而不會(huì)相互影響.如下圖:
4. 基本數(shù)據(jù)類(lèi)型的比較是值的比較
var person1 = '{}';
var person2 = '{}';
console.log(person1 == person2); // true5. 基本數(shù)據(jù)類(lèi)型是存放在棧區(qū)的
假如有以下幾個(gè)基本類(lèi)型的變量:
var name = "jozo"; var city = "guangzhou"; var age = 22;
那么它的存儲(chǔ)結(jié)構(gòu)如下圖:
棧區(qū)包括了變量的標(biāo)識(shí)符和變量的值
js引用類(lèi)型:
js中除了上面的基本類(lèi)型之外就是引用類(lèi)型了,也可以說(shuō)就是對(duì)象了,比如:Object,Array,Function,Data等
1. 引用類(lèi)型的值是可以改變的
var o = {x:1};
o.x = 2;//通過(guò)修改對(duì)象屬性值更改對(duì)象
o.y = 3;再次更改對(duì)象,給它增加一個(gè)屬性
var a = [1,2,3];
a[0] = 0;//更改數(shù)組的一個(gè)元素
a[3] = 4;//給數(shù)組增加一個(gè)元素2. 引用類(lèi)型可以添加屬性和方法
var person = {};
person.name = "change";
person.say = function(){alert("hello");}
console.log(person.name)//change
console.log(person.say)//function(){alert("hello");}3. 引用類(lèi)型的賦值是對(duì)象引用
先看以下代碼:
var a = {};
var b= a;
a.name = "change";
console.log(a.name)//change;
console.log(b.name)//change
b.age = 29;
console.log(a.age)//29
console.log(b.age)//29當(dāng)從一個(gè)變量向另一個(gè)變量賦值引用類(lèi)型的值時(shí),同樣也會(huì)將儲(chǔ)存在變量中的對(duì)象的值復(fù)制一份放到為新變量分配的空間中.引用類(lèi)型保存在變量中的是對(duì)象在堆內(nèi)存中的地址,所以,與基本數(shù)據(jù)類(lèi)型的簡(jiǎn)單賦值不同,這個(gè)值的副本實(shí)際上是一個(gè)指針,而這個(gè)指針指向存儲(chǔ)在堆內(nèi)存的一個(gè)對(duì)象.那么賦值操作后,兩個(gè)變量都保存了同一個(gè)對(duì)象地址,而這兩個(gè)地址指向了同一個(gè)對(duì)象.因此,改變其中任何一個(gè)變量,都會(huì)互相影響
他們的關(guān)系如下圖:
因此,引用類(lèi)型的賦值其實(shí)是對(duì)象保存在棧區(qū)地址指針的賦值,所以兩個(gè)變量指向同一個(gè)對(duì)象,任何的操作都會(huì)互相影響。
4. 引用類(lèi)型的比較是引用的比較
var person1 = {};
var person2 = {};
console.log(person1 == person2)//false為什么兩個(gè)對(duì)象看起來(lái)一摸一樣,但是卻不相等呢?
因?yàn)橐妙?lèi)型的比較是引用的比較,換句話說(shuō),就是比較兩個(gè)對(duì)象保存在棧區(qū)的指向堆內(nèi)存的地址是否相同,此時(shí),雖然p1和p2看起來(lái)都是一個(gè)”{}”,但是他們保存在棧區(qū)中的指向堆內(nèi)存的地址卻是不同的,所以兩個(gè)對(duì)象不相等
5. 引用類(lèi)型是同時(shí)保存在棧區(qū)和堆區(qū)中的
引用類(lèi)型的存儲(chǔ)需要在內(nèi)存的棧區(qū)和堆區(qū)共同完成,棧區(qū)保存變量標(biāo)識(shí)符和指向堆內(nèi)存的地址
假如有以下幾個(gè)對(duì)象:
var person1 = {name:"change1"};
var person2 = {name:"change2"};
var person3 = {name:"change3"};則這三個(gè)對(duì)象在內(nèi)存中保存的情況如下圖:
基本包裝類(lèi)型(包裝對(duì)象):
先看下以下代碼:
var s1 = "helloworld"; var s2 = s1.substr(4);
上面我們說(shuō)到字符串是基本數(shù)據(jù)類(lèi)型,不應(yīng)該有方法,那為什么這里s1可以調(diào)用substr()呢?
通過(guò)翻閱js權(quán)威指南第3.6章節(jié)和高級(jí)程序設(shè)計(jì)第5.6章節(jié)我們得知,ECMAScript還提供了三個(gè)特殊的引用類(lèi)型Boolean,String,Number.我們稱(chēng)這三個(gè)特殊的引用類(lèi)型為基本包裝類(lèi)型,也叫包裝對(duì)象.
也就是說(shuō)當(dāng)讀取string,boolean和number這三個(gè)基本數(shù)據(jù)類(lèi)型的時(shí)候,后臺(tái)就會(huì)創(chuàng)建一個(gè)對(duì)應(yīng)的基本包裝類(lèi)型對(duì)象,從而讓我們能夠調(diào)用一些方法來(lái)操作這些數(shù)據(jù).
所以當(dāng)?shù)诙写a訪問(wèn)s1的時(shí)候,后臺(tái)會(huì)自動(dòng)完成下列操作:
- 創(chuàng)建String類(lèi)型的一個(gè)實(shí)例;// var s1 = new String(“helloworld”);
- 在實(shí)例上調(diào)用指定方法;// var s2 = s1.substr(4);
- 銷(xiāo)毀這個(gè)實(shí)例;// s1 = null;
正因?yàn)橛械谌竭@個(gè)銷(xiāo)毀的動(dòng)作,所以你應(yīng)該能夠明白為什么基本數(shù)據(jù)類(lèi)型不可以添加屬性和方法,這也正是基本裝包類(lèi)型和引用類(lèi)型主要區(qū)別:對(duì)象的生存期.使用new操作符創(chuàng)建的引用類(lèi)型的實(shí)例,在執(zhí)行流離開(kāi)當(dāng)前作用域之前都是一直保存在內(nèi)存中.而自動(dòng)創(chuàng)建的基本包裝類(lèi)型的對(duì)象,則只存在于一行代碼的執(zhí)行瞬間,然后立即被銷(xiāo)毀。
網(wǎng)站標(biāo)題:JavaScript基本數(shù)據(jù)類(lèi)型和引用類(lèi)型的區(qū)別詳解
轉(zhuǎn)載注明:http://www.dlmjj.cn/article/djhppdc.html


咨詢
建站咨詢
