13518219792
网站建设资讯

NEWS

网站建设资讯

js学习笔记05-ES6内置功能-创新互联

Symbol（标识符）

Symbol 是一种独特的且不可变的数据类型，用来标识对象属性
要创建 Symbol，输入 Symbol()，并添加一个可选的字符串作为其描述

创新互联是专业的涪陵网站建设公司，涪陵接单;提供成都网站设计、成都做网站,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行涪陵网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!
const  obj = Symbol("obj1");
const bowl = {
  [Symbol('banana')]: { color: 'yellow', weight: 183.15 },
  [Symbol('orange')]: { color: 'orange', weight: 170.097 },
  [Symbol('banana')]: { color: 'yellow', weight: 176.845 }
};
console.log(bowl);

可迭代协议

可迭代协议用来定义和自定义对象的迭代行为,灵活地指定循环访问对象中的值的方式.
字符串和数组就是内置的可迭代类型
为了使对象可迭代，它必须实现可迭代接口,接口须包含默认的迭代器方法。该方法将定义对象如何被迭代
迭代器方法（可通过常量 [Symbol.iterator] 获得）是一个无参数的函数，返回的是迭代器对象。迭代器对象是遵守迭代器协议的对象

迭代器协议

迭代器协议用来定义对象生成一系列值的标准方式。实际上就是现在有了定义对象如何迭代的流程。通过执行 .next() 方法来完成这一流程。
当对象执行 .next() 方法时，就变成了迭代器。.next() 方法是无参数函数，返回具有两个属性的对象：
1)value：表示对象内值序列的下个值的数据
2)done：表示迭代器是否已循环访问完值序列的布尔值
如果 done 为 true，则迭代器已到达值序列的末尾处。
如果 done 为 false，则迭代器能够生成值序列中的另一个值。

const digits = [0, 1, 2, 3, 4];
for (const digit of digits) {
  console.log(digit);
}//for of 进行迭代

const digits = [0, 1, 2, 3, 4];  //[Symbol.iterator]() 迭代器方法,返回无参函数
const arrayIterator = digits[Symbol.iterator]();

console.log(arrayIterator.next()); //Object {value: 0, done: false}
console.log(arrayIterator.next()); //Object {value: 1, done: false}

下面是对象属性迭代的例子

const james = {
    name: 'James',
    height: `5'10"`,
   weight: 185,
    [Symbol.iterator](){
        let keysArr = Object.keys(this);
        let index = 0;
        let obj = this;
        return {
            next(){
                return {"value": obj[keysArr[index]], 
                "key": keysArr[index], 
                "done": Boolean(index++ >= keysArr.length-1)} ;
            }
        }
    }
};
const iterator = james[Symbol.iterator]();
console.log(iterator.next().value); // 'James'

Set（集合）

数据不重复的数组,但是不能通过索引访问

const games = new Set(['Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart', 'Super Mario Bros.']);
console.log(games); //Set {'Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart'}

修改 Set

添加.add() 返回set ,如果添加重复项,不会报错,也不会添加
删除.delete() 返回boolean
删除所有.clear() 没有返回值

使用 Set

.size 属性可以查看Set长度
.has() 方法可以检查 Set 中是否存在某项(entry),返回boolean
.values() 方法可以返回 Set 中的值,返回值是 SetIterator 对象
使用for...of 循环遍历Set.values();

const games = new Set(['Super Mario Bros.', 'Banjo-Kazooie', 'Mario Kart', 'Super Mario Bros.']);
for(let str of games.values()){    //for(let str of games) 效果一样
console.log(str);
}

WeakSet（弱集合）

只能包含对象,不能迭代,没有clean()
当集合中的对象为null时,自动回收.效率比set高

Map（映射）

如果说 Set 类似于数组，那么 Map 就类似于对象，因为 Map 存储键值对，和对象包含命名属性及值相类似

修改 Map

.set() 方法添加键值(两个参数)。第一个参数是键，用来引用第二个参数，即值
使用 .delete() 方法移除键值对
使用 .clear() 方法从 Map 中删除所有键值对

处理 Map

使用 .has() 方法并向其传入一个键来检查 Map 中是否存在该键值对
通过向 .get() 方法传入一个键，获取 Map 中的值
使用 for...of 循环遍历Map

WeakMap（弱映射）

WeakMap（弱映射）的行为和 WeakSet 的一样，只是 WeakMap 处理的是键值对，而不是单个条目

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。


分享题目：js学习笔记05-ES6内置功能-创新互联
本文来源：http://cdweb.net/article/doojgg.html

其他资讯