聲明與表達(dá)式
let? :作用域在塊里面
var 全局 注意 函數(shù)有自己的作用域
const 常量 常量的值 是不能被更改的 可以使用const 來(lái)做預(yù)定義 處理 應(yīng)用場(chǎng)景
? ? 1.私有協(xié)議 即時(shí)通訊 與硬件通訊
2.預(yù)定義數(shù)據(jù)值 網(wǎng)絡(luò)接口
解構(gòu)賦值
定義 解構(gòu)賦值是對(duì)賦值運(yùn)算符的擴(kuò)展。
他是一種針對(duì)數(shù)組或者對(duì)象進(jìn)行模式匹配,然后對(duì)其中的變量進(jìn)行賦值。在代碼書寫上簡(jiǎn)潔且易讀,語(yǔ)義更加清晰明了;也方便了復(fù)雜對(duì)象中數(shù)據(jù)字段獲取
數(shù)組格式的解構(gòu)賦值
基本
let [a,b] = [2,3]; let [username,age] = ["小明",2] 可嵌套 let [username,[boy,girl],age] = ["小明",["小貓","小花"],12]; 可省略 ? /*? ? * 可以省略部分變量名? ? * */? ? let [a,,,b] = [1,3,5,6];? ? console.log(a)? ? console.log(b)
不完全解構(gòu)
如果有變量 不需要初始化值 就可以使用不完全解構(gòu)
let [view = document.createElement("div"),timer] = []; 剩余運(yùn)算符 var [timer,...views] = [0,[document.createElement("div"),document.createElement("div")]]? ? console.log(views[0][0]); 字符串 let [a, b, c, d, e] = 'hello';// a = 'h'// b = 'e'// c = 'l'// d = 'l'// e = 'o' 對(duì)象模型的解構(gòu)(Object) 基本 let { foo, bar } = { foo: "哈哈哈", bar: 'bbb' };? ? console.log(foo,bar); 可嵌套 {? ? ? ? let {a:[b,c]} = {a:[22,33]}? ? ? ? console.log(b)? ? ? ? console.log(c)? ? ? ? let {key:[name1,name2]} = {key:["屬性1的值","屬性2的值"]}? ? ? ? console.log(name1)? ? ? ? console.log(name2)? ? ? ? let {? ? ? ? ? ? listener:[? ? ? ? ? ? ? ? click,? ? ? ? ? ? ? ? dlclick,? ? ? ? ? ? ? ? tapstart? ? ? ? ? ? ],? ? ? ? ? ? event:[ce,de,te]? ? ? ? } = {? ? ? ? ? ? listener:[? ? ? ? ? ? ? ? function () {? ? ? ? ? ? ? ? ? ? console.log("click")? ? ? ? ? ? ? ? },? ? ? ? ? ? ? ? function () {? ? ? ? ? ? ? ? ? ? console.log("dlclick")? ? ? ? ? ? ? ? }? ? ? ? ? ? ],? ? ? ? ? ? event:[{name:"點(diǎn)擊"},{name:"雙擊"}]? ? ? ? }? ? ? ? click();? ? ? ? console.log(ce)? ? ? ? /*? ? ? ? * 定義接口文件 http? ? ? ? *? ? ? ? * 主機(jī)地址 host:"api.bianmazhe.com"? ? ? ? * 測(cè)試環(huán)境 evn:true? ? ? ? * api:? ? ? ? *? login:"/login"? ? ? ? *? register:"/register"? ? ? ? * */? ? ? ? let {http:[host,evn,api]} = {? ? ? ? ? ? http:["api.bianmazhe.com",false,{login:"/login",register:"/register"}]? ? ? ? }? ? ? ? console.log(api.login)? ? ? ? let {http:[host1,evn1,[login,register]]} = {? ? ? ? ? ? http:["api.bianmazhe.com",false,["/login","/register"]]? ? ? ? }? ? ? ? console.log(login);? ? } 可省略 let {key:[]} = {key:[2,3]}? ? ? ? let {key:[]} = {key:[2,3],key2:"dfk"}? ? ? ? let {} = {key:[2,3]} 不完全解構(gòu) let obj = {p: [{y: 'world'}] };let {p: [{ y }, x ] } = obj;// x = undefined// y = 'world' 剩余運(yùn)算符 let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};// a = 10// b = 20// rest = {c: 30, d: 40} Symbol 用于定義一個(gè)獨(dú)一無(wú)二的屬性 通過(guò)Symbol創(chuàng)建出來(lái)的兩個(gè)屬性是不相同的 ? ? let n1 = Symbol(2);? ? let n2 = Symbol(2);? ? console.log(n1 === n2); 數(shù)據(jù)類型 string 模板字符串 `` 允許換行 ? ? var container = document.querySelector(".container");? ? container.innerHTML? = `? ? <div>? ? ? ? <ul>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? </ul>? ? </div>? ? `; 支持嵌入變量 ? ? var item = "標(biāo)題";? ? var container = document.querySelector(".container");? ? container.innerHTML? = `? ? <div>? ? ? ? <ul>? ? ? ? ? ? <li>${item}</li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? ? ? <li></li>? ? ? ? </ul>? ? </div>? ? `; 新增方法 includes():返回布爾值,判斷是否找到參數(shù)字符串。 startsWith():返回布爾值,判斷參數(shù)字符串是否在原字符串的頭部。 endsWith():返回布爾值,判斷參數(shù)字符串是否在原字符串的尾部。 字符串重復(fù) repeat console.log("Hello,".repeat(2));? // "Hello,Hello," 字符串補(bǔ)全 padStart padEnd console.log("h".padStart(5,"o"));? // "ooooh"console.log("h".padEnd(5,"o"));? ? // "hoooo"console.log("h".padStart(5));? ? ? // "? ? h" array 創(chuàng)建數(shù)組 Array.of() Array.from() 查找符合的元素 find ? ? var arr = [33,4,2,99];? ? var v = arr.find(function (item) {? ? ? ? return item<10;? ? });? ? console.log(v); 查找符合元素的下標(biāo) findIndex() ? ? var index = arr.findIndex(function (item) {? ? ? ? return item < 10;? ? })? ? console.log(index); 填充 fill(要填充的值,填充的位置,可選(填充結(jié)束的位置))? 返回一個(gè)填充好的數(shù)組 let arr = Array.of(1, 2, 3, 4);// 參數(shù)1:用來(lái)填充的值// 參數(shù)2:被填充的起始索引// 參數(shù)3(可選):被填充的結(jié)束索引,默認(rèn)為數(shù)組末尾console.log(arr.fill(0,1,2)); // [1, 0, 3, 4] 嵌套數(shù)組(多維)轉(zhuǎn)一維數(shù)組 flat ? ? var arr5 = [[[[1,4,5]],[55,77]],[3,9]]? ? //Infinity 無(wú)窮數(shù)? ? var arr6 = arr5.flat(Infinity);? ? console.log(arr6); 合并數(shù)組 ? ? var arr7 = [3,4,88];? ? console.log([1,...arr7]); set 類似數(shù)組 set里面的數(shù)據(jù) 都是唯一的 初始化 new Set() 存取值 存值 add(); 數(shù)組去重 ? ? var arr7 = [77,55,77,99,55];? ? var set2 = new Set(arr7);? ? console.log(set2); map 類似Object 一個(gè) Object 的鍵只能是字符串或者 Symbols,但一個(gè) Map 的鍵可以是任意值。 Map 中的鍵值是有序的(FIFO 原則),而添加到對(duì)象中的鍵則不是。 Map 的鍵值對(duì)個(gè)數(shù)可以從 size 屬性獲取,而 Object 的鍵值對(duì)個(gè)數(shù)只能手動(dòng)計(jì)算。? ?