国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

ES6的理解

silvertheo / 983人閱讀

摘要:自年推出已過了三年現(xiàn)已成熟使用。最近在看深入理解這本書結(jié)合日常的使用系統(tǒng)梳理一下想到哪寫到哪后續(xù)一直添加一塊級作用域的出現(xiàn)以及變量定義的改變塊級作用域大括號包裹的部分形成的局部作用域。二模塊的導(dǎo)出與導(dǎo)入引入模塊是為了解決作用域問題。

ES6自2015年推出已過了三年,現(xiàn)已成熟使用。比如,const和let定義、箭頭函數(shù)、模塊的導(dǎo)入和導(dǎo)出等,已經(jīng)出現(xiàn)在我們?nèi)粘5氖褂弥?,可以說并不陌生,但就系統(tǒng)的學(xué)習(xí)一直沒開始。

最近在看《深入理解ES6》這本書,結(jié)合日常的使用,系統(tǒng)梳理一下(想到哪寫到哪,后續(xù)一直添加).

一.塊級作用域的出現(xiàn)以及變量定義的改變

塊級作用域:大括號包裹的部分形成的局部作用域。

ES6之前,JavaScript只有兩種作用域--全局作用域和局部作用域(函數(shù)作用域),大括號并非作用域的界定符,而且具有變量提升的機制.

ES6推出后,界定了塊狀作用域,let和const定義也消除了變量提升.

ES6之前,變量在程序退出后或者函數(shù)執(zhí)行完銷毀變量;ES6后,程序執(zhí)行到塊級作用域外即銷毀變量.

let代替var用于定義變量,重復(fù)定義時會報錯.
const用于定義常量,且必須初始化,一旦設(shè)定后不可更改,否則會報錯.

書中推薦的最佳實踐:默認使用const定義,只在需要改變的變量中使用let定義。

日常使用的感覺是定義變量變得簡潔、高效,不需要擔心變量重名和冗余了。

二.模塊的導(dǎo)出與導(dǎo)入

ES6引入模塊是為了解決作用域問題。

之前的腳本形式,定義的作用域都是全局作用域;現(xiàn)在的模塊形式,定義的是當前模塊的的作用域,將模塊作用域和全局作用域區(qū)分出來,讓日益復(fù)雜的前端工程變得容易維護.

export作為導(dǎo)出符,可以導(dǎo)出變量、函數(shù)、類等。

導(dǎo)出的方式包括導(dǎo)出聲名(export var a=5;)、導(dǎo)出引用(var a=5; export a;)、導(dǎo)出重命名(export a as aaa)、還可以默認導(dǎo)出(export default)

import作為導(dǎo)入符,可以單個導(dǎo)入(import { a } from "/example.js"),多個導(dǎo)入(import { a,b } from "/example.js")、導(dǎo)入整個模塊(不常用)、導(dǎo)入時重命名、默認值導(dǎo)入(import a
from ‘example.js’)

默認導(dǎo)入是ES6創(chuàng)建者推崇的導(dǎo)入方法,具有語法純凈、簡潔的特點。

3.對象的擴展

JavaScript中的每一個值都是某種特定的對象,提升對象的功能和效率,對日益復(fù)雜的程序應(yīng)用至關(guān)重要。

創(chuàng)建對象最流行和高效的方法是對象字面量,可以完成對象的建立、變更、刪除:

var a = {//創(chuàng)建
    a1: 11,
    a2: 22
}
a.a2 = 222;//變更
a.a3 = 33;
delete a.a3;//刪除對象屬性

其中ES6做出支持了可計算屬性名

var a = {
    a1: 11,
    [newName]: 22//[]表示可計算部分,相當于屬性訪問的方括號訪問法
}

ES6還對對象的使用做出了簡化,例如vue中的使用:

①  components:{
        compA,//原寫法compA: compA(無需重命名時)
        compB
    }
②  computed: {
        dataFlag(){//ES6簡化寫法
            return this.dataF;
        },
        dataFlag1: function(){
            return this.dataF;
        }
    }

ES6還新增了Object.is()和Object.assign()方法:

Object.is()是全等判定,相對==和===功能更強大
==會進行類型強制轉(zhuǎn)換,===對+0和-0以及NAN無作用

console.log(+0===-0)//true
console.log(Object.is(+0,-0))//false
console.log(NAN===NAN)//false
console.log(Object.is(NAN,NAN))//true
Object.assign()對象的混入,相當于引入了其他對象的方法和屬性。

三、解構(gòu)

解構(gòu)是ES6新增的、關(guān)于對象和數(shù)組的、高效、直觀的訪問途徑。

1、對象的解構(gòu)

objectA = { att1: 12, att2: 34, att3: { att31: 567, att32: 890} }

初始化對象:let { att1,att2 } = objectA;//att1=12,att2=34
重命名:let = {att1: num1, att2: num2} = objectA;//num1=12,num2=34

解構(gòu)賦值:({ att1,att2 } = objectA);//**必須加小括號,賦值表達式的左側(cè)不能為代碼塊**
函數(shù)參數(shù)中賦值:function(){ alert(value)}; function({att1,att2} = objectA);//打印objectA的值

嵌套解構(gòu):let { att3: { att31 } } = objectA;//att31=567

2、數(shù)組解構(gòu)

arryA = [1,2,3,[4,5],{ab: 6,cd: 7}];

數(shù)組解構(gòu)需列出目標解構(gòu)值之前的所有元素

[a,b] = arryA; //a=1,b=2
[,c] = arryA; //c=2
[...arryB] = arryA; //arryB = arryA = [1,2,3,[4,5],{ab: 6,cd: 7}];
[,,,[d]] = arryA; //d=4;
[,,,,{ab}] = arryA //ab=6;

數(shù)組解構(gòu)的小應(yīng)用:①交換兩個變量的值 [a,b] = [b,a]; ②賦值數(shù)組[...arryB] = arryA;

解構(gòu)表達式的右側(cè)不能為null或undefined

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/101349.html

相關(guān)文章

  • ES6-7

    摘要:的翻譯文檔由的維護很多人說,阮老師已經(jīng)有一本關(guān)于的書了入門,覺得看看這本書就足夠了。前端的異步解決方案之和異步編程模式在前端開發(fā)過程中,顯得越來越重要。為了讓編程更美好,我們就需要引入來降低異步編程的復(fù)雜性。 JavaScript Promise 迷你書(中文版) 超詳細介紹promise的gitbook,看完再不會promise...... 本書的目的是以目前還在制定中的ECMASc...

    mudiyouyou 評論0 收藏0
  • 《深入理解ES6》筆記——導(dǎo)讀

    摘要:最近買了深入理解的書籍來看,為什么學(xué)習(xí)這么久還要買這本書呢主要是看到核心團隊成員及的創(chuàng)造者為本書做了序,作為一個粉絲,還是挺看好這本書能給我?guī)硪粋€新的升華,而且本書的作者也非常厲害。 使用ES6開發(fā)已經(jīng)有1年多了,以前看的是阮一峰老師的ES6教程,也看過MDN文檔的ES6語法介紹。 最近買了《深入理解ES6》的書籍來看,為什么學(xué)習(xí)ES6這么久還要買這本書呢?主要是看到Daniel A...

    Godtoy 評論0 收藏0
  • 【資源集合】 ES6 元編程(Proxy & Reflect & Symbol)

    摘要:理解元編程和是屬于元編程范疇的,能介入的對象底層操作進行的過程中,并加以影響。元編程中的元的概念可以理解為程序本身。中,便是兩個可以用來進行元編程的特性。在之后,標準引入了,從而提供比較完善的元編程能力。 導(dǎo)讀 幾年前 ES6 剛出來的時候接觸過 元編程(Metaprogramming)的概念,不過當時還沒有深究。今天在應(yīng)用和學(xué)習(xí)中不斷接觸到這概念,比如 mobx 5 中就用到了 Pr...

    aikin 評論0 收藏0
  • Understanding ES6 -- 深入理解ES6書籍

    摘要:塊級綁定拓展對象功能解構(gòu)改進的數(shù)組代理和反射附錄小的改變附錄 understanding es6 -- Nicholas C. Zakas 塊級綁定 function 拓展對象功能 解構(gòu) symbol Sets and Maps Iterators and Generators class 改進的數(shù)組 promise 代理和反射 -- Proxy&Reflection mo...

    PAMPANG 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<