詳解js變量、作用域及內存

waltr 發布于2019-08-21 10:19 / 1653人閱讀

摘要：不是引用類型，無法輸出簡而言之，堆內存存放引用值，棧內存存放固定類型值。變量的查詢在變量的查詢中，訪問局部變量要比全局變量來得快，因此不需要向上搜索作用域鏈。

贊助我以寫出更好的文章，give me a cup of coffee?

2017最新最全前端面試題

基本類型值有：undefined，NUll，Boolean，Number和String，這些類型分別在內存中占有固定的大小空間，他們的值保存在棧空間，我們通過按值來訪問的。

（1）值類型：數值、布爾值、null、undefined。
（2）引用類型：對象、數組、函數。

如果賦值的是引用類型的值，則必須在堆內存中為這個值分配空間。由于這種值的大小不固定（對象有很多屬性和方法），因此不能把他們保存到棧內存中。但內存地址大小是固定的，因此可以將內存地址保存在棧內存中。


這里的對象可以是字符串對象，數字對象，數組對象等

復制變量值
再看下面這個例子：

由以上可以得出：在變量復制方面，基本類型和引用類型也有所不同，基本類型復制的是值本身，而引用類型復制的是地址。
傳遞參數
ECMAScript中，所有函數的參數都是按值傳遞的，

js沒有按引用傳遞的，如果存在引用傳遞的話，那么函數內的變量將是全局變量，在外部也可以訪問。但這明顯是不可能的。
執行環境及作用域
執行環境是javascript中最為重要的概念之一，執行環境定義了變量或函數有權訪問其他數據。
全局執行環境是最外圍的執行環境，在web瀏覽器中，全局執行環境是window對象，因此，所有的全局變量的函數都是作為window的屬性和方法創建的。

當執行環境內的代碼執行完畢后，該環境被銷毀，保存其中的變量和函數也隨之銷毀，如果是全局環境，需所有程序執行完畢或網頁完畢后才會銷毀。
去掉var的局部變量

通過傳參，也是局部變量

函數體內還包含函數，只有這個函數才可以訪問內一層的函數

可以通過如下方法進行訪問：

再一個作用域例子：

當代碼在一個環境中執行的時候，就會形成一種叫做作用域鏈的東西，它的用途是保證對執行環境中有訪問權限的變量和函數進行有序訪問（指按照規則層次來訪問），作用域鏈的前端，就是執行環境的變量對象。
作用域
變量沒有在函數內聲明或者聲明的時候沒有帶var就是全局變量，擁有全局作用域，window對象的所有屬性擁有全局作用域；在代碼任何地方都可以訪問，函數內部聲明并且以var修飾的變量就是局部變量，只能在函數體內使用，函數的參數雖然沒有使用var但仍然是局部變量。
沒有塊級作用域
// if語句：

for循環語句也是如此。
變量的查詢
在變量的查詢中，訪問局部變量要比全局變量來得快，因此不需要向上搜索作用域鏈。
如下例子：

每個環境都可以向上搜索作用域鏈，以查詢變量和函數名；但任何環境都不能通過向下搜索作用域鏈而進入另一個執行環境。在這里，如果去掉var name = "trigkit4"，那么將彈出“Jack”
內存問題
javascript具有自動垃圾回收機制，一旦數據不再使用，可以將其設為"null"來釋放引用
循環引用
　　一個很簡單的例子：一個DOM對象被一個Javascript對象引用，與此同時又引用同一個或其它的Javascript對象，這個DOM對象可能會引發內存泄露。這個DOM對象的引用將不會在腳本停止的時候被垃圾回收器回收。要想破壞循環引用，引用DOM元素的對象或DOM對象的引用需要被賦值為null。
閉包
在閉包中引入閉包外部的變量時，當閉包結束時此對象無法被垃圾回收（GC）。
var a = function() {
  var largeStr = new Array(1000000).join("x");
  return function() {
    return largeStr;
  }
}();
DOM泄露
當原有的COM被移除時，子結點引用沒有被移除則無法回收。
var select = document.querySelector;
var treeRef = select("#tree");

//在COM樹中leafRef是treeFre的一個子結點
var leafRef = select("#leaf"); 
var body = select("body");

body.removeChild(treeRef);

//#tree不能被回收入，因為treeRef還在
//解決方法:
treeRef = null;

//tree還不能被回收，因為葉子結果leafRef還在
leafRef = null;

//現在#tree可以被釋放了。
Timers計（定）時器泄露
定時器也是常見產生內存泄露的地方：
for (var i = 0; i < 90000; i++) {
  var buggyObject = {
    callAgain: function() {
      var ref = this;
      var val = setTimeout(function() {
        ref.callAgain();
      }, 90000);
    }
  }

  buggyObject.callAgain();
  //雖然你想回收但是timer還在
  buggyObject = null;
}
調試內存
Chrome自帶的內存調試工具可以很方便地查看內存使用情況和內存泄露：
在 Timeline -> Memory 點擊record即可：
相關文章：
詳解js閉包
我們可以利用閉包來突破作用域鏈，詳解js閉包

GPU云服務器云服務器作用域詳解變量及數據詳解變量作用范圍 php變量作用域

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/85307.html

《你不知道的JS》讀書筆記---作用域及閉包

摘要：注此讀書筆記只記錄本人原先不太理解的內容經過閱讀你不知道的后的理解。作用域及閉包基礎，代碼運行的幕后工作者引擎及編譯器。注：此讀書筆記只記錄本人原先不太理解的內容經過閱讀《你不知道的JS》后的理解。作用域及閉包基礎，JS代碼運行的幕后工作者：引擎及編譯器。引擎負責JS程序的編譯及執行，編譯器負責詞法分析和代碼生成。那么作用域就像一個容器，引擎及編譯器都從這里提取東西。 ...

denson 2019-08-21 18:22 評論0 收藏0
圖解作用域及閉包

摘要：那其實閉包的原因就是外層函數的作用域對象無法釋放其實就是一個函數調用會生成的臨時作用域圖中可看出其實就是在中的匿名函數，所以他的就指向留下的作用域。引言網絡上關于作用域及閉包的文章很多，自己對于純理論知識并不能很快的理解，但自己對于圖畫有很強的記憶和理解能力，因此決定將此知識點以圖畫的知識表現出來，加深自身理解的同時如果能幫到正在學習的童鞋就再好不過了下面我以函數的整個生命周期來...

shiyang6017 2019-08-22 17:03 評論0 收藏0
淺談Javascript閉包中作用域及內存泄漏問題

摘要：將作用域賦值給變量這里的作用域是，而不是將作用域賦值給一個變量閉包返回瀏覽器中內存泄漏問題大家都知道，閉包會使變量駐留在內存中，這也就導致了內存泄漏。上一章我們講了匿名函數和閉包，這次我們來談談閉包中作用域this的問題。大家都知道，this對象是在運行時基于函數的執行環境綁定的，如果this在全局就是[object window]，如果在對象內部就是指向這個對象，而閉包卻是在運行...

source 2019-08-20 12:28 評論0 收藏0
JavaScript函數表達式——“函數模仿塊級作用域及函數的私有變量”的注意要點

摘要：模仿塊級作用域在塊級語句中定義的變量，實際上是包含函數中而非語句中創建的。避免對全局作用域產生不良影響這種方式可以通過創建私有作用域，避免對全局作用域產生不良影響。一般包括函數的參數局部變量和內部定義的其他函數。模仿塊級作用域在塊級語句中定義的變量，實際上是包含函數中而非語句中創建的。如： function outputNumbers(x){ for (var i = 0;...

archieyang 2019-08-19 17:07 評論0 收藏0
【js】what is 閉包

摘要：什么是閉包給出的官方回答是閉包是由函數以及創建該函數的詞法環境組合而成。這就是閉包的核心。當函數執行完后，被作為返回值函數保留在了作用域中。閉包還有一個作用是模擬私有方法和變量。閉包的缺點由上文可知閉包的作用可以使數據保存在內存中。什么是閉包？MDN給出的官方回答是閉包是由函數以及創建該函數的詞法環境組合而成。這個環境包含了這個閉包創建時所能訪問的所有局部變量看代碼 //一個函數里...

Godtoy 2019-08-23 18:17 評論0 收藏0