前端es6基礎語法

2022-03-30 05:19:37 字數 3555 閱讀 3035

var是宣告全域性的變數,作用域是全域性,const是宣告全域性的常量,不能修改,而let是塊級變數只在當前宣告的作用域中生效:

console.log(a); 

//列印a的值

console.log(b); //

報錯:referenceerror: b is not defined

// 直接列印a的值,檔案中沒有宣告a

console.log(a);// 報錯:uncaught referenceerror: a is not defined

因為**從上往下執行,a並沒有宣告,所以報錯,但var有乙個宣告提前的情況,看下面**:

console.log(a); //

列印undefine

var a = 10;

是不是認為應該會報錯,其實不然,因為var有乙個宣告提前的現象,如果你在呼叫乙個變數時,它在下文有宣告時,他做了這樣乙個事情,相當在你呼叫前宣告了變數名而沒有賦值:

var a           //

等效呼叫前加上該語句

console.log(a); //

列印undefined

var a = 10;

注意,var在函式中宣告的時區域性標量,沒var宣告的全域性變數

function

ff()

ff();

console.log(a);

//a is not defined

function

ff()

ff();

console.log(a);

//1

var 在函式內部宣告時的變數提前:

//

情況1var name = 'kingfan';

function

foo()

//情況2

var name = 'kingfan';

function

foo();

console.log(name)

//列印 kingfan

,var name = 'fan'在函式中宣告的是區域性變數

//注意正常情況下,console.log(name)找的是全域性

//,但是在區域性中又宣告了name,這時呼叫時就不會去找全域性的name

//,而是宣告提前的name=undefined.

而let 宣告的就是區域性變數就不會出現宣告提前的問題:

var pname = 'kingfan';

function

f()

f();

console.log(pname);

var a = 1;

var a =2;

a = 3;

//var 可以對變數重新定義和賦值

let b = 3;

b = 4;

let b = 5; //

報錯:identifier 'b' has already been declared

//let宣告的變數 只能重新賦值,不能重新定義

const c = 5;

c = 6; //

報錯,不能修改

const c = 7 //

報錯不能重新定義

總結:var宣告的變數是可以重新定義和賦值,let宣告的只能重新賦值,const不能重新定義和賦值修改

在es6中新增了模板字串拼接:

var name='kingfan';

var age = 18;

var msg =`我是$,今年$歲`;

console.log(msg)

//列印 我是kingfan,今年18歲

es6允許按照一定的模式,從陣列或物件中提取值,對變數進行賦值,這種方式被稱為解構賦值。

//

解構陣列

var list =[1,2,3,4];

var [a,b,c,d] =list;

console.log(a); //1

console.log(b); //

2 console.log(c); //

3console.log(d); //4//

解構物件

var obj =

//利用key去接收

var =obj;

console.log(name);

//'kingfan'

console.log(age); //

18//

利用其它變數名接收

var =obj;

console.log(pname);

//'kingfan'

console.log(page); //

18

構造物件的方式 使用建構函式來創造。與建構函式唯一的不同是類函式名首字母要大寫。

類的繼承,使用extens關鍵字繼承父類:

class peopel extends animal

//子類可以重構父類的方法

say()

}//例項化new方法

var p =new

peopel();

//呼叫父類的方法

console.log(p.type);

//重構後呼叫自己得say方法

p.say();

箭頭函式有個特點:

如果引數只有乙個,可以省略小括號

如果不寫return,可以不寫大括號

沒有arguments變數

不改變this指向

其中箭頭函式中this指向被固定化,不是因為箭頭函式內部有繫結this的機制。實際原因是箭頭函式根本沒有自己的this,導致內部的this就是外層**塊的this。

可以檢視下面兩段**輸出的區別:

var person =

}person.func()

//person物件

//****************************************

var person =

}person.func()

//window物件

在es6中增加了像python類似的import語法來匯入其他js檔案來使用。例如現在有2個檔案,file1、file2

//

file1

let name='kingfan';

let age = 18;

//要確保其他檔案匯入使用,需要確定你要匯出哪些資料給別人使用

export

//***************************************

//file2

//指定從file1要匯入的資料

import from 'file1'

目前很多瀏覽器不相容此寫法,會報錯。

ES6 基礎語法

1 var vs let const var 可以定義全域性變數,與之不同,let的重要特性就是提供了塊級作用域和不具備變數提公升。const主要用於定義常量,常量顧名思義不是變數,意思就是一經定義,值就無法改變。首先弄明白塊級作用域 es5中有全域性作用域與函式作用域,塊級作用域是es6中的新語法...

ES6基礎語法

let 變數 不具備變數提公升特性 const 常量 引用位址不可改變 在宣告時必須被賦值 let和const都是塊級作用域 只在最靠近的乙個塊中 花括號內 有效 在es6中新增了模板字串拼接 var name kingfan var age 18 var msg 我是 今年 歲 console.l...

es6語法 基礎

let 1.let宣告的變數只能宣告一次,不能被重新定義 2.let定義的變數必須先定義再使用,不能在宣告之前訪問該變數 3.let定義的變數存在塊級作用域,不能被變數提公升,4.let在for迴圈外部不能被使用 所以for迴圈推薦使用let const的作用 定義常量 常量不允許重新賦值 cons...