ES6 let和const定義變量與常量的應(yīng)用實(shí)例分析
本文實(shí)例講述了ES6 let和const定義變量與常量的應(yīng)用。分享給大家供大家參考,具體如下:
關(guān)于 let
- let是小作用域的變量的聲明
{
var a = 12;
let b = 15;
{
console.log(a); // 12
console.log(b); // 15
}
}
- let 是塊級作用域,不會被提升;var是函數(shù)級的變量,存在變量提升,外部可訪問
console.log(a); // Uncaught ReferenceError: a is not defined,直接報(bào)錯 let a = 12; // let定義的變量不能進(jìn)行變量的提升
console.log(b); // undefined var b = 12; // 上面的過程存在變量提升過程如下: /* var b; console.log(b); b = 12; */
- {} 塊級作用域,子集可訪問,外部不可訪問
{
var a = 12;
let b = 15;
console.log(b); // 15
}
console.log(a); // 12
console.log(b); // Uncaught ReferenceError: b is not defined
- let 在for循環(huán)中有效, var 在for循環(huán)外仍有效
for(var i=0;i<5;i++) {}
console.log(i); // 5
for(let m=0;m<5;m++){}
console.log(m); // Uncaught ReferenceError: m is not defined
- 變量在外部定義后,在內(nèi)部輸出,然后再次使用let關(guān)鍵詞聲明,那么之前輸出會【失效】報(bào)錯
var a = 18;
var b = 10;
fun();
function fun(){
console.log(b); // 10
console.log(a); // Uncaught ReferenceError: a is not defined
let a;
}
- 使用let聲明的變量唯一, 不能重復(fù)聲明
let a; var a; // Uncaught SyntaxError: Identifier 'a' has already been declared
- {} 塊級作用域等效于立即執(zhí)行函數(shù)
var config = (function () {
var res = [];
res.push(1);
res.push(2);
res.push(3);
return res;
})();
console.log(config); // [1,2,3]
let config;
{
config = [];
config.push(1);
config.push(2);
config.push(3);
}
console.log(config); // [1,2,3]
- 嚴(yán)格模式下的函數(shù)不會被提升
'use strict';
function a(){console.log(1);}
(function () {
a(); // 去除'use strict' 之后 報(bào)錯:a is not a function,加上'use strict'之后正常,輸出1
if(false) {
function a(){console.log(2);} // 此處重新聲明和賦值了一個a函數(shù),上面輸出1的時候表示沒有被提升
}
})();
- 使用var在for循環(huán)中定義的變量保持最后一個值的狀態(tài)
var arr = [];
for(var i=0;i<5;i++) {
arr.push(function () {
console.log(i);
})
}
arr[1](); // 5
- 使用var在for循環(huán)中定義的變量可使用自執(zhí)行函數(shù)和閉包維持變量的狀態(tài)
var arr = [];
for(var i=0;i<5;i++) {
arr.push((function (i) {
return function () {
console.log(i);
}
})(i));
}
arr[1](); // 1
- 使用let在for循環(huán)中定義的變量可自動維持變量的狀態(tài)
var arr = [];
for(let i=0;i<5;i++) {
arr.push(function () {
console.log(i);
})
}
arr[1](); // 1
關(guān)于 const
- 所有屬性同let
- 使用const定義的是常量不可被修改,而指針對象的地址不可被修改,其屬性可以被修改
const a = {
name:'J'
};
a.name = 'Z';
a.age = 10;
console.log(a); // {name: "Z", age: 10}
a = {}; // 嘗試修改引用的地址
console.log(a); // Uncaught TypeError: Assignment to constant variable.
- 使用Object的freeze進(jìn)行凍結(jié)對象, 嚴(yán)格模式下會報(bào)錯,非嚴(yán)格模式下無法修改
const a = {
name:'K'
}
a.age = 13;
console.log(a); // {name: "K", age: 13}
Object.freeze(a);
a.age = 14;
console.log(a); // Uncaught TypeError: Cannot assign to read only property 'age' of object '#<Object>'
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
javascript制作sql轉(zhuǎn)換為stringBuffer的小工具
這篇文章主要介紹了javascript制作sql轉(zhuǎn)換為stringBuffer的小工具,使用方法很簡單,吧寫好的sql語句只要格式化好之后放進(jìn)去就可以了,推薦給大家,有需要的小伙伴可以參考下。2015-04-04
javascript hashtable實(shí)現(xiàn)代碼
javascript中沒有像c#,java那樣的哈希表(hashtable), 然而,javascript中的Array也只有一些類似于'哈希表'的非常簡單功能。2009-10-10
純?JS?實(shí)現(xiàn)的輕量化圖片編輯器實(shí)例詳解
這篇文章主要為大家介紹了純JS實(shí)現(xiàn)的輕量化圖片編輯器實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-10-10
javascript實(shí)現(xiàn)炫酷的拖動分頁
非??岬膉avascript拖動分頁功能,無縫循環(huán)分頁,拖動鼠標(biāo)即可完成分頁,鼠標(biāo)向左拖動回到前一頁,向右拖動則翻開第二頁,還帶有動畫特效,著實(shí)很不錯,界面黑色,非主流風(fēng)格,相信很多人會喜歡的。2015-05-05
微信小程序多列表渲染數(shù)據(jù)開關(guān)互不影響的實(shí)現(xiàn)
這篇文章主要介紹了微信小程序多列表渲染數(shù)據(jù)開關(guān)互不影響的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06
Javascript保存網(wǎng)頁為圖片借助于html2canvas庫實(shí)現(xiàn)
借助于html2canvas庫,把網(wǎng)頁保存為Canvas畫布,再把生成的canvas保存成圖片,下面的示例,大家可以看看2014-09-09
OkHttp踩坑隨筆為何 response.body().string() 只能調(diào)用一次
想必大家都用過或接觸過 OkHttp,我最近在使用 Okhttp 時,就踩到一個坑,在這兒分享出來,以后大家遇到類似問題時就可以繞過去2018-01-01

