es6基础(1)
es6 的类型
数据类型
symbol 类型
// symbol 数据类型 是基本数据类型是又一个 symbol 函数产生的
const s1 = Symbol()
const s2 = Symbol()
//sumbol 每次产生的值都是唯一的 即使每次传入的数据是一样的 产生的值看起来也是一样的 但是是不一样的 在===的时候为false
console.log(s1 === s2) //false
const s3 = Symbol('hahaha')
const s4 = Symbol('hahaha')
console.log(s3 === s4) //false
//使用的地方 作为 属性私有化 数据保护
class Persion {
constructor(name, gender) {
this.name = name
this.gender = gender
}
}
const p1 = new Persion('momo', 'man')
console.log(p1)
//这个人的有些属性是可以变的 有些属性是不可以变的 如性别 一直保存到down 也就是收保护的私有属性 类似于java 中的private
class Persion {
constructor(name, gender) {
const _gender = Symbol('gender')
this.name = name
this[_gender] = gender
}
}
const p2 = new Persion('nana', 'man')
console.log(p2)
//但是要注意 这个私有属性不可比较 他和任何值都不同
//Persion {name: "nana", Symbol(gender): "man"}
//name: "nana"
//Symbol(gender): "man"
//这个属性外部是不可以调用的 ,只能在内部调用和使用
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
es6 的 变量声明 var let const
es6 的作用域,全局作用域 --- 非函数 函数作用域 函数包含的 快级作用域 一个大括号
var 是不支持块作用域支持变量与解析 ,而 let 和 const 是支持快级作用域的,现在用 let 和 const 替代 var
let const 不润许重复声明 let 声明的变量后面可以被更改值 const 声明的是常量是不可以被再次更改的。 const 定义的是不可以被更改内存地址 但是可以被改动 例如数组可以被 push 如果不想对象的值被改变 可以使用 freeze 冻结 const arr1 = Object.freeze([1,2,3]) 这个时候就不可以被扩展了 冻结对象只能冻结一层 也就是说如果数组中还有数组那么内部数组是可以被修改的
变量的解构赋值,可以用于数组和对象
let arr =[1,2,3]
let[a,b,c]=arr //数组里面的值会意义对应的赋值到abc 上
#数据的解构是一一对应的
#对象的解构赋值
let{bar , foo} = {foo:"aaa",bar:"hahaha"}
# 如果变量名是一样的 这个时候的顺序是无关的 否则必须按照原来的顺序
变量的而别名
let{bar :b,foo:f}={foo:"aaa",bar:"hahaha"}
多重解构
let{foo:[a,b]}={foo:[10,20]}
let {left:l,top:t,right:r,bottom:b}=document.getElementByID('haha')
2
3
4
5
6
7
8
9
10
11
扩展运算符 就是 ... 就是把数组或者对象转换成参数序列
const arr = [123, 2, 1, 4, 2, 5]
const arr1 = [111, 23, 42, 1, ...arr] //合并
console.log(Math.max(...[arr1])) //省去遍历
//对象的序列化
let obj1 = { a: 1, n: 2 }
let obj2 = { c: 1, d: 2 }
let obj3 = { ...obj1, ...obj2 }
2
3
4
5
6
7
字符串的扩展
uincode
console.log('u4e20')//这个可以输出 #通过{} 把超长的unicode 变成一个 比如 表情包 console.log('u{1f602}')
1
2
3
4模板字符串
#保持字符内容可以写空格 和换行 还可以引入变量表达式解析用${} #在两个反引号中间 let in = 1 `asdasfsadfa${in} asd ` 可以写 函数调用 变量名 变量 数据 不支持语句
1
2
3
4
5
6
7
数值扩展
以前的浏览器只支持 8 进制和 10 进制的 现在浏览器支持的更多了 又 2 8 10 16
对象扩展
对象的简写表示法当对象的 key 对象的 value 的变量相同的时候 可以只写一个 动态对象的 key
const x='kakaka'
var obje1 = {
[x]:1
}
2
3
4
这个时候 x 是一个变量 只要他是一个字符串就可以做为 KEY 也就是动态 KEY
迭代
for in 以原始插入的顺序迭代对象的可枚举属性 迭代出来的是 KEY,可以迭代对象
for await of 迭代异步操作
for of 根绝迭代对象的迭代器具体实现迭代对象的数据 迭代出来的是每一项的数据,只能迭代可迭代不能迭代对象类型 迭代器生成方法
obj1[Symbol.iterator] = function() {
let keys = Object.keys(obj1)
let len = keys.length
let n = 0
return {
next: function() {
if (n < len) {
return {
value: keys[n++], //{k:keys[n],v:obj1[n++]}
done: false //false 会继续迭代
}
} else {
return {
done: true
}
}
}
}
}
for (const { k, v } of obj1) {
}
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
函数拓展
函数默认值的处理可以通过参数值传递过程直接定义
function fn2(x=0,y=0){
1 这样就可以了 如果不传递就是0,
2 如果形参中不是所有的参数都有默认值,那么有默认值的通常写在形参的后面
}
2
3
4
函数的剩余参数
function arrayPush(arr,...newData){
第一个参数赋值给了arr
从第二个参数开始后面所有的参数都赋值给了newData
而newData 是一个数组,要放在最后面,所有后面的参数都会被他接受到
}
2
3
4
5
箭头函数(参数列表)=>{函数体}
```javascript
let fn1 =()=>{console.log('111')} #箭头函数的命名和赋值
如果这个函数只有一个参数 可不用写小括号,如果只有一行代码且俄日返回值 可以省略大括号
let fn2 = ctx=>{console.log(ctx.request.params.name)}
let fn3 =ctx=>ctx.request.params.name
如果返回值是一个对象 用大括号定义的 这个时候大括号不能省略
```
函数中的 this 指向 问题
一般函数的 this 指向是在函数的执行器绑定的 确定的 也就是谁调用的 this 指向谁,自己调用的指向 window,如果绑定在事件上就指向触发该事件的对象。
而箭头函数的 this 对象在函数的创建期间就已经绑定好了,也就是说在函数的声明处就已经执行名,箭头函数的 this 指向了创见该函数的作用域。也就是说箭头函数所在的作用的 this 指向谁 那么箭头函数的额作用域就指向谁。箭头函数的指向不会改变。
要在箭头函数的声明处!!
一般事件函数不会绑定箭头函数。
箭头函数不能作为构造函数,不能作为 new,没有 arguments,不能作为生成器函数。