JavaScript 變量的使用

JavaScript(JS) 中"變量"的使用

1. 變量的定義： 變量是指程序中一個已經命名的儲存單位，它的主要做用就是爲數據操做提供存放信息的容器。
2. 變量的命名：

• 必須以字母或下劃線（_）開頭，中間能夠是數字、字母或下劃線；
• 變量名不能包括空格、加、減等符號；
• 不能使用JS中關鍵字做爲變量名，如int,new等；
• JS的變量名嚴格區分大小寫；

3. 變量的聲明與賦值：
   在JS中，var 就是專門用來聲明變量的；

聲明一個變量 var 變量名;
若是僅僅是聲明一個變量，不對變量進行賦值，那麼這個變量是有默認值(undefined)
如：var x；  輸出就是 undefined
注：一個 var 能夠同時聲明多個變量，中間用逗號隔開。 如：var x,y,z;

---

定義一個變量 var x=1;
對變量進行聲明的時候，同時爲變量進行賦值，對變量"x"的操做，本質就是對數值"1"的操做
注：聲明變量的同時，也能夠對多個變量進行賦值。如：var x=1,y=2,z=3;

---

注：若是對同一個變量進行屢次賦值，那麼後者將覆蓋前者。
如：var x=1;
  var x=2;
那麼"x"的值最終爲"2"

---

使用 var 聲明的變量能夠進行提高 。提高就是把加 var 的變量提到代碼的最前面。由於JS代碼在執行以前有一個預解析，預解析的時候作了兩件事，把加var的變量提高，把函數提高。

---

一個script標籤就是一個代碼段。預解析完後，纔會執行JS代碼

---

提高的時候僅僅是提高了聲明
如：

console.log(x)   //輸出結果：undefined
  var x = 666;
  console.log(x)    //輸出結果：666
複製代碼

上面代碼至關於以下代碼：

var x;  
console.log(x)   //輸出結果：undefined
x = 666;  
console.log(x)   //輸出結果：666
複製代碼

4. 全局變量 和 局部變量：
   JS中的變量分兩類：全局，局部
    全局變量指變量在函數內外均可以訪問
    局部變量指只能在函數內部訪問
   特別注意：在JS中，全局變量和局部變量的分界點是"函數" (想了解函數的使用，能夠關注我)

全局變量

var age = 100;
function f(){
    console.log("在函數裏面訪問的全局變量"+age)
}
console.log(age)                       先輸出
f()            // 函數調用             後輸出
複製代碼

輸出結果：100
     在函數裏面訪問的全局變量100
注：若是你要使用這個函數，那麼你必定要調用這個函數，不然不起做用

---

局部變量

function f(){
       var name = "xiao";  // 局部變量，由於這個變量放在函數裏面
       console.log(name)
   }
console.log("----"+name)     先輸出
f()                          後輸出
複製代碼

輸出結果：----
     xiao
由於這個變量放在函數裏，因此爲局部變量，函數外面訪問不了

---

當局部變量 提高 時，局部變量是提高到了函數體的最前面
示例：

function f(){
    console.log(a)
    var a = 2;
}
f();  
複製代碼

上面代碼至關於以下代碼：

function f(){  
    var a;
    console.log(a)
    a = 2;
}
f();
複製代碼

console.log(); 意思是在瀏覽器的控制檯輸出

看以下代碼，說出它是 全局變量 仍是 局部變量

for(var i=0; i<10; i++){
}
console.log(i)  
複製代碼

答：是全局變量，緣由是全局變量和局部變量的分界點是函數

加var變量不足之處：

1，提高 全局變量的提高，局部變量的提高

2，同名變量，那麼後面的變量會覆蓋前面的變量

3，能夠省去var

....

---

重點重點重點,曾經踩過的坑

給出一下代碼,說出結果：

(function ab() {
	var a=b=2;
	console.log(typeof a) //number
	console.log(typeof b) //number

})()
console.log(typeof a) //undefined
console.log(typeof b)
複製代碼

因爲 a 和 b 都定義在函數的封閉範圍內，而且都始於 var關鍵字，大多數人都指望 typeof a 和 typeof b 在上面的例子中都是undefined

然而，事實並不是如此。這裏的問題是，大多數人將語句 var a = b = 3; 錯誤地理解爲是如下聲明的簡寫：

var b = 3;
var a = b;
複製代碼

但事實上，var a = b = 3; 實際是如下聲明的簡寫：

b = 3;
var a = b;
複製代碼

那麼運行下面這段代碼：

(function ab() {
	var a=b=2;
})()
console.log(b)
console.log(a)
複製代碼

獲得的結果是：

2
下面報錯: Uncaught ReferenceError: a is not defined
複製代碼

能夠看出這裏的a是局部變量，而b是全局變量

---

總結： 使用var聲明變量，在這前用的比較多，在ES6出來後，又定義了兩個關鍵字，一個叫let (能夠聲明塊級做用域)， 一個叫const 也就是說，在JS中，咱們之後儘可能使用let或const來聲明變量，有的低版本瀏覽器，對這個let和const支持不給力(極少數)

---

let 的使用

若是使用了let聲明的變量，那麼這個變量是不會提高的

示例：

console.log(a)  
let  a = 1;  
複製代碼

那麼它會直接報錯，而不會輸出 undefined

若是使用了let聲明的變量，能夠防止重複聲明

示例：

let a = 1;
 let a = 2;
 let a = 3;
 console.log(a) 
複製代碼

那麼它會直接報錯

使用let能夠造成一個塊級做用域，一個{}就是一個塊級做用域

示例：

{
     let a = 10;
     console.log(a)   輸出結果：10
}
console.log(a)        輸出結果：直接報錯
複製代碼

示例：

let a = 10;
{
     console.log(a)
     //  let a = 666;
}  
複製代碼

輸出結果：10 （若是把let a = 666;的註釋取消，就會直接報錯）
注：暫存性死區 若是你在這個塊級做用域中使用let聲明瞭一個變量，在塊級做用域外面也有一個同名的變量，當你要在塊級做用域中這個變量前面去訪問這個變量時，那麼它會這樣考慮，在塊級做用域中已經有了a,只不過你是訪問不了的，是由於let聲明的變量不能提高

---

若是在for循環中循環變量若是使用了let ，你能夠把它看成是塊級做用域中的變量，也就是說，只要出來{} i 就不能生效 。因此，之後在使用for循環的時候，不要使用var來聲明一個循環變量，要使用let來聲明一個循環變量

const 的使用

const 是用來聲明一個 常量

示例：

const PI = 3.14
PI = 666;   若是聲明瞭一個常量，那麼這個常量的值，你是不能隨便改變
console.log(PI)  
複製代碼

輸出結果：直接報錯

const 聲明的常量也是不能 提高 的

總結：

let
與var相似，用來定義變量
特色：

• 塊級做用域(第三種做用域)。let所聲明的變量，只在let命令所在的代碼塊內有效
• let沒有「變量提高」現象
• 不會成爲window對象的屬性
• 暫存性死區（TDZ）
• 不能重複定義

const
聲明常量,值不能改變
特色：

• 定義完後，不能修改值(多是基本數據類型，也多是地址)
• 不能重複聲明
• 沒有提高
• 聲明時必須賦值

之後能使用 let 和 const 的，就使用 let 和 const ，儘可能不要使用 var

---

深刻理解變量

加var和不加var的區別

• 區別一:

局部變量 全局變量

• 區別二:

可刪除的,不可刪除的

• 區別三:

加var會提高,不加var不會被提高(參考前面的內容)

變量的做用域

• 全局:global

• 局部:local

• 變量的就近原則

全局變量

局部變量

• 塊級做用域

JS中沒有塊級做用域

注意:只有函數可以劃分做用域

---

^_<