JS變量是鬆散型的(不強制類型)本質,決定了它只是在特定時間用於保存特定值的一個名字而已;
由於不存在定義某個變量必須要保存何種數據類型值的規則,變量的值及其數據類型可以在腳本的生命週期內改變;
一 變量及作用域
1.基本類型和引用類型
// JS變量包含兩種不同的數據類型的值:基本類型值和引用類型值;
// 1.基本類型值:保存在棧內存中的簡單數據段;即這種值完全保存在內存中的一個位置;
// 基本類型值包含:Undefined|Null|Boolean|Number|String;
// 這些類型在內存中佔有固定大小的空間;它們的值保存在棧空間,我們按值來訪問;
// 2.引用類型值:保存在堆內存中的對象(可能由多個值構成),即變量中保存的實際上只是一個指針,這個指針指向內存中的另一個位置,該位置保存對象;
// 引用類型的值的大小不固定,因此不能保存在棧內存,必須保存在堆內存中;但可以將引用類型的值的內存地址保存在棧內存中;
// 當查詢引用類型的變量時,先從棧內存中讀取內存地址,然後通過地址找到堆內存中的值;=>按引用訪問;
2.動態屬性
<span style="font-size:18px;">// 定義基本類型值和引用類型值的方式相似:創建一個變量併爲該變量賦值;
// 但當這個值保存到變量中以後,對不同類型值可以執行的操作則不一樣;
var box = new Object(); // 創建引用類型;
box.name = 'lee'; // 新增一個屬性;
console.log(box.name); // =>lee;
var box = 'lee'; // 創建基本類型
box.age = 15; // 給基本類型添加屬性;
console.log(box.age); // =>undefined;</span>
3.複製變量值
<span style="font-size:18px;">// 在變量複製方面,基本類型和引用類型也有所不同;
// 基本類型賦值的是值本身;
var box = 'lee'; // 在棧內存中生成一個box'lee';
var box2 = box; // 在棧內存中再生成一個box2'lee';
// box和box2完全獨立;兩個變量分別操作時互不影響;
// 引用類型賦值的是地址;
var box = new Object(); // 創建一個引用類型;box在棧內存中;而Object在堆內存中;
box.name = 'lee'; // 新增一個屬性;
var box2 = box; // 把引用地址賦值給box2;box2在棧內存中;
// box2=box,因爲它們指向的是同一個對象;
// 如果這個對象中的name屬性被修改了,box.name和box2.name輸出的值都會被修改掉;</span>
4.傳遞參數
5.檢測類型
<span style="font-size:18px;">// 要檢測一個變量的類型,通過typeof運算符類判斷;
// 多用來檢測基本類型;
var box = 'lee';
console.log(typeof box); // =>string;
// 要檢測變量是什麼類型的對象,通過instanceof運算符來查看;
var box = [1,2,3];
console.log(box instanceof Array); // =>true;
var box2 = {};
console.log(box2 instanceof Object);
var box3 = /g/;
console.lgo(box3 instanceof RegExp);
var box4 = new String('lee');
console.log(box4 instanceof String); // =>true;是否是字符串對象;
var box5 = 'string';
console.log(box5 instanceof String); // =>false;
// 當使用instanceof檢查基本類型的值時,它會返回false;</span>
6.執行環境及作用域
<span style="font-size:18px;">// 執行環境:定義了變量或函數有權訪問的其他數據,決定了它們各自的行爲;
// 在Web瀏覽器中,全局執行環境=window對象;
// 因此所有的全局變量和函數都是作爲window對象的屬性和方法創建的;
var box = 'blue'; // 聲明一個全局變量;
function setBox(){
console.log(box); // 全局變量可以在函數裏訪問;
}
setBox(); // 執行函數;
// 全局的變量=window對象的屬性;
// 全局的函數=window對象的方法;
// PS:當執行環境中的所有代碼執行完畢後,該環境被銷燬,保存在其中的所有變量和函數定義也隨之銷燬;
// 如果是在全局環境下,需要程序執行完畢,或者網頁被關閉纔會銷燬;
// PS:每個執行環境都有一個與之關聯的變量對象,就好比全局的window可以調用全局變量和全局方法一樣;
// 局部的環境也有一個類似window的變量對象,環境中定義的所有變量和函數都保存在這個對象中;
// (我們無法訪問這個變量對象,但解析器會處理數據時後臺使用它);
var box = 'blue';
function setBox(){
var box = 'red'; // 這裏是局部變量,在當前函數體內的值是'red';出了函數體就不被認知;
console.log(box);
}
setBox();
console.log(box);
// 通過傳參可以替換函數體內的局部變量,但作用域僅限在函數體內這個局部環境;
var box = 'blue';
function setBox(box){ // 通過傳參,將局部變量替換成了全局變量;
alert(box); // 此時box的值是外部調用時傳入的參數;=>red;
}
setBox('red');
alert(box);
// 如果函數體內還包含着函數,只有這個內函數纔可以訪問外一層的函數的變量;
// 內部環境可以通過作用域鏈訪問所有的外部環境,但外部環境不能訪問內部環境中的任何變量和函數;
var box = 'blue';
function setBox(){
function setColor(){
var b = 'orange';
alert(box);
alert(b);
}
setColor(); // setColor()的執行環境在setBox()內;
}
setBox();
// PS:每個函數被調用時都會創建自己的執行環境;當執行到這個函數時,函數的環境就會被推到環境棧中去執行,而執行後又在環境棧中彈出(退出),把控制權交給上一級的執行環境;
// PS:當代碼在一個環境中執行時,就會形成一種叫做作用域鏈的東西;它的用途是保證對執行環境中有訪問權限的變量和函數進行有序訪問;作用域鏈的前端,就是執行環境的變量對象;
</span>
7.延長作用域鏈
8.沒有塊級作用域
<span style="font-size:18px;">
// 塊級作用域:表示諸如if語句等有花括號封閉的代碼塊,所以,支持條件判斷來定義變量;
if(true){ // if語句代碼塊沒有局部作用域;
var box = 'lee'; // 變量聲明會將變量添加到當前的執行環境(在這裏是全局環境);
}
alert(box);
for(var i=0; i<10; i++){ // 創建的變量i即使在for循環執行結束後,也依舊會存在與循環外部的執行環境中;
var box = 'lee';
}
alert(i);
alert(box);
function box(num1,num2){
var sum = num1+num2; // 此時sum是局部變量;如果去掉var,sum就是全局變量了;
return sum;
}
alert(box(10,10));
alert(sum); // sum is not defined;訪問不到sum;
// PS:不建議不使用var就初始化變量,因爲這種方法會導致各種意外發生;
// 一般確定變量都是通過搜索來確定該標識符實際代表什麼;搜索方式:向上逐級查詢;
var box = 'blue';
function getBox(){
return box; // 此時box是全局變量;如果是var box='red',那就變成局部變量了;
}
alert(getBox());
// 調用getBox()時會引用變量box;
// 首先,搜索getBox()的變量對象,查找名爲box的標識符;
// 然後,搜索繼續下一個變量對象(全局環境的變量對象),找到了box標識符;
// PS:變量查詢中,訪問局部變量要比全局變量更快,因爲不需要向上搜索作用域鏈;</span>
二 內存問題
<span style="font-size:18px;">// JS具有自動垃圾收集機制,執行環境會負責管理代碼執行過程中使用的內存;它會自行管理內存分配及無用內存的回收;
// JS最常用的垃圾收集方式就是標記清除;垃圾收集器會在運行的時候給存儲在內存中的變量加上標記;
// 然後,它會去掉環境中正在使用的變量的標記,而沒有被去掉標記的變量將被視爲準備刪除的變量;
// 最後,垃圾收集器完成內存清理工作,銷燬那些標記的值並回收他們所佔用的內存空間;
// 垃圾收集器是週期性運行的,這樣會導致整個程序的性能問題;
// 比如IE7以前的版本,他的垃圾收集器是根據內存分配量運行的,比如256個變量就開始運行垃圾收集器,這樣就不得不頻繁地運行,從而降低了性能;
// 一般來說,確保佔用最少的內存可以讓頁面獲得更好的性能;
// 最佳方案:一旦數據不再使用,將其值設置爲null來釋放引用,這個做法叫做解除引用;
var o = {
name:'lee';
};
o = null; // 解除對象引用,等待垃圾收集器回收;</span>
三 小結
1.變量
// JS變量可以保存兩種類型的值:基本類型值和引用類型值;它們具有以下特點:
// 1.基本類型值在內存中佔據固定大小的空間,因此被保存在棧內存中;
// 2.從一個變量向另一個變量複製基本類型的值,會創建這個值的一個副本;
// 3.引用類型的值是對象,保存在堆內存中;
// 4.包含引用類型值的變量實際上包含的並不是對象本身,而是一個指向該對象的指針;
// 5.從一個變量向另一個變量複製引用類型的值,複製的其實是指針,因此兩個變量最終都指向用一個對象;
// 6.確定一個值是哪種基本類型可以使用typeof操作符;而確定一個值是哪種引用類型可以使用instanceof操作符;
2.作用域
// 所有變量都存在於一個執行環境(作用域)中,這個執行環境決定了變量的生命週期,以及哪一部分代碼可以訪問其中的變量;
// 1.執行環境有全局執行環境和函數執行環境之分;
// 2.每次進入一個新執行環境,都會創建一個用於搜索變量和函數的作用域鏈;
// 3.函數的局部環境不僅有權訪問函數作用域中的變量,而且有權訪問其父環境,乃至全局環境;
// 4.變量的執行環境有助於確定應該合適釋放內存;
3.內存
// JS自動垃圾收集機制
// 1.離開作用域的值將被自動標記爲可以回收,因此將在垃圾收集期間被刪除;
// 2.爲了確保有效地回收內存,應該及時解除不再使用的全局對象/全局對象屬性以及循環引用變量的引用;