运算符
...扩展运算符能将数组转换为逗号分隔的参数序列
声明一个数组
const tfboys=['易烊千玺','王源','王俊凯'];
//声明一个函数
function action(){
console.log(arguments)
}
action(tfboys)
是一个数组元素,arguments里只有一个元素
const tfboys=['易烊千玺','王源','王俊凯'];
//声明一个函数
function action(){
console.log(arguments)
}
action(...tfboys)
Symbol基本使用
ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript语言的第七种数据类型,是一种类似于字符串的数据类型。
创建Symbol对象
- 方式一
//创建symbol
let s1 = Symbol();
console.log(s,typeof s1);
let s2 = Symbol('浅辄')
let s3 = Symbol('浅辄')
console.log(s2==s3)
- 方式二
let s4 = Symbol.for('浅辄')
console.log(s4,typeof s4)
let s4 = Symbol.for('浅辄')
let s5 = Symbol.for('浅辄')
console.log(s4==s5)
Symbol特点
1)Symbol的值是唯一的,用来解决命名冲突的问题
2)Symbol值不能与其他数据进行运算
let result =s +100;
let result =s>100;
let result =s+'100';
3)Symbol定义的对象属性不能使用for...in循环遍历,但是可以使用 Reflect.ownKeys来获取对象的所有键名
Symbol使用
给对象添加独一无二的属性和方法
let game ={
}
//声明一个对象
let methods={
up:Symbol(),
down:Symbol()
}
game[methods.up] = function(){
console.log('向上')
}
game[methods.down] = function(){
console.log('向下')
}
console.log(game);
Symbol内置值
除了定义自己使用的Symbol值以外,ES6还提供了11个内置的Symbol 值!指向语言内部使用的方法。
Symbol.hasInstance |
当其他对象使用instanceof运算符,判断是否为该对象的实例时,会调用这个方法 |
Symbol.isConcatSpreadable |
对象的Symbol.isConcatSpreadable属性等于的是一个布尔值,表示该对象用于Array..prototype.concat)时,是否可以展开。 |
Symbol.unscopables |
该对象指定了使用with关键字时,哪些属性会被with环境排除。 |
Symbol.match |
当执行str.match(myObject)时,如果该属性存在,会调用它,返回该方法的返回值。 |
Symbol.replace |
当该对象被str.replace(myObject)方法调用时,会返回该方法的返回值。 |
Symbol.split |
当该对象被str.split(myObject)方法调用时,会返回该方法的返回值。 |
Symbol.iterator |
对象进行for...of循环时,会调用Symbol...iterator方法,返回该对象的默认遍历器 |
Symbol.toPrimitive |
该对象被转为原始类型的值时,会调用这个方法,返回该对象对应的原始类型值。 |
Symbol.toStringTag |
在该对象上面调用toString方法时,返回该方法的返回值 |
Symbol.species |
创建衍生对象时,会使用该属性 |
例子
class Person{
static[Symbol.hasInstance](param){
console.log(param)
console.log('用来检测')
return false;
}
}
let o = {}
console.log(o instanceof Person);
const arr1=[1,2,3]
const arr2=[4,5,6]
arr2[Symbol.isConcatSpreadable] = false
console.log(arr1.concat(arr2))
迭代器
迭代器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口!就可以完成遍历操作。
- ES6创造了一种新的遍历命令for...of循环,Iterator接口主要供for.of消费
- 原生具备iterator接口的数据(可用for of遍历)
- Array
- Arguments
- Set
- Map
- String
- TypedArray
- NodeList
- 工作原理
- 创建一个指针对象,指向当前数据结构的起始位置
- 第一次调用对象的next方法,指针自动指向数据结构的第一个成员
- 接下来不断调用next方法,指针一直往后移动,直到指向最后一个成员
- 每调用next方法返回一个包含value和done属性的对象
使用for
//声明一个数组
const xiyou=['玄奘','悟空','悟能','悟净']
//使用for...of遍历
for(let v of xiyou){
console.log(v);
}
//声明一个数组
const xiyou=['玄奘','悟空','悟能','悟净']
//使用for...of遍历
for(let v in xiyou){
console.log(v);
}
of循环是得到变量的值,in循环是得到索引
使用迭代器
const xiyou=['玄奘','悟空','悟能','悟净']
let iterator = xiyou[Symbol.iterator]()
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
console.log(iterator.next())
自定义遍历数据
const cl = {
name: '高一八班',
stu: ['小明', '小红', '小亮', '小强'],
[Symbol.iterator]() {
//索引变量
let index = 0;
//
let _this = this;
return {
next: function() {
if (index < _this.stu.length) {
const result = {
value: _this.stu[index],
done: false
};
//下表自增
index++;
return result;
}else{
return {value:undefined,done:true}
}
}
};
}
}
//遍历对象 for of
for (let v of cl) {
console.log(v)
}
如果单纯的使用for遍历对象里的元素会报错
//遍历对象 for of
for (let v of cl) {
console.log(v)
}
// 迭代器.html:21
//Uncaught SyntaxError: Unexpected token 'class' (at 迭代器.html:21:10)
</script>
也就是说,如果我们想自定义遍历某些元素,就要满足他的工作原理,根据他的工作原理来写代码
生成器
定义使用
生成器数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同
//yield 函数代码的分隔符
function * gen(){
// console.log("hello generator")
console.log(111)
yield '两只老虎';
console.log(222)
yield '爱跳舞';
console.log(333)
}
let iterator = gen();
iterator.next();
iterator.next();
iterator.next();
iterator.next();
通过next方法来控制代码的执行
function * gen(){
// console.log("hello generator")
console.log(111)
yield '两只老虎';
console.log(222)
yield '爱跳舞';
console.log(333)
}
for (let v of gen()){
console.log(v)
}
函数参数
生成器可以传参数
可以构造器传参也可以next方法传参
function * gen(arg){
console.log(arg)
let one = yield 111;
console.log(one)
yield 222;
yield 333;
}
let iterator = gen('aaa');
console.log(iterator.next())
//next 方法可以传入实参
console.log(iterator.next('BBB'))