成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ECMAScript6(1)：塊級(jí)作用域

KoreyLee / 1955人閱讀

摘要：和塊級(jí)作用域塊級(jí)作用于對(duì)于強(qiáng)類型語言經(jīng)驗(yàn)的人應(yīng)該非常好理解一言以蔽之對(duì)變量作用于分隔使用了函數(shù)詞法作用域而使用花括號(hào)塊作用域。但是花括號(hào)對(duì)于沒有聲明直接定義以及用聲明的變量沒有影響這些變量依然遵守詞法作用域規(guī)則。

let、const和塊級(jí)作用域

塊級(jí)作用于對(duì)于強(qiáng)類型語言經(jīng)驗(yàn)的人應(yīng)該非常好理解, 一言以蔽之：ES5對(duì)變量作用于分隔使用了函數(shù)(詞法作用域), 而ES6使用花括號(hào)(塊作用域)。
對(duì)于詞法作用域在 javascript函數(shù)、作用域鏈與閉包 中有詳細(xì)的解釋。對(duì)于let 和 const聲明的變量在花括號(hào)的分割下同樣會(huì)形成作用于鏈(內(nèi)部訪問外部的, 但外部不能訪問內(nèi)部)。但是花括號(hào)對(duì)于沒有聲明直接定義以及用 var 聲明的變量沒有影響, 這些變量依然遵守詞法作用域規(guī)則。

對(duì)于let 和 const 最大的好處就是避免了可能的運(yùn)行時(shí)錯(cuò)誤, 不過也有直觀的好處：

用塊(Blocks)替換立即執(zhí)行函數(shù)(IIFEs)

定義循環(huán)變量不會(huì)外泄

循環(huán)定義函數(shù)可以不用閉包了

可以放心的在 if 等條件中定義函數(shù)

//用塊(Blocks)替換立即執(zhí)行函數(shù)(IIFEs)
//ES5
(function () {
  var food = "Meow Mix";
}());
console.log(food); // Reference Error

//ES6
{
  let food = "Meow Mix";
}
console.log(food); // Reference Error
var a = [];
for(let i = 0; i < 10; i++){
  a[i] = function(){
    console.log(i);
  }
}
a[6]();       //這里輸出6, 在var定義i的for循環(huán)中輸出 10
console.log(i);    //ReferenceError
function b(){console.log("outside");}
function f(){
  if(false){
    function b(){console.log("inside");}
  }
  b();
}
f();   // ES5 中報(bào)錯(cuò)："TypeError:b is not a function" 而 ES6 中輸出"outside"

由此例可以看出 function 定義函數(shù)不具有塊級(jí)作用域。

但我們需要注意的一下幾點(diǎn)：

let 和 const 聲明的變量不在 window 的屬性中

var a = 10;
let b = 20;
const c = 30;

console.log(window.a);    //10
console.log(window.b);    //undedined
console.log(window.c);    //undedined

let 和 const 聲明的變量沒有聲明提前, 所以在作用域內(nèi)存在暫時(shí)性死區(qū)

var temp = 20;
(function area(){
  console.log(temp);  //undefined
  var temp = 30;      //聲明提前
}());
if(true){
  console.log(temp);  //ReferenceError   但是 babel 會(huì)得到 undefined
  let temp = 20;
}
//一個(gè)隱蔽的死區(qū)
function bar(x = y, y = 2){
  console.log(x, y);
}
bar();    //報(bào)錯(cuò), 因?yàn)槎x x 的時(shí)候, y 還沒有定義 (babel 中不報(bào)錯(cuò)，得到 undefined 2)
function par(x = 2, y = x){
  console.log(x, y);
}
par();    //22

let 和 const 聲明變量在當(dāng)前作用域(不包括作用域鏈)上不能重復(fù)。const聲明的變量必須初始化, 且不能修改:

let a = 10;
var b = 20;
const c = 30;

let a = 4;    //報(bào)錯(cuò)
const b = 3;  //報(bào)錯(cuò)
c = 20;   //報(bào)錯(cuò), c是只讀的

不可以連續(xù)定義變量

let a=b=3;     //報(bào)錯(cuò) b 未定義
const c=d=2;   //報(bào)錯(cuò) d 未定義

技巧：ES6 中, 在塊作用于外調(diào)用內(nèi)部函數(shù)

var f;
{
  f = function(){
    console.log("inside");
  }
}
f();

const 聲明的基本變量不可改變, 但復(fù)雜變量可以改變其內(nèi)容

const 這個(gè)特性和底層的 c++ 一致, 在 c++ 中 const 相當(dāng)于常指針 int * const p, 也就是其指向的數(shù)據(jù)所在內(nèi)存區(qū)域可讀可寫, 但是指針的值初始后就不能改。

const a = 10;
const b = {
  num: 20
};
b.num = 30;
console.log(b.num);   //30
a = 20;         //TypeError
b = {
  num: 90
};              //TypeError

如果想讓非基本變量內(nèi)部也不可改變, 需要使用 Object.freeze() 方法?？梢詤⒖迹簀avascript對(duì)象、類與原型鏈

跨模塊常量

對(duì)于跨模塊的常量, 可以這樣寫：

// const.js module
export const A = 1;
export const B = 2;

// test.js 文件
import * as constants from "./const";
console.log(constants.A);   //1
console.log(constants.B);   //2
//or
import {A, B} from "./const";
console.log(A);   //1
console.log(B);   //2

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/97426.html

相關(guān)文章

  • ECMAScript6 新特性——“l(fā)et和const命令”

    摘要：基本用法所聲明的變量，只在命令所在的代碼塊內(nèi)有效。在循環(huán)中適合使用不存在變量提升不像那樣會(huì)發(fā)生變量提升現(xiàn)象暫時(shí)性死區(qū)只要塊級(jí)作用域內(nèi)存在命令，它所聲明的變量就綁定這個(gè)區(qū)域，不再受外部的影響。塊級(jí)作用域?qū)嶋H上為新增了塊級(jí)作用域。 1 let 基本用法 所聲明的變量，只在let命令所在的代碼塊內(nèi)有效。 { let b = 100; console.log(b); //100...

    PascalXie 評(píng)論0 收藏0

  • 常用ECMAScript6語法歸納

    摘要：對(duì)象的解構(gòu)賦值函數(shù)執(zhí)行后，返回的是一個(gè)對(duì)象。分別取出對(duì)象中屬性為和的值，根據(jù)解構(gòu)賦值的規(guī)則，在左側(cè)聲明變量，放在大括號(hào)中，變量名要和屬性名保持一致。箭頭函數(shù)在中，箭頭函數(shù)就是函數(shù)的一種簡寫形式允許使用箭頭定義函數(shù)。 原文博客地址，歡迎學(xué)習(xí)交流:點(diǎn)擊預(yù)覽 聲明變量 可以使用let、const關(guān)鍵字聲明變量，而不推薦使用var聲明變量 var聲明變量的問題： 可以多次重復(fù)聲明同一個(gè)變量...

    raledong 評(píng)論0 收藏0

  • ECMAScript6標(biāo)準(zhǔn)入門（一）新增變量與數(shù)據(jù)結(jié)構(gòu)

    摘要：一簡介與的關(guān)系是的規(guī)格，是的一種實(shí)現(xiàn)另外的方言還有和轉(zhuǎn)碼器命令行環(huán)境安裝直接運(yùn)行代碼命令將轉(zhuǎn)換成命令瀏覽器環(huán)境加入，代碼用環(huán)境安裝，，根目錄建立文件加載為的一個(gè)鉤子設(shè)置完文件后，在應(yīng)用入口加入若有使用，等全局對(duì)象及上方法安裝 一、ECMAScript6 簡介 (1) 與JavaScript的關(guān)系 ES是JS的規(guī)格，JS是ES的一種實(shí)現(xiàn)（另外的ECMAScript方言還有Jscript和...

    Tangpj 評(píng)論0 收藏0

  • ES6學(xué)習(xí)摘要（01）（新人學(xué)習(xí)）

    摘要：入門一前言由于最近本人在學(xué)習(xí)，做一些筆記能夠更好的熟悉，就趁此機(jī)會(huì)來寫一篇關(guān)于的新人學(xué)習(xí)摘要吧。的作用域與命令相同只在聲明所在的塊級(jí)作用域內(nèi)有效。塊級(jí)作用域新增方式和實(shí)際上為新增了塊級(jí)作用域。同時(shí)，函數(shù)聲明還會(huì)提升到所在的塊級(jí)作用域的頭部。 ECMAScript6/ES6 入門 一、前言 由于最近本人在學(xué)習(xí)ES6，做一些筆記能夠更好的熟悉，就趁此機(jī)會(huì)來寫一篇關(guān)于ES6的新人學(xué)習(xí)摘要吧。...

    dmlllll 評(píng)論0 收藏0

  • 深入理解ES6 - var-let-const

    摘要：聲明變量不存在變量提升。臨時(shí)死區(qū)，而且不能在聲明之前訪問它。禁止重復(fù)聲明相同的變量，否則報(bào)錯(cuò)。不存在變量提升，一旦執(zhí)行快外就會(huì)立即銷毀。聲明不允許修改綁定，但允許修改值，也就是說用創(chuàng)建對(duì)象后，可以修改該對(duì)象的屬性值。 知識(shí)點(diǎn) var 聲明變量： 1、存在變量提升，實(shí)際上var無論在哪里聲明，都會(huì)被當(dāng)做當(dāng)前的作用域頂部聲明變量。 2、可以重復(fù)聲明，后聲明的變量會(huì)覆蓋前聲明的變量。 let...

    alexnevsky 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<