本文實例分析了JavaScript閉包和范圍。分享給大家供大家參考，具體如下：

1.

if (!("a" in window)) {
  var a = 1;
}
alert(a);

【分析】代碼含義：如果window不包含屬性a，就聲明一個變量a并賦值為1

①JS引擎會先掃描所有的變量聲明

②所有的全局變量都是window的屬性

③變量聲明和賦值一起用時，Js引擎會自動將它分成兩部分：變量聲明提前，變量賦值沒有(不將賦值提前是因為他有可能影響代碼執(zhí)行出不可預(yù)期的結(jié)果)

所以代碼執(zhí)行順序等價于

var a;
if(!("a" in window)) {
  a = 1;
}
alert(a);

解析：聲明變量a，判斷a是否存在，不存在就賦值為1，而這里a永遠(yuǎn)在window里存在，賦值語句永不執(zhí)行，所以結(jié)果是undefined

2.

if (!("a" in window)) {
  function a() { window.a = 1; }
}
alert(a);

【分析】

①函數(shù)聲明也會提前并且會覆蓋變量聲明，但不會覆蓋變量賦值，如下例子

function value(){
  return 1;
}
var value;
alert(typeof value);  //"function"

function value(){
  return 1;
}
var value = 1;
alert(typeof value);  //"number"

②所有全局變量都是window屬性，語句var a=1;等同于window.a=1;

所以代碼執(zhí)行順序等價于

function a() {window.a = 1;}
if(!("a" in window)) {
  function a() { var a = 1; }
}
alert(a);

輸出結(jié)果：function a() {window.a = 1; }

變形：

if ("a" in window) {
  function a() { window.a = 1; }
}
alert(a);

輸出結(jié)果：a is not defined

函數(shù)聲明里的變量定義，要到執(zhí)行函數(shù)時才會定義，并不會在預(yù)編譯階段就聲明變量

3.

if (!("a" in window)) {
  var a = function () { window.a = 1; }
}
alert(a);

【分析】

①函數(shù)聲明和函數(shù)表達(dá)式區(qū)別

函數(shù)聲明：

function functionName(arg1, arg2){
  //函數(shù)體
}

函數(shù)表達(dá)式(相當(dāng)于變量賦值):

var functionName = function(arg1, arg2){
  //函數(shù)體
};

所以代碼執(zhí)行順序等價于

var a;
if (!("a" in window)) {
  a = function () { window.a = 1; }
}
alert(a);

結(jié)果和第一題一樣,undefined

4.

var a = 1,
  b = function a(x) {
    x && a(--x);
  };
alert(a);

【分析】

①進(jìn)入執(zhí)行上下文的階段

VO(global) = {
  a: undefined,
  b: undefined
}

這階段的順序：函數(shù)的形參->函數(shù)聲明->變量聲明

②執(zhí)行代碼階段

VO(global) = {
  x: undefined,
  a: 1
}

③定義變量b，賦值名字為a的函數(shù)（這個a只能在函數(shù)體內(nèi)使用）

④如果x是任何true值（這這里應(yīng)該是非0）則執(zhí)行后面的語句

⑤換成更能理解的代碼

var a = 1,
  b = function(x) {
    x && b(--x);
  };
alert(a);

結(jié)果為1

5.

function b(x, y, a) {
  arguments[2] = 10;
  alert(a);
}
b(1, 2, 3);

【分析】沒有難點(diǎn)，輸出10，如果改成

function b(x, y, a) {
  arguments[2] = 10;
  alert(a);
}
b(1, 2);

則輸出undefined，因為沒有傳遞a的值

6.

function a() {
  alert(this);
}
a.call(null);

【分析】

①a.call(b)表示a對象的方法應(yīng)用到b對象上（即b對象繼承了a對象），根據(jù)規(guī)定，第一個參數(shù)是null或undefined，call方法就把全局對象（也就是window）作為this的值

②call()和apply()的區(qū)別：功能一樣，第二個參數(shù)形式不一樣，call傳遞多個參數(shù)，任意形式，apply第二個參數(shù)必須是數(shù)組形式，如

a.call(b,2,3); ==>  a.apply(b,[2,3]);

輸出結(jié)果:[object Window]

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

最新評論