成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

前端基礎(chǔ)_ES6

wuyangnju / 2302人閱讀

摘要：聲明三大關(guān)鍵字聲明變量語(yǔ)法語(yǔ)法聲明常量語(yǔ)法聲明變量特性支持函數(shù)作用域支持預(yù)解析所謂變量提升支持重復(fù)聲明同域同名變量函數(shù)作用域局部作用域預(yù)解析重復(fù)聲明聲明變量推薦特性支持塊作用域不支持預(yù)解析不支持重復(fù)聲明同域同名變量塊作用域局部作用域不支持預(yù)

聲明

三大關(guān)鍵字

聲明變量：
 var （ES5語(yǔ)法） 
 let （ES6語(yǔ)法）

聲明常量：
 const  (ES6語(yǔ)法)

var 聲明變量

特性
1、支持 函數(shù)作用域
2、支持 JS預(yù)解析  （所謂變量提升）
3、支持 重復(fù)聲明  （同域同名變量）
1、函數(shù)作用域（局部作用域）
function show(){
    var a = "34";
}
console.log(a);      //underfind

2、JS預(yù)解析
console.log(name);   //underfind
var name = "1234";

3、重復(fù)聲明
var a = "123";
var a = "4565";

let 聲明變量 （推薦）

特性
1、支持 塊作用域
2、不支持 JS預(yù)解析
3、不支持 重復(fù)聲明  （同域同名變量）
1、塊作用域（局部作用域）
if(true){
    var a = "34";
}
console.log(a);      //underfind

2、不支持JS預(yù)解析
必須聲明后才能使用，否則報(bào)錯(cuò)

const 聲明常量

從ES6開(kāi)始引入常量概念
特性
1、let所有特性
2、聲明時(shí)必須賦值，否則報(bào)錯(cuò)
3、定義常量后，再也不能更改值

1、聲明時(shí)必須賦值，否則報(bào)錯(cuò)
const a;  //報(bào)錯(cuò)
const a = 11;   //正確

2、定義常量后，基本類型是不能改了，但如果是對(duì)象或數(shù)組，是可以改對(duì)象內(nèi)或數(shù)組內(nèi)的值
const a = ["22","bb"];
a[0] = "你好";  //["你好","bb"];

只聲明，不賦值

var a;  //undefined 
let b;  //undefined

JS預(yù)解析

解構(gòu)賦值

應(yīng)用場(chǎng)景

對(duì)象 與 數(shù)組

ES5 做法

var obj = {
    name:"bbb",
    age:12
};
var name = obj.name;
var age = obj.age;

var arr = [123,"wtao"];
var a = arr[0];
var b = arr[1];

ES6 做法

let obj = {
    name:"bbb",
    age:12
};
let {name,age} = obj;
console.log(name);
console.log(age);

let arr = [123,"wtaddo"];
let [name,age] = arr;
console.log(name);
console.log(age);
函數(shù)

默認(rèn)值

剩余值

箭頭函數(shù)

模塊化

注意事項(xiàng)

1、在一個(gè)項(xiàng)目里，多個(gè)不同模塊導(dǎo)入（依賴）某個(gè)相同模塊時(shí)，該模塊只會(huì)加載并執(zhí)行一次，
2、在同一個(gè)模塊中，多次導(dǎo)入相同模塊，只會(huì)加載并執(zhí)行一次
3、在模塊中，無(wú)論import（導(dǎo)入語(yǔ)句）寫(xiě)在哪個(gè)位置，執(zhí)行時(shí)都會(huì)提前
4、模塊有模塊作用域

導(dǎo)入語(yǔ)法

import defaultExport from "module-name";
import * as name from "module-name";
import { export } from "module-name";
import { export as alias } from "module-name";
import { export1 , export2 } from "module-name";
import { foo , bar } from "module-name/path/to/specific/un-exported/file";
import { export1 , export2 as alias2 , [...] } from "module-name";
import defaultExport, { export [ , [...] ] } from "module-name";
import defaultExport, * as name from "module-name";
import "module-name";

導(dǎo)出語(yǔ)法

export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var, const
export let name1 = …, name2 = …, …, nameN; // also var, const
export function FunctionName(){...}
export class ClassName {...}

export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };

export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;
export { default } from …;

異步加載延遲執(zhí)行

defer



在所有html DOM結(jié)構(gòu)渲染完成和其他腳步執(zhí)行完成再執(zhí)行js代碼

html導(dǎo)入js模塊

1、導(dǎo)入普通js文件

type="application/javascript"
默認(rèn)省略
默認(rèn)同步加載

2、導(dǎo)入模塊js文件

type="module"
默認(rèn)異步加載（defer）

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/100939.html

相關(guān)文章

  • 前端培訓(xùn)-初級(jí)階段（13） - 類、模塊、繼承

    摘要：前端培訓(xùn)初級(jí)階段語(yǔ)法變量值類型運(yùn)算符語(yǔ)句前端培訓(xùn)初級(jí)階段內(nèi)置對(duì)象函數(shù)基礎(chǔ)內(nèi)容知識(shí)我們會(huì)用到。模塊定義加載模塊繼承中的繼承依賴于原型鏈繼承。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門(mén)技術(shù)就算入門(mén)，但也僅僅是入門(mén)，現(xiàn)在前端開(kāi)發(fā)的定義已經(jīng)遠(yuǎn)遠(yuǎn)不止這些。前端小課堂（HTML/CSS/JS），本著提升技術(shù)水平，打牢基礎(chǔ)知識(shí)的中心思想，我們開(kāi)課啦（每周四）。 該文為前...

    luodongseu 評(píng)論0 收藏0

  • 再和“面向?qū)ο蟆闭剳賽?ài) - 繼承（五）

    摘要：面向?qū)ο罄镒畲蟮奶攸c(diǎn)應(yīng)該就屬繼承了。在第二篇文章里說(shuō)過(guò)原型實(shí)例跟構(gòu)造函數(shù)之間的繼承，并且還講了一道推算題。 通過(guò)上一篇文章想必各位老鐵已經(jīng)熟悉了class了，這篇文章接著介紹繼承。面向?qū)ο罄镒畲蟮奶攸c(diǎn)應(yīng)該就屬繼承了。一個(gè)項(xiàng)目可能需要不斷的迭代、完善、升級(jí)。那每一次的更新你是要重新寫(xiě)呢，還是在原有的基礎(chǔ)上改吧改吧呢？當(dāng)然，不是缺心眼的人肯定都會(huì)在原來(lái)的基礎(chǔ)上改吧改吧，那這個(gè)改吧改吧就需要...

    Airmusic 評(píng)論0 收藏0

  • 【JS基礎(chǔ)】一文看懂前端模塊化規(guī)范

    摘要：參考資料前端模塊化詳解完整版入門(mén)近一萬(wàn)字的語(yǔ)法知識(shí)點(diǎn)補(bǔ)充徹底搞清楚中的和和詳解 前言 前端的模塊化之路經(jīng)歷了漫長(zhǎng)的過(guò)程，想詳細(xì)了解的小伙伴可以看浪里行舟大神寫(xiě)的前端模塊化詳解(完整版)，這里根據(jù)幾位大佬們寫(xiě)的文章，將模塊化規(guī)范部分做了匯總和整理，希望讀完的小伙伴能有些收獲，也希望覺(jué)得有用的小伙伴可以點(diǎn)個(gè)贊，筆芯。 什么是模塊 將一個(gè)復(fù)雜的程序依據(jù)一定的規(guī)則(規(guī)范)封裝成幾個(gè)塊(文件)...

    HelKyle 評(píng)論0 收藏0

  • 前端規(guī)范(ES6BEMOOCSSSMACSS)

    摘要：前端規(guī)范在實(shí)際開(kāi)發(fā)中，由于團(tuán)隊(duì)成員編碼習(xí)慣不一，技術(shù)層次不同，開(kāi)發(fā)前定制并遵循一種代碼規(guī)范能提高代碼質(zhì)量，增加開(kāi)發(fā)效率。是定義了一種的命名規(guī)范，每個(gè)名稱及其組成部分都是存在一定的含義。 前端規(guī)范 在實(shí)際開(kāi)發(fā)中，由于團(tuán)隊(duì)成員編碼習(xí)慣不一，技術(shù)層次不同，開(kāi)發(fā)前定制并遵循一種代碼規(guī)范能提高代碼質(zhì)量，增加開(kāi)發(fā)效率。 Javascript Javascript規(guī)范直接參考airbnb: ES6 ...

    Object 評(píng)論0 收藏0

  • 前端規(guī)范(ES6BEMOOCSSSMACSS)

    摘要：前端規(guī)范在實(shí)際開(kāi)發(fā)中，由于團(tuán)隊(duì)成員編碼習(xí)慣不一，技術(shù)層次不同，開(kāi)發(fā)前定制并遵循一種代碼規(guī)范能提高代碼質(zhì)量，增加開(kāi)發(fā)效率。是定義了一種的命名規(guī)范，每個(gè)名稱及其組成部分都是存在一定的含義。 前端規(guī)范 在實(shí)際開(kāi)發(fā)中，由于團(tuán)隊(duì)成員編碼習(xí)慣不一，技術(shù)層次不同，開(kāi)發(fā)前定制并遵循一種代碼規(guī)范能提高代碼質(zhì)量，增加開(kāi)發(fā)效率。 Javascript Javascript規(guī)范直接參考airbnb: ES6 ...

    willin 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<