1. 程式人生 > >js變數中有var定義和無var定義的區別,es6中let命令和const命令

js變數中有var定義和無var定義的區別,es6中let命令和const命令

之前我們在寫js程式碼的時候都知道可以用var定義全域性變數和區域性變數,也可以省略var,而且在非嚴格模式下不會報錯,但是並不知道兩者的區別...

var x = 1;
y = 4;
console.log(x);//1
console.log(y);//4

console.log(window.x);//1
console.log(window.y);//4

簡單測試下可以知道定義的x和y都被掛載在window物件上,變為window下的屬性,這並不能說明什麼...

delete x;
delete y;

console.log(window.x);//1
console.log(window.y);//undefined

再看看執行上面程式碼之後x屬性沒有被刪除,y被刪除了,這是區別就來了

在通過var進行定義後的變數不能被delete刪除,這是什麼原因?ECMAScript 5標準中,可以通過Object.getOwnPropertyDescriptor()來獲取物件自身某個property的屬性資訊:

console.log(Object.getOwnPropertyDescriptor(window,"x"));
console.log(Object.getOwnPropertyDescriptor(window,"y"));

得到如下資訊:


當不使用var進行定義是,變數預設的configurable為true,可以進行delete等命令進行操作,而當var在定義一個全域性變數的時候configurable 變為了false,即不會被delete刪除.

此外,簡單說一下關於變數提升問題

alert(a);//Uncaught ReferenceError: a is not defined
a = 100;
alert(b);//undefined
var b = 200;
先說第二段程式碼,var宣告的全域性變數b在js中會進行程式碼提升,也就是說var b = 200;會被分解為var b;b=200;程式碼解析的第時候會將var b;提升到最前面,並且在記憶體中開闢一個空間,由於b沒有被賦值,預設為undefined.第一段程式碼中當js執行alert()函式時候由於沒有進行var宣告,變數沒有被提升,不存在記憶體開闢,所以在alert時候直接報錯!

在ECMAScript6標準中,一個重要的概念就是"JavaScript嚴格模式",需要在最前面加上"use strict

";

let注意點:

1.let擁有塊級作用域,一個{}就是一個作用域

2.let在其作用域下面不存在變數提升

3.let在其作用域中不能被重複宣告(函式作用域和塊級作用域)

第一點:let的塊級作用域

注意:以下程式碼都在嚴格模式下執行的

let n = 10;
if(true){
	let n = 50;
}
console.log(n);//10
表示外層程式碼塊不受內層程式碼塊的影響,如果是用var定義的變數n,那麼輸出的就是修改後的50.

第二點:變數提升問題

alert(a);//Uncaught ReferenceError: a is not defined
let a = 100;

不同var,let不存在變數提升,以上寫法會直接報錯.

第三點:重複宣告問題

(function(){
	let lTest = "let";
	var vTest = "var"
	
	let lTest = "let changed";//Uncaught SyntaxError: Identifier 'lTest' has already been declared
	var vTest = "var changed";
	
	console.log(lTest);
	console.log(vTest);
})();
let在同一個作用域下不允許進行重複變數宣告.否則也是直接報錯!!!


const命令

const用來宣告常量,一旦宣告,其值就不可以更改,如果你非得修改變數的值,js不會報錯,只是默默表示失敗(不起作用)

const的作用域與let相同,只在宣告所在的塊級作用域內有效,並且也是和let一樣不可以重複進行宣告.