es6新增的聲明方法怎么用

本文小編為大家詳細(xì)介紹“es6新增的聲明方法怎么用”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“es6新增的聲明方法怎么用”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識(shí)吧。

新增聲明方法：1、let，用于聲明變量，語法“l(fā)et 變量名=值”；2、const，用于聲明常量，語法“const 常量名=值”；3、class，用于聲明類，語法“class 類名{...}”；4、import，用于聲明靜態(tài)加載的輸入變量。

本文操作環(huán)境：windows10系統(tǒng)、Vue2.9.6版，DELL G3電腦。

es6新增的聲明方法有什么

聲明變量在ES5之前有兩種：第一種是聲明變量和常量的 “ var ”。第二種是聲明函數(shù)的 “ function ”。在ES6中，聲明變量的方法一下子擴(kuò)充了到了 6 種，總結(jié)如下：

聲明變量或常量：var 、let（ES6新增） 、const （ES6新增）;

聲明函數(shù)變量：function ；

聲明類：class（ES6新增）；

聲明 ‘ 靜態(tài)加載 ’ 輸入變量：import （ES6新增）；

在我們學(xué)習(xí)這幾個(gè)新增的方法之前，還需要知道幾個(gè)ES6新定義的概念：

1，let和const

定義：

let： ES6 新增了let命令，用來聲明變量。它的用法類似于var，但是所聲明的變量，只在let命令所在的塊級(jí)作用域內(nèi)有效。

const：ES6新增了const命令，聲明一個(gè)只讀的常量。一旦聲明，常量的值就不能改變。同let一樣聲明的變量只在塊級(jí)作用域內(nèi)有效；

特點(diǎn)差異：

相同：都不存在變量提升，所以只能聲明后再使用，不聲明使用會(huì)報(bào)錯(cuò)；

都有暫時(shí)性死區(qū)（TDZ），這也解釋了為什么不聲明變量就使用會(huì)報(bào)錯(cuò)；

都不允許重復(fù)聲明；

不同：const聲明的變量是 “ 不可改變 ” 的變量，所以在聲明變量時(shí)必須直接賦值，常量賦值后不能改變值，否則報(bào)錯(cuò)；

注意：上邊我們說的const聲明的變量不可改變是針對(duì) “常量” 我理解是“ 基本數(shù)據(jù)類型 ”，比如字符串，數(shù)值，布爾值等等。并不是指的所有數(shù)據(jù)類型，當(dāng)我們用const聲明的變量是引用數(shù)據(jù)類型時(shí)，是可以改變值的。

這里就說到了const保存的內(nèi)容的真正含義：const實(shí)際上保證的，并不是變量的值不得改動(dòng)，而是變量指向的那個(gè)內(nèi)存地址所保存的數(shù)據(jù)不得改動(dòng)。對(duì)于簡(jiǎn)單類型的數(shù)據(jù)（數(shù)值、字符串、布爾值），值就保存在變量指向的那個(gè)內(nèi)存地址，因此等同于常量。

但對(duì)于復(fù)合類型的數(shù)據(jù)（主要是對(duì)象和數(shù)組），變量指向的內(nèi)存地址，保存的只是一個(gè)指向?qū)嶋H數(shù)據(jù)的指針，const只能保證這個(gè)指針是固定的（即總是指向另一個(gè)固定的地址），至于它指向的數(shù)據(jù)結(jié)構(gòu)是不是可變的，就完全不能控制了。因此，將一個(gè)對(duì)象聲明為常量必須非常小心。

用法：

// let 用法
let a = '123';
 
// const 用法
const b = '456'

2，class

定義：ES6 的class可以看作只是一個(gè)語法糖，它的絕大部分功能，ES5 都可以做到，新的class寫法只是讓對(duì)象原型的寫法更加清晰、更像面向?qū)ο缶幊痰恼Z法而已。

（class定義類，其實(shí)是很重要的一個(gè)知識(shí)，這里只是簡(jiǎn)單的學(xué)習(xí)一下它的最最最基本的用法，也是作為一個(gè)引子。深入的學(xué)習(xí)我們會(huì)在后續(xù)記錄）

用法：

// 基本方法定義一個(gè)類
class Point{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
 
    toString(){
        return '( '+ this.x +','+ this.y +')';
    }
}
 
var point = new Point(2,3)
point.toString(); // (2,3)
 
 
// 表達(dá)式的方法定義一個(gè)類
let person = new class {
  constructor(name) {
    this.name = name;
  }
 
  sayName() {
    console.log(this.name);
  }
}('張三');
 
person.sayName(); // "張三"

3，import

用法：

使用export命令定義了模塊的對(duì)外接口以后，其他 JS 文件就可以通過import命令加載這個(gè)模塊。

// main.js
import { firstName, lastName, year } from './profile.js';
 
function setName(element) {
  element.textContent = firstName + ' ' + lastName;
}

上面代碼的import命令，用于加載profile.js文件，并從中輸入變量。import命令接受一對(duì)大括號(hào)，里面指定要從其他模塊導(dǎo)入的變量名。大括號(hào)里面的變量名，必須與被導(dǎo)入模塊（profile.js）對(duì)外接口的名稱相同。如果想為輸入的變量重新取一個(gè)名字，import命令要使用as關(guān)鍵字，將輸入的變量重命名。

import { lastName as surname } from './profile.js';

讀到這里，這篇“es6新增的聲明方法怎么用”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會(huì)，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注億速云行業(yè)資訊頻道。