es6中能不能用var聲明變量

這篇文章主要講解了“es6中能不能用var聲明變量”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“es6中能不能用var聲明變量”吧！

es6能用var聲明變量。var是聲明變量的一個關鍵字，使用var關鍵字聲明的變量，其作用域有兩種：全局作用域和函數作用域；由于var支持變量提升，所以用var聲明的全局變量在整個腳本代碼中有效，使用var聲明的局部變量在整個函數中有效。

本教程操作環境：windows7系統、ECMAScript 6版、Dell G3電腦。

ES5 只有兩種聲明變量的方法：var命令和function命令。

ES6 除了添加let和const命令，還有兩種聲明變量的方法：import命令和class命令。

所以，ES6 一共有 6 種聲明變量的方法：

• 用關鍵字var聲明變量

• 用關鍵字function聲明變量

• 用關鍵字const聲明變量

• 用關鍵字let聲明變量

• 用關鍵字class聲明變量

• 用關鍵字import聲明變量

用關鍵字var聲明變量

var是聲明變量的一個關鍵字，聲明方法：

var 變量名;

舉幾個例子：

var str;  //用來存儲字符串
var age;  //用來存儲年齡
var prePage;  //用來存儲上一頁

定義變量時，可以一次定義一個或多個變量，若定義多個變量，則需要在變量名之間使用逗號,分隔開，如下例所示：

var a, b, c;    // 同時聲明多個變量

變量定義后，如果沒有為變量賦值，那么這些變量會被賦予一個初始值——undefined（未定義）。

變量定義后，可以使用等于號=來為變量賦值，等號左邊的為變量的名稱，等號右邊為要賦予變量的值，如下例所示：

var num;    // 定義一個變量 num
num = 1;    // 將變量 num 賦值為 1

此外，也可以在定義變量的同時為變量賦值，如下例所示：

var num = 1;                // 定義一個變量 num 并將其賦值為 1
var a = 2, b = 3, c = 4;    // 同時定義 a、b、c 三個變量并分別賦值為 2、3、4
// var a = 2,               // 為了讓代碼看起來更工整，上一行代碼也可以寫成這樣
//     b = 3,
//     c = 4;

說明：

• var定義的變量可以修改，如果不初始化會輸出undefined，不會報錯

• var 聲明的變量在window上，用let或者const去聲明變量，這個變量不會被放到window上

• 很多語言中都有塊級作用域，但JS沒有，它使用var聲明變量，以function來劃分作用域，大括號“{}” 卻限定不了var的作用域，因此用var聲明的變量具有變量提升的效果

• var 聲明的變量作用域是全局的或者是函數級的

擴展知識：

let 和 const 關鍵字聲明變量

2015 年以前，JavaScript 只能通過 var 關鍵字來聲明變量，在 ECMAScript6（ES6）發布之后，新增了 let 和 const 兩個關鍵字來聲明變量，其中：

• 使用 let 關鍵字聲明的變量只在其所在的代碼塊中有效（類似于局部變量），并且在這個代碼塊中，同名的變量不能重復聲明；

• const 關鍵字的功能和 let 相同，但使用 const 關鍵字聲明的變量還具備另外一個特點，那就是 const 關鍵字定義的變量，一旦定義，就不能修改（即使用 const 關鍵字定義的為常量）。

注意：IE10 及以下的版本不支持 let 和 const 關鍵字。

示例代碼如下：

let name = "小明";      // 聲明一個變量 name 并賦值為“小明”
let age  = 11;          // 聲明一個變量 age
let age  = 13;          // 報錯：變量 age 不能重復定義
const PI = 3.1415       // 聲明一個常量 PI，并賦值為 3.1415
console.log(PI)         // 在控制臺打印 PI

var、let和const的作用域

使用 var 聲明的變量的作用域有全局作用域和函數作用域；使用 let 和 const 聲明的變量有全局作用域、局部作用域和塊級作用域。

由于 var 支持變量提升，所以 var 變量的全局作用域是對整個頁面的腳本代碼有效；而 let 和 const 不支持變量提升，所以 let 和 const 變量的全局作用域指的是從聲明語句開始到整個頁面的腳本代碼結束之間的整個區域，而聲明語句之前的區域是沒有效的。

同樣，因為 var 支持變量提升，而 let 和 const 不支持變量提升，所以使用 var 聲明的局部變量在整個函數中有效，而使用 let 和 const 聲明的局部變量從聲明語句開始到函數結束之間的區域有效。需要注意的是，如果局部變量和全局變量同名，則在函數作用域中，局部變量會履蓋全局變量，即在函數體中起作用的是局部變量；在函數體外，全局變量起作用，局部變量無效，此時引用局部變量將出現語法錯誤。

用關鍵字function聲明變量

function add(a) {
　　var sum = a + 1;
　　return sum;
}

• 聲明了一個名為 add的新變量，并為其分配了一個函數定義

• {}之間的內容被分配給了 add

• 函數內部的代碼不會被執行，只是存儲在變量中以備將來使用

用關鍵字class聲明變量

關于class，后期我會單獨寫一篇文章，詳細的介紹一下，這里就簡單說一下： 首先通過看ES5中的構造函數，然后再用ES6的class去實現：

// ES5寫法 ：
  function fun ( x, y ){
    this.x = x;
    this.y = y;
  };
  fun.prototype.GetHair = function(){
    return `${this.x}掉了兩根頭發，${this.y}說俺也一樣！`;
  };
  let setHair = new fun('小明','老王');
  console.log(setHair.GetHair()); // 小明掉了兩根頭發，老王說俺也一樣！

再來看一下ES6的class寫法：

 class Interest {
    constructor( x, y, e, z ){
      this.x = x;
      this.y = y;
      this.e = e;
      this.z = z;
    }
    MyInterest(){
      let arr = [];
      console.log(`我會${[...arr,this.x,this.y,this.e,this.z]}!`);
    }
  }
  let GetInterest = new Interest('唱','跳','rap','籃球');
  console.log(GetInterest.MyInterest());  //我會唱,跳,rap,籃球!

ES6 的class可以看作只是一個語法糖，它的絕大部分功能，ES5 都可以做到，新的class寫法只是讓對象原型的寫法更加清晰、更像面向對象編程的語法而已，constructor方法就是構造方法，而this關鍵字則代表實例對象。也就是ES5 的構造函數Point，對應 ES6 的Point類的構造方法。

用關鍵字import聲明變量

import用于加載文件，在大括號接收的是一個或多個變量名，這些變量名需要與你想要導入的變量名相同。

舉個栗子：你想要導入action.js文件中的某一個變量，這個變量里保存了一段代碼塊，所以你要寫成：import { Button } from 'action'，這個時候，你就從action.js中獲取到了一個叫 Button 的變量，既然獲取到了，你就可以對Button里的代碼猥瑣欲為了

如果想為輸入的變量重新取一個名字，import命令要使用as關鍵字，將輸入的變量重命名，比如：

import { NewButton as Button } from 'action.js';

上面的代碼表示從action.js文件中，獲取一個變量名稱叫做Button的代碼段，然后你又聲明了一個變量 NewButton ，將 Button 保存在 NewButton

感謝各位的閱讀，以上就是“es6中能不能用var聲明變量”的內容了，經過本文的學習后，相信大家對es6中能不能用var聲明變量這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！