国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

JavaScript 作用域與閉包

這篇具有很好參考價值的文章主要介紹了JavaScript 作用域與閉包。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方,請大家不吝賜教,您也可以點擊"舉報違法"按鈕提交疑問。

本文內(nèi)容學(xué)習(xí)于:后盾人 (houdunren.com)

1.作用域

1)函數(shù)被執(zhí)行后其環(huán)境變量將從內(nèi)存中刪除。下面函數(shù)在每次執(zhí)行后將刪除函數(shù)內(nèi)部的 total 變量。

?function count() {

????????let total = 0;

}

count ();

2)函數(shù)每次調(diào)用都會創(chuàng)建一個新作用域

3)如果子函數(shù)被使用時父級環(huán)境將被保留(構(gòu)造函數(shù)也是很好的環(huán)境例子)

function hd() {

let n = 1;

return function() {

let b = 1;

return function() {

????????console.log(++n); console.log(++b);

};

};

}

let a = hd() () ;

a(); //2,2

a(); //3,3

4)let/const,使用let/const 可以將變量聲明在塊作用域中(放在新的環(huán)境中,而不是全局中)

5)在 for 循環(huán)中使用let/const 會在每一次迭代中重新生成不同的變量

let arr = [];

for (let i = o; i < 10; i++) {

arr.push((() => i)

};

console.log(arr[3]());//3 如果使用var聲明將是10

6)在沒有l(wèi)et/const 的歷史中使用以下方式產(chǎn)生作用域

//1.自行構(gòu)建閉包 var arr = [];

for (var i = o; i < 10; i++) {

(function (a){

arr.push(()=>a);

}) (i);

}

console.log(arr[3]()); //3

//2.閉包

閉包指:子函數(shù)可以訪問外部作用域變量的函數(shù)特性,即使在子函數(shù)作用域外也可以訪問。

·Js中的所有函數(shù)都是閉包

閉包一般在子函數(shù)本身作用域以外執(zhí)行,即延伸作用域

1)閉包基本展示

function hd() {

let name ='后盾人;

return function () {

return name;

}

let hdcms = hd();

console.log(hdcms());//后盾人

2)使用閉包返回數(shù)組區(qū)間元素

let arr = [3, 2, 4,1, 5,6];

function between(a, b) {

return function(v) {

return v >= a && v <= b;

};

}

console.log(arr.filter(between(3,5)));

*3)閉包排序,使用閉包按指定字段排序

let lessons = [

{title:"媒體查詢響應(yīng)式布局", click:89, price:12},

{title:"FLEX 彈性盒模型" click:45, price: 120},

{title:"GRID 柵格系統(tǒng)", click:19, price:67},

{title:"盒子模型詳解" click: 29, price: 300}

];

function order(field){

return (a, b) => (a[field] > b[field] ? 1 :-1);

}

console.table(lessons.sort(order("price")));

*4)閉包問題

(1)內(nèi)存泄漏

閉包特性中,上級作用域會為函數(shù)保存數(shù)據(jù),從而造成的如下所示的內(nèi)存泄漏問題

<body>

<div desc="houdunren">在線學(xué)習(xí)</div><div desc="hdcms">開源產(chǎn)品</div>

</body>

<script>

let divs = document.querySelectorAll ("div");

divs.forEach(function(item) {

item.addEventListener("click",function() {

console.log(item.getAttribute("desc"));

});

item && console.log(item.getAttribute("desc"));// 回調(diào)函數(shù)外面,依然可以訪問});

</script>

***下面通過清除不需要的數(shù)據(jù)解決內(nèi)存泄漏問題

let divs = document.querySelectorAll ("div");

divs.forEach(function(item) {

let desc = item.getAttribute("desc");

item.addEventListener("click",function() {

console.log(desc);

})

item =null;

item && console.log(item.qetAttribute("desc"));// 回調(diào)函數(shù)外面,清除了不需要的數(shù)據(jù),就不可訪問了

});

(2)this 指向

this 總是指向調(diào)用該函數(shù)的對象,即函數(shù)在搜索 this 時只會搜索到當前活動對象。

下面是函數(shù)因為是在全局環(huán)境下調(diào)用的,所以 this 指向 window,這不是我們想要的。

let hd = {

user:"后盾人",

get:function(){

return function() {

return this.user;};

}

};

console.log(hd.get()());//undefined

***使用箭頭函數(shù)解決這個問題

let hd = {

user:"后盾人",

get:function(){

return () => this.user;

}

};

console.log(hd.get()());//后盾人文章來源地址http://www.zghlxwxcb.cn/news/detail-620040.html

到了這里,關(guān)于JavaScript 作用域與閉包的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來自互聯(lián)網(wǎng)用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實不符,請點擊違法舉報進行投訴反饋,一經(jīng)查實,立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費用

相關(guān)文章

  • Js面試之作用域與閉包

    最近在整理一些前端面試中經(jīng)常被問到的問題,分為vue相關(guān)、react相關(guān)、js相關(guān)、react相關(guān)等等專題,可持續(xù)關(guān)注后續(xù)內(nèi)容,會不斷進行整理~ 作用域(scope)定義了程序中變量的可訪問性和生命周期,在js中,作用域有兩種主要的類型:詞法作用域(Lexical Scope)和動態(tài)作用域(

    2024年01月19日
    瀏覽(30)
  • 深入理解JavaScript堆棧、事件循環(huán)、執(zhí)行上下文和作用域以及閉包

    在JavaScript中,內(nèi)存堆是內(nèi)存分配的地方,調(diào)用棧是代碼執(zhí)行的地方。 原始類型的保存方式:在變量中保存的是值本身,所以原始類型也被稱之為值類型。 對象類型的保存方式:在變量中保存的是對象的“引用”,所以對象類型也被稱之為引用類型。 調(diào)用棧理解非常簡單,當

    2024年02月03日
    瀏覽(21)
  • BCSP-玄子前端開發(fā)之JavaScript+jQuery入門CH07_ECMAScript 6基礎(chǔ)

    4.7.1 ECMAScript 6 簡介 ECMAScript 6.0(簡稱 ES6) 是JavaScript語言的下一代標準 正式發(fā)布于2015年6月 目標 使JavaScript語言可以用來編寫復(fù)雜的大型應(yīng)用程序,成為企業(yè)級開發(fā)語言 版本升級 ECMAScript 2015 ECMAScript 2016 ECMAScript 2017 ECMAScript和JavaScript 的關(guān)系 前者是后者的規(guī)格,后者是前者的

    2023年04月27日
    瀏覽(61)
  • 前端學(xué)習(xí)筆記:JavaScript基礎(chǔ)語法(ECMAScript)

    前端學(xué)習(xí)筆記:JavaScript基礎(chǔ)語法(ECMAScript)

    此博客參考b站:【黑馬程序員前端JavaScript入門到精通全套視頻教程,javascript核心進階ES6語法、API、js高級等基礎(chǔ)知識和實戰(zhàn)教程】https://www.bilibili.com/video/BV1Y84y1L7Nn?p=76vd_source=06e5549bf018e111f4275c259292d0da 這份筆記適用于已經(jīng)學(xué)過一門編程語言(最好是C語言)的同學(xué),如果你沒有

    2024年02月16日
    瀏覽(67)
  • 3分鐘搞懂:JavaScript 和 ECMAScript

    ECMAScript 是 JavaScript 語言的 國際標準 ,JavaScript 是 ECMAScript 的 一種實現(xiàn) (Adobe ActionScript 和 JScript 同樣實現(xiàn)了 ECMAScript)。 ECMAScript 是歐洲計算機制造商協(xié)會 ECMA(European Computer Manufacturers Association)發(fā)布的瀏覽器腳本語言標準。它是 262 號標準文件,又叫 ECMA-262。 ECMAScript 定義

    2023年04月22日
    瀏覽(27)
  • 深入理解 ECMAScript modules:提升你的 JavaScript 技能(一)

    深入理解 ECMAScript modules:提升你的 JavaScript 技能(一)

    ?? 前端開發(fā)工程師、技術(shù)日更博主、已過CET6 ?? 阿珊和她的貓_ CSDN 博客專家、23年度博客之星前端領(lǐng)域TOP1 ?? 牛客 高級專題作者、打造專欄《前端面試必備》 、《2024面試高頻手撕題》 ?? 藍橋云課 簽約作者、上架課程《Vue.js 和 Egg.js 開發(fā)企業(yè)級健康管理項目》、《帶你

    2024年02月20日
    瀏覽(22)
  • 深入理解 ECMAScript modules:提升你的 JavaScript 技能(六)

    深入理解 ECMAScript modules:提升你的 JavaScript 技能(六)

    ?? 前端開發(fā)工程師、技術(shù)日更博主、已過CET6 ?? 阿珊和她的貓_ CSDN 博客專家、23年度博客之星前端領(lǐng)域TOP1 ?? ???高級專題作者、打造專欄《前端面試必備》 、《2024面試高頻手撕題》 ?? 藍橋云課 簽約作者、上架課程《Vue.js 和 Egg.js 開發(fā)企業(yè)級健康管理項目》、《帶你

    2024年02月21日
    瀏覽(31)
  • JavaScript 的 閉包

    在 JavaScript 中,閉包是一種強大的特性,它允許函數(shù)在結(jié)束執(zhí)行后,仍能訪問并控制其外部的局部變量。這種特性在許多高級 JavaScript 編程場景中都發(fā)揮著關(guān)鍵作用,如創(chuàng)建函數(shù)工廠、實現(xiàn)數(shù)據(jù)隱藏和封裝等。 JavaScript 的變量作用域 在 JavaScript 中,變量的作用域可以是全局的

    2024年02月06日
    瀏覽(16)
  • JavaScript閉包詳細介紹

    閉包是指有權(quán)訪問另一個函數(shù)作用域中的變量的函數(shù),創(chuàng)建閉包的常見方式是讓一個內(nèi)嵌函數(shù)訪問其外部(父級)函數(shù)的變量,即使外部函數(shù)已經(jīng)執(zhí)行完畢,其變量仍然存在于內(nèi)存中。閉包的主要特點是它可以“記住”外部函數(shù)的變量。 變量持久化: 閉包能夠保持對外部作

    2024年02月20日
    瀏覽(21)
  • 9 JavaScript閉包

    9 JavaScript閉包

    9 閉包 我們都知道,函數(shù)里是可以訪問函數(shù)外的全局變量,而函數(shù)外不能訪問函數(shù)內(nèi)的局部變量,如下: 執(zhí)行結(jié)果: 執(zhí)行結(jié)果: 之所以出現(xiàn)這樣的情況,就是因為函數(shù)內(nèi)定義的變量為局部變量,函數(shù)外定義的變量為全局變量(不同于windows)。在函數(shù)內(nèi)部可以訪問到全局變量,

    2024年02月12日
    瀏覽(24)

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包