快捷導(dǎo)航

Javascript變量函數(shù)淺析

更新時(shí)間：2011年09月02日 00:36:13 作者：

在javascript變量中可以存放兩種類型的值：原始值和引用值。原始值存儲(chǔ)在棧上的簡(jiǎn)單字段，也就是值直接存儲(chǔ)在變量所標(biāo)示的位置內(nèi)。

一、變量
在javascript變量中可以存放兩種類型的值：原始值和引用值。
原始值存儲(chǔ)在棧上的簡(jiǎn)單字段，也就是值直接存儲(chǔ)在變量所標(biāo)示的位置內(nèi)。
引用值存儲(chǔ)在堆內(nèi)的對(duì)象，棧內(nèi)變量保存的是指向堆內(nèi)對(duì)象的指針值。
在javascript中有5種基本類型：Undefined,Null,Boolean,Number,String。
引用類型其實(shí)就是對(duì)象，類似其他語(yǔ)言中類實(shí)例的概念。

復(fù)制代碼代碼如下:

 
var b = true; // 存儲(chǔ)在棧上 
var num = 20; //存儲(chǔ)在棧上 
var b = new Boolen(true); //存儲(chǔ)在堆內(nèi) 
var num = new Number(20); // 存儲(chǔ)在堆內(nèi) 

通常生成對(duì)象的方式 :
new +類型名稱 var obj = new object()
如果沒(méi)有參數(shù)也可以寫(xiě)成 var obj = new object;
還可以用對(duì)象字面量生成對(duì)象 var obj = {}
二、函數(shù)
在javascript 中函數(shù)就是對(duì)象，應(yīng)該像對(duì)待javascript中其他對(duì)象一樣對(duì)待函數(shù)，每個(gè)函數(shù)都隱式附加兩個(gè)額外參數(shù)this,arguments。
函數(shù)可以：賦值給變量，作為其他對(duì)象的屬性，作為其他函數(shù)的參數(shù)，作為返回值，還可以用字面量來(lái)創(chuàng)建函數(shù)。
函數(shù)上下文：
在面向?qū)ο笳Z(yǔ)言里用this關(guān)鍵字引用類對(duì)象的當(dāng)前實(shí)例。javascript里的this關(guān)鍵字卻不同于面向?qū)ο笳Z(yǔ)言中的this。在javascript中，函數(shù)就是對(duì)象， this引用的是調(diào)用當(dāng)前函數(shù)的函數(shù)上下文。
可以通過(guò)call()和apply()方法來(lái)顯式的指定函數(shù)上下文。Call的第一個(gè)參數(shù)被用來(lái)作為調(diào)用函數(shù)的上下文，其他參數(shù)作為被調(diào)用函數(shù)的參數(shù)傳入被調(diào)用函數(shù)。Apply()和Call()差不多，只不過(guò)第二個(gè)參數(shù)是數(shù)組。

復(fù)制代碼代碼如下:

 
var obj = { 
m:"hello" 
} 
var m="hi"; 
var say=function() 
{ 
alert(this.m); //this指向函數(shù)調(diào)用上下文 
} 
say();//hi，window為調(diào)用上下文 
say.call(obj);// hello，此時(shí)obj為函數(shù)調(diào)用上下文 
say.call(window);// hi，window為調(diào)用上下文 

作用域：
定義在函數(shù)中的參數(shù)和變量在函數(shù)外部是不可見(jiàn)的，而且在一個(gè)函數(shù)中的任何位置定義的變量在該函數(shù)中的任何地方都是可見(jiàn)的。

復(fù)制代碼代碼如下:

 
var obj = function() { 
var num = 1; 
return { getValue: function() { 
alert(num); //undefined 
var num = 2; 
alert(num); //2 
} 
} 
} (); 
obj.getValue(); 

閉包
所謂閉包就是函數(shù)能使用函數(shù)外定義的變量,函數(shù)可以訪問(wèn)創(chuàng)建時(shí)的上下文環(huán)境。

復(fù)制代碼代碼如下:

 
var hello = "hello word!"; 
function sayHello() { 
alert(hello); 
} 
sayHello(); 
var obj = function() { 
var value = 0; 
return { 
setValue: function(val) { 
value += typeof val === 'number' ? val : 1; 
}, 
getValue: function() { 
return value; 
} 
} 
} (); 
obj.setValue('a'); 
alert(obj.getValue()); //1 

注意最后一行的(),()是調(diào)用運(yùn)算符，它表示函數(shù)立即調(diào)用并返回調(diào)用結(jié)果。所以obj并不是引用函數(shù)，而是引用該函數(shù)返回的一個(gè)包含兩個(gè)方法的對(duì)象，而且這兩個(gè)方法享有訪問(wèn)value變量的特權(quán)。
再舉個(gè)網(wǎng)上流傳很廣的內(nèi)部函數(shù)訪問(wèn)外部函數(shù)局部變量例子來(lái)說(shuō)明閉包。點(diǎn)擊相應(yīng)的列表項(xiàng)彈出對(duì)應(yīng)的順序編號(hào)。

復(fù)制代碼代碼如下:

 
<li id="a">test1</li> 
<li id="b">test2</li> 
<li id="c">test3</li> 
var test = function() { 
var num = document.getElementsByTagName("li"); 
var i; 
for (i = 0; i < num.length; i++) { 
num[i].onclick = function() { 
alert(i); //內(nèi)部函數(shù)可以訪問(wèn)外部函數(shù)變量,i的最終值是3， 
//而不是構(gòu)造函數(shù)時(shí)的i值，所以此處都彈出3 
} 
} 
alert(i); //3 
} 
test(); 

下面這個(gè)寫(xiě)法可以獲得正確的結(jié)果：

復(fù)制代碼代碼如下:

 
var test = function() { 
var num = document.getElementsByTagName("li"); 
var i; 
for (i = 0; i < num.length; i++) { 
num[i].onclick = function(i) { 
return function() { 
alert(i + 1); 
} 
} (i); //每次構(gòu)造函數(shù)時(shí)立即把i值傳進(jìn)去執(zhí)行，現(xiàn)在onclick綁定的函數(shù)是執(zhí) 
//行后返回的函數(shù) 
} 
alert(i); //3 
} 
test(); 