2021-03-16ES6第一节课笔记

ES6

声明与表达式

let

作用域在块里面

var

全局

注意 函数有自己的作用域


const

常量

常量的值 是不能被更改的

可以使用const 来做预定义 处理


应用场景

1.私有协议

即时通讯

与硬件通讯

2.预定义数据值

网络接口

解构赋值

定义

解构赋值是对赋值运算符的扩展。

他是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值。

在代码书写上简洁且易读,语义更加清晰明了;也方便了复杂对象中数据字段获取

数组格式的解构赋值

基本

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)

不完全解构

如果有变量 不需要初始化值 就可以使用不完全解构

let [view = document.createElement("div"),timer] = [];

剩余运算符

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'

对象模型的解构(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:"点击"},{name:"双击"}]

}

click();

console.log(ce)

/*

* 定义接口文件 http

*

* 主机地址 host:"api.bianmazhe.com"

* 测试环境 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]}

不完全解构

let obj = {p: [{y: 'world'}] };

let {p: [{ y }, x ] } = obj;

// x = undefined

// y = 'world'

剩余运算符

let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};

// a = 10

// b = 20

// rest = {c: 30, d: 40}

Symbol

用于定义一个独一无二的属性

通过Symbol创建出来的两个属性是不相同的

let n1 = Symbol(2);

let n2 = Symbol(2);

console.log(n1 === n2);


你可能感兴趣的:(2021-03-16ES6第一节课笔记)