es6宣告變數有幾種方法

es6宣告變數有6種方法：1、用關鍵字var宣告變數；2、用關鍵字function宣告變數；3、用關鍵字const宣告變數；4、用關鍵字let宣告變數； 5.用關鍵字class宣告變數；6、用關鍵字import宣告變數。

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

ES5 只有兩種宣告變數的方法：var指令和function指令。

ES6 除了加入let和const指令，還有兩種宣告變數的方法：import指令和class指令。

所以，ES6 一共有 6 種宣告變數的方法。

1、用關鍵字var宣告變數

var a ;　　//undefined
var b = 1;

• var定義的變數可以修改，如果不初始化會輸出undefined，不會報錯
• var 宣告的變數在window上，用let或const去宣告變量，這個變數不會放到window上
• 很多語言都有區塊級作用域，但JS沒有，它使用var宣告變量，以function來分割作用域，大括號「{}」 卻限定不了var的作用域，因此用var宣告的變數具有變數提升的效果
• var 宣告的變數作用域是全域的或是函數級的

2、用關鍵字function宣告變數

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

• 聲明了一個名為add的新變量，並為其分配了一個函數定義
• {}之間的內容被分配給了add
• 函數內部的程式碼不會被執行，只是儲存在變數中以備將來使用

3、用關鍵字const宣告變數

#

const a;     //报错，必须初始化
const b = 1;

• const定義的變數不可以修改，而且必須初始化
• 該變數是個全域變量，或是模組內的全域變數
• 如果一個變數只有在宣告時才被賦值一次，永遠不會在其它的程式碼行裡被重新賦值，那麼應該使用const，但是該變數的初始值有可能在未來會被調整（常變數）
• 建立一個唯讀常數，在不同瀏覽器上表現為不可修改；建議申明後不修改；擁有區塊級作用域
• const 代表一個值的常數索引 ，也就是說，變數名字在記憶體中的指標不能夠改變，但是指向這個變數的值可能會改變
##const定義的變數不可修改，一般在require一個模組的時候用或定義一些
• 全域常數
• #可以在全域作用域或是函數內宣告常數，但是

  必須初始化常數

• 常數不能和它所在作用域內其它變數或函數擁有相同名稱

4、用關鍵字let宣告變數

let a;　　//undefined
let b = 1; 
function add(b) {
　　let sum = b + 1;
　　return sum;
}
let c = add(b);

 需要」javascript 嚴格模式」：
• 'use strict';
不存在變數提升
• 不允許重複宣告
• let宣告的變數作用域是在區塊層級域中，函數內部使用let定義後，對函數外部無影響(
• 區塊層級作用域)
可以在宣告變數時為變數賦值，預設​​值為undefined,也可以在腳本中給變數賦值，在生命前無法使用(暫時死區)

5、用關鍵字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類別的建構方法。

6、用關鍵字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

【相关推荐：javascript视频教程、web前端】

以上是es6宣告變數有幾種方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！