快捷導(dǎo)航

Javascript變量函數(shù)淺析

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

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

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

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

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

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

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

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

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

閉包
所謂閉包就是函數(shù)能使用函數(shù)外定義的變量,函數(shù)可以訪問創(chuàng)建時的上下文環(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)用運算符，它表示函數(shù)立即調(diào)用并返回調(diào)用結(jié)果。所以obj并不是引用函數(shù)，而是引用該函數(shù)返回的一個包含兩個方法的對象，而且這兩個方法享有訪問value變量的特權(quán)。
再舉個網(wǎng)上流傳很廣的內(nèi)部函數(shù)訪問外部函數(shù)局部變量例子來說明閉包。點擊相應(yīng)的列表項彈出對應(yīng)的順序編號。

復(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ù)可以訪問外部函數(shù)變量,i的最終值是3， 
//而不是構(gòu)造函數(shù)時的i值，所以此處都彈出3 
} 
} 
alert(i); //3 
} 
test(); 

下面這個寫法可以獲得正確的結(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ù)時立即把i值傳進去執(zhí)行，現(xiàn)在onclick綁定的函數(shù)是執(zhí) 
//行后返回的函數(shù) 
} 
alert(i); //3 
} 
test(); 