日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

ES6相关特性的整理(变量数据结构)

發(fā)布時(shí)間:2025/3/18 编程问答 16 豆豆
生活随笔 收集整理的這篇文章主要介紹了 ES6相关特性的整理(变量数据结构) 小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

? 早前,讀了阮一峰大神的ES6 入門,想著還是要輸出一些東西,決定寫下來,博客寫得不多,但還是想記錄一下,也當(dāng)是以后給自己看啦。

變量

1. let

? let存在兩個(gè)主要特點(diǎn),分別是:不存在變量提升和暫時(shí)性死區(qū)(如果區(qū)塊中存在let或者const,這個(gè)區(qū)塊從一開始就形成了封閉作用域。凡是在聲明之前使用這些變量,就會(huì)報(bào)錯(cuò))
? 例子:

var temp = 123;if (true) {temp = 'abc'; // Refernce Errorlet temp;} 復(fù)制代碼

在上述例子中,if語(yǔ)句所在的代碼塊中因?yàn)閘et的存在,形成一個(gè)暫時(shí)性死區(qū),因此temp=‘a(chǎn)bc’無法對(duì)外面的temp進(jìn)行賦值,與外界變量無關(guān)。temp還是一個(gè)未聲明的變量。因此會(huì)報(bào)錯(cuò)。

? 同時(shí),let不允許在相同作用域內(nèi)重復(fù)聲明。
? 例子:

function func(){let a = 10;var a = 10;} 復(fù)制代碼

在上述例子中,func函數(shù)中對(duì)a進(jìn)行了重復(fù)聲明,會(huì)報(bào)錯(cuò)。

? 最后,let所在的代碼塊會(huì)形成一個(gè)塊級(jí)作用域。 ? 例子

function func(){let n = 5;if(true) {let n = 10;}console.log(n) //5} 復(fù)制代碼

因?yàn)樵趇f所在的代碼塊中形成了塊級(jí)作用域,所以js引擎在查找n的值時(shí),只會(huì)沿作用域鏈向上查找,而不會(huì)向下查找。因此n的值為5而不是10。

2. const

使用const聲明變量最大的特點(diǎn)就是聲明的變量不得改變值,一旦聲明,必須初始化。這里所說的“不得改變”本質(zhì)上是指變量指向的內(nèi)存地址不得改動(dòng)。
但是,復(fù)合型數(shù)據(jù)(對(duì)象和數(shù)組),它們指向的內(nèi)存地址保存的是一個(gè)指針,只能保證指針是不變的。

const foo = {};foo.prop = 123; //成功foo = {}; //報(bào)錯(cuò) 復(fù)制代碼

在上述例子中,變量foo是一個(gè)對(duì)象,因此內(nèi)存中所保存的是該變量的地址,只要保證地址不變即可。所以對(duì)foo的屬性賦值是可以成功的,因?yàn)闆]有改動(dòng)foo變量本身的地址。

** 需要注意的是,let、const、class命令聲明的全局變量都不屬于頂層對(duì)象的屬性。

3. 變量的結(jié)構(gòu)賦值

變量的架構(gòu)賦值主要是針對(duì)對(duì)象和數(shù)組,以key為查找對(duì)象,沒有查找到的為undefined。
例子:

let [x, y, z] = [1, 2, 3];let [head, ...tail] = [1, 2, 3] // head = 1, tail = [2, 3]let [a, b, c, d, e] = 'hello' //a = 'h', b = 'e', c = 'l', d = 'l', e = 'o'let {foo, bar} = {foo: 'a', bar: 'b'} //foo = 'a', bar = 'b'let {foo: baz, bar: last} = {foo: 'a'} //baz = 'a', last = undefined 復(fù)制代碼

主要的應(yīng)用場(chǎng)景有:
? 1. 交換變量的值:

let x = 1;let y = 2;[x, y] = [y, x]; //x = 2, y = 1 復(fù)制代碼

? 2. 從函數(shù)返回多個(gè)值時(shí),取值方便

let example = () => [1, 2, 3];let [a, b, c] = example(); // a = 1, b = 2, c = 3 復(fù)制代碼

? 3. 提取JSON數(shù)據(jù)

let jsonData = {id: 42, status: 'ok'};let {id, status: number} = jsonData; // id = 42, number = 'ok' 復(fù)制代碼

數(shù)據(jù)類型

Symbol

es6中新增的一種數(shù)據(jù)類型,表示絕不重復(fù)的值。 例子:

let s1 = Symbol(33);let s2 = Symbol(33);console.log(s1 == s2) //falselet s3 = 2;let s4 = 2;console.log(s3 == s4) //true 復(fù)制代碼

從例子中可以看到,s1與s2并不相等。 應(yīng)用場(chǎng)景:使用一個(gè)他人提供的對(duì)象時(shí),但又想為這個(gè)對(duì)象添加新方法,新方法可能與現(xiàn)有方法沖突,可以使用Symbol,保證不會(huì)與其它屬性沖突。

數(shù)據(jù)結(jié)構(gòu)

es6中針對(duì)數(shù)組和對(duì)象分別新增了不同的數(shù)據(jù)結(jié)構(gòu)。這里我只粗略介紹一下特點(diǎn)和應(yīng)用場(chǎng)景。

1. Set

新的數(shù)據(jù)結(jié)構(gòu),類似于數(shù)組,但set里的值是不會(huì)重復(fù)的。
應(yīng)用場(chǎng)景:數(shù)組去重( array = [ ... new Set( array )] )

2. WeakSet

成員只能是對(duì)象,同時(shí)垃圾回收機(jī)制不考慮weakSet中對(duì)對(duì)象的引用。

3. Map

本質(zhì)與對(duì)象一樣,但key可以是各種類型的值(包括對(duì)象),而對(duì)象中的key是字符串。

4. WeakMap

只接受對(duì)象作為鍵名,同時(shí)鍵名所指向的對(duì)象不計(jì)入垃圾回收機(jī)制。 應(yīng)用場(chǎng)景:想要給某個(gè)DOM元素添加數(shù)據(jù)時(shí),可以使用WeakMap。這樣可以避免在刪除該DOM元素后還保存著對(duì)它的引用,無法回收內(nèi)存。

總結(jié)

以上是生活随笔為你收集整理的ES6相关特性的整理(变量数据结构)的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。