es6變量定義的方法有哪些

本篇內容介紹了“es6變量定義的方法有哪些”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

es6的6種變量定義方法：1、用關鍵字var定義變量，語法“var 變量名=值;”；2、用關鍵字function定義變量；3、用關鍵字const定義變量，語法“const 變量名=值;”；4、用關鍵字let定義變量，語法“let 變量名=值;”；5、用關鍵字import定義變量；6、用關鍵字class定義變量。

es6聲明變量的6 種方法

es5只提供了兩種聲明變量的方法，即var和function。

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

所以，ES6 一共有 6 種聲明變量的方法，即var / function / let / const / import / class

(1) var命令

var a ;　　//undefined
var b = 1;

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

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

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

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

(2)function命令

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

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

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

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

(3) cosnt命令

const a;     //報錯，必須初始化
const b = 1; 
b = 2;      //報錯，TypeError: Assignment to constant variable.

• const定義一個常量，且必須初始化。

• const關鍵字聲明的常量的指針不能發生改變。這里說的是常量的指針不能發生改變，但指針所指向的內存空間的值是可以發生變化的。
  例如：

const obj = {};
obj.n = 123;
obj; // { n: 123 }
obj = { x: 1 }; // TypeError: Assignment to constant variable.

const聲明了一個名為obj的對象，obj指針指向一個對象，在對象中添加屬性，是在該對象的數據里添加數據，而沒有改變obj中存放的指向該對象的地址，所以是可以執行成功的，而對obj重新賦值的操作則改變了obj的指針指向，故而操作失敗，拋出錯誤。
對于基本類型也是同樣，因為基本類型的數據直接就存放在棧中，常量名直接指向這個地址上的數據，一旦改變值，就會導致指針地址發生改變，所以造成了無法改變值的假象。

• 該變量是個全局變量，或者是模塊內的全局變量，擁有塊級作用域。

• 如果一個變量只有在聲明時才被賦值一次，永遠不會在其它的代碼行里被重新賦值，那么應該使用const，但是該變量的初始值有可能在未來會被調整（常變量）。

• const定義的變量，一般在require一個模塊的時候用或者定義一些全局常量。

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

(4) let命令

需要”javascript 嚴格模式”：‘use strict’；

----不存在變量提升

console.log(a);  //ReferenceError: a is not defined
let a = "apple";
 
console.log(b);  //undefined
var b = "banana";

變量 b 用 var 聲明存在變量提升，所以當腳本開始運行的時候，b 已經存在了，但是還沒有賦值，所以會輸出 undefined。
變量 a用 let 聲明不存在變量提升，在聲明變量 a 之前，a 不存在，所以會報錯。

不允許重復聲明

let a = 1;
let a = 2;
var b = 3;
var b = 4;
a  // Identifier 'a' has already been declared
b  // 4

let只能聲明一次，var可以聲明多次

塊級作用域（即只在一個{ }中有效）

{
  let a = 0;
  a   // 0
}
a   // 報錯 ReferenceError: a is not defined

函數內部使用let定義后，對函數外部無影響

可以在聲明變量時為變量賦值，默認值為undefined，也可以稍后在腳本中給變量賦值，在聲明前無法使用(暫時死區)

let a;
console.log(a);    //  undefined
console.log(b);   // ReferenceError: b is not defined
let b = 1;
a = 2;
console.log(a);     // 2

注意：ES6 明確規定，代碼塊內如果存在 let 或者 const，代碼塊會對這些命令聲明的變量從塊的開始就形成一個封閉作用域。代碼塊內，在聲明變量 PI 之前使用它會報錯。

var PI = "a";
if(true){
  console.log(PI);  // ReferenceError: PI is not defined
  const PI = "3.1415926";
}

(5) 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

(6) class命令

在es5中我們是使用構造函數實例化出來一個對象，那么構造函數與普通的函數有什么區別呢？其實沒有區別，無非就是函數名稱用首字母大寫來加以區分，這個不用對說對es5有了解的朋友都應該知道。
但是es5的這種方式給人的感覺還是不夠嚴謹，于是在es6中就換成了class，就是把es5中的function換成了class，有這個單詞就代表是個構造函數，然后呢對象還是new出來的，這一點并沒有變化。

類的使用

從里面的代碼我們可以看到除了function變成了class以外，其它的跟es5一樣

class Coder{
    name(val){
        console.log(val);
    }}
 let shuang= new Coder;shuang.name('shuang');

類的傳參

在es6中的對象的屬性都是寫在constructor里面，方法都是在原型身上。在這里面的代碼用constructor約定了兩個參數，然后用add（）方法把參數相加，這個地方跟以前不太一樣，所以需要多注意一下。

class Coder{
    name(val){
        console.log(val);
        return val;
    }

    constructor(a,b){
        this.a=a;
        this.b=b;
    }
 
    add(){
        return this.a+this.b;
    }}
 let shuang=new Coder(1,2);console.log(shuang.add());

class的繼承

class的繼承就是用extends

class shuang extends Coder{
 }
 let shuang=new shuang;shuang.name('Angel爽');

聲明一個shuang的新類，用extends繼承了Coder，調用里面的name方法，發現也是可以輸出的。

“es6變量定義的方法有哪些”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！