JavaScript閉包和范圍實(shí)例詳解
本文實(shí)例分析了JavaScript閉包和范圍。分享給大家供大家參考,具體如下:
1.
if (!("a" in window)) { var a = 1; } alert(a);
【分析】代碼含義:如果window不包含屬性a,就聲明一個(gè)變量a并賦值為1
①JS引擎會(huì)先掃描所有的變量聲明
②所有的全局變量都是window的屬性
③變量聲明和賦值一起用時(shí),Js引擎會(huì)自動(dòng)將它分成兩部分:變量聲明提前,變量賦值沒有(不將賦值提前是因?yàn)樗锌赡苡绊懘a執(zhí)行出不可預(yù)期的結(jié)果)
所以代碼執(zhí)行順序等價(jià)于
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ù)聲明也會(huì)提前并且會(huì)覆蓋變量聲明,但不會(huì)覆蓋變量賦值,如下例子
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í)行順序等價(jià)于
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ù)時(shí)才會(huì)定義,并不會(huì)在預(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í)行順序等價(jià)于
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ù)(這個(gè)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,因?yàn)闆]有傳遞a的值
6.
function a() { alert(this); } a.call(null);
【分析】
①a.call(b)表示a對(duì)象的方法應(yīng)用到b對(duì)象上(即b對(duì)象繼承了a對(duì)象),根據(jù)規(guī)定,第一個(gè)參數(shù)是null或undefined,call方法就把全局對(duì)象(也就是window)作為this的值
②call()和apply()的區(qū)別:功能一樣,第二個(gè)參數(shù)形式不一樣,call傳遞多個(gè)參數(shù),任意形式,apply第二個(gè)參數(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錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
js 操作table之 移動(dòng)TR位置 兼容FF 跟 IE
js操作table之 移動(dòng)TR位置 兼容FF 跟 IE,需要的朋友可以參考下。2009-11-11JavaScript代碼實(shí)現(xiàn)圖片循環(huán)滾動(dòng)效果
這篇文章主要介紹了JavaScript代碼實(shí)現(xiàn)圖片循環(huán)滾動(dòng)效果的相關(guān)資料,非常不錯(cuò),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06使用JavaScript實(shí)現(xiàn)響應(yīng)式計(jì)數(shù)器動(dòng)畫
在本文中,我們將學(xué)習(xí)如何使用?HTML?CSS?和?JavaScript創(chuàng)建響應(yīng)式計(jì)數(shù)器動(dòng)畫。?我們?cè)诤芏嗟胤蕉伎梢杂?,比如適用于不同類型的個(gè)人網(wǎng)站、企業(yè)網(wǎng)站等,感興趣的可以了解一下2022-08-08Javascript基礎(chǔ)之?dāng)?shù)組的使用
這篇文章主要介紹了Javascript基礎(chǔ)之?dāng)?shù)組的使用的相關(guān)資料,介紹的非常詳解,具有參考借鑒價(jià)值,感興趣的朋友一起學(xué)習(xí)吧2016-05-05