JS--我發現，原來你是這樣的JS（四）（看看變量,做用域,垃圾回收機制是啥）

1、介紹

這是紅寶書（JavaScript高級程序設計 3版）的讀書筆記第四篇，是紅寶書第四章內容（主要是變量和做用域問題），固然其中還有我我的的理解。紅寶書這本書能夠說是難啃的，要看完不容易，挺厚的，要看懂更不容易，要熟練js更是難，中間須要不斷的積累與重溫。所以不是讀一兩遍就能把這書吃透，須要多讀，可謂溫故而知新，能夠爲師矣。

同系列：
第一篇：JavaScript--我發現，原來你是這樣的JS（一）（初識）
第二篇：JavaScript--我發現，原來你是這樣的JS（二）（基礎概念--軀殼篇，不妨從中文角度看js）
第三篇：JavaScript--我發現，原來你是這樣的JS（三）（基礎概念--靈魂篇）

2、變量

1 .變量介紹：

javascript 中的變量是鬆散型的，既不用去指定改變量的數據類型值，聲明變量時直接使用一個操做符var就行。

//聲明變量
var str = 'string';
var num = 123;
//當不用var時，則爲全局變量但不推薦這樣操做
i = 123;

2.變量的兩種值：基本類型和引用類型的值：

js的變量有兩種不一樣的數據類型的值：基本類型的值和引用類型的值。

• 基本類型上一篇提到的五種基本類型：null ，undefined，boolean，string，number
• 引用類型通常是：對象，函數，數組等，都是object類型

//基本類型的值
var num = 123;
var boo = false;
//引用類型的值
var obj = new Object();
var arr = new Array();
var arr2 = {};

3.基本類型的值和引用類型的值的區別

區別一：動態的屬性

動態的屬性怎麼理解：就是能夠動態的增長，刪除，改變屬性和方法

• 對於基本類型的值，不可以進行這些操做

//基本類型的值
var str = '123';
//添加屬性
str.age = 123;

console.log(str.age); //undefined,說明該值沒被聲明，因此基本類型屬性沒有動態的屬性

• 對於引用類型的值，可以進行這些操做，例子沒毛病

//引用類型的值
var person = new Object();
//添加屬性name
person.name = 'ry-yuan';
//添加方法sayHi
person.sayHi = function(){
    console.log('hi');
}

console.log(person.name);   //輸出ry-yuan
person.sayHi();  //輸出hi

區別二：複製變量值不一樣

• 對於基本類型變量值之間的複製，會建立一個新值給另外一變量，彼此不會相互影響，例子：

var n1 = 100;
//n1複製給n2
var n2 = n1;
console.log(n2); //100
//對n2操做自增
n2++;
console.log(n1); //100,n1不會受n2影響
console.log(n2); //101

• 對於引用類型之間複製，則不會建立新值，而是 指向同一個對象

//引用變量值
var o1 = new Object();
//複製o1給o2
var o2 = o1;
//爲o1添加屬性
o1.name = 'ry-yuan';
//o2也會有這個屬性值
console.log(o2.name); //'ry-yuan'

爲何引用類型會指向同一個對象？由於o1中存着的值只是一個對象的引用地址，因此o1複製到o2時就把地址複製給o2，二者的地址相同，因此指向同一個對象。

區別三：傳遞參數

這裏的傳遞參數是對函數傳遞參數。函數參數的按值傳遞的。傳遞參數的二者的區別和上面複製的同樣。

• 對於基本數據類型的值，對函數傳遞參數，是將值複製給函數內部的參數，複製另外一份獨立的值，因此二者不影響彼此。

var n = 123;
function add(num){
    num ++;
    console.log(num);
}

//將n傳給函數add
add(n);   //124
console.log(n);  //123，n不會被影響

• 對於引用數據類型的值，對函數傳遞參數，是將對象在的引用地址值複製給函數內部參數（局部變量），因此操做的是同一個對象。

//引用類型
var p = new Object();
function addName(obj){
    obj.name = 'ry-yuan';
}
console.log(p.name);   //undefined，對象沒有name屬性
//將p傳進函數
addName(p);  
console.log(p.name);   //ry-yuan，對象有了name屬性

區別四：檢測類型

• 對於基本數據類型，咱們使用typeof來確認變量是什麼基本數據類型

var num = 666;
var str = "hello ry";
var boo = false;
var und = undefined;
var n = null;

console.log(typeof num);  //number
console.log(typeof str);  //string
console.log(typeof boo);  //boolean
console.log(typeof und);  //undefined
console.log(typeof n);  //object,特別的null返回的是object

• 對於引用類型的值，咱們使用instanceof操做符，判斷它是什麼類型的對象。不用typeof的緣由是typeof檢測引用類型都會返回object，這不是咱們想要的，咱們想知道它是什麼類型的object

//這裏想知道arr是否是數組類型,若是是返回true，不是返回false
console.log(arr instanceof Array);
//這裏想知道arr是否是正則類型,若是是返回true，不是返回false
console.log(arr instanceof RegExp);

• 特別的：用instanceof去判斷基本類型值都會返回false，由於基本類型數據都不是object，就更不用判斷是什麼類型的object了。

3、做用域

做用域：是變量與函數的可訪問範圍，即做用域控制着變量與函數的可見性和生命週期。在JavaScript中，變量的做用域有全局做用域和局部做用域兩種。

1.全局執行環境：

最外圍的一個執行環境，在web瀏覽器中，全局執行環境被認爲是window對象，所以全部的全局變量和函數都是做爲window對象的屬性和方法建立的。

2.局部執行環境：

局部執行環境是指在函數內部，函數被建立，就會有一個函數做用域，在函數內定義的變量和方法，函數外面不能訪問，但函數內能夠訪問外面的變量和方法。

//聲明一個全局變量，當前最外圍是全局做用域
var g = 1;
//聲明函數fn1
function fn1(){
//局部做用域
    //聲明一個變量
    var i = 10;    
    //能夠訪問g
    console.log(g);  //1
    //再聲明一個函數fn2
    function fn2(){
    //局部做用域
        var j = 100;
        //能夠訪問g和i
        console.log(g);  //1
        console.log(i);  //100
    }
    
//fn1不能訪問到fn2裏面的變量和方法
console.log(j);    //報錯，j沒被定義
}

//全局做用域中不能訪問i,j
console.log(i);   //報錯，i沒有被定義
console.log(j);   //報錯，j沒有被定義

上圖：

全局做用域中只能訪問紅顏色中有的變量和函數，有g和fn1
局部做用域fn1中能訪問紅色+藍色中的變量和函數，有g，i，fn1，fn2
局部做用域fn2中能訪問整個全部的變量和函數g，i，j，fn1，fn2
綜上越裏面的做用域訪問的就越多。有種不能滲透到內部，只能向外拓展的感受。

3.沒有塊級做用域

什麼是塊級做用域：用大括號括起來的區域{ coding.... }

js中沒有塊級做用域，因此有一下這種狀況：

for(var i =0 ; i<10 ; i++){
    console.log(i);
}
console.log(i);   //10 ，這裏會有結果，i沒有被銷燬

查詢標記符：

查詢標記符怎麼操做？
來個例子：

var a = 1;
function getNum(){
    return a ;
}

console.log(getNum());  //1

咱們來分析一下變量a 的查找過程：
1.首先在getNum函數做用域中找，發現沒有a變量
2.因而向外拓展，到了全局做用域，發現，哎，有a，var了個a，沒錯就是你了。而後得到這個a。

再來一個例子：

var b = 1;
function get(){
    var b = 2;
    return b;
}
console.log(get());  //2

此次又是怎麼操做：
1.在執行函數get時，咱們聲明瞭一個b變量，return時須要用到b，這時咱們在局部做用域中找，哎，有了，有個b變量，就是你了，而後就返回了。不用再到外面找了。

四、垃圾回收問題：

1.什麼是js的垃圾回收機制？

答：javascript中垃圾收集機制是自動回收的，不用人工操做，這讓咱們更專一於編輯代碼上。 回收垃圾機制是定時執行的，具備週期性。

2.何時會有垃圾？

答：在做用域中當整個做用域中的代碼執行完後，做用域中的變量和方法都會沒用，此時就是被當作垃圾了。好比局部做用域，一個函數執行完，裏面的變量就能夠被銷燬，其佔用內存被釋放。

3.垃圾回收方式？

答：經常使用的是標記清除：這樣操做：一個變量-->進入環境（被標記，有此標記爲不能被清除）-->執行-->離開環境（被標記，這個標記告訴機制能被清除）-->回收機制一段週期後，變量被清除。

4.爲何還要管理內存？

答：分配給web瀏覽器的內存比桌面的應用的內存少，這是出於安全考慮，爲了防止運行js的網頁耗盡系統內存致使系統崩潰。因此，開發者發現一旦數據再也不用時，就將其值設爲null來釋放其引用（解除引用），這作法適用於全局變量和全局對象屬性。

5、說說

博文很久沒更新啦，墮落了，啊啊啊啊，努力努力，積極向上。最近挺多事。不能擋我學習，統統閃開。

本文出自博客園：http://www.cnblogs.com/Ry-yuan/
做者：Ry（淵源遠願）
歡迎訪問個人我的首頁：個人首頁
歡迎訪問個人github:https://github.com/Ry-yuan/demoFiles 歡迎轉載，轉載請標明出處，保留該字段。