首页 > 其他分享 >TypeScript之Symbol和迭代器

TypeScript之Symbol和迭代器

时间:2024-03-21 16:01:40浏览次数:17  
标签:TypeScript console log 迭代 对象 Symbol let

Symbols

介绍

自ECMAScript 2015起,symbol成为了一种新的原生类型,就像numberstring一样。

symbol类型的值是通过Symbol构造函数创建的。

let sym1 = Symbol();
let sym2 = Symbol("key"); // 可选的字符串key

Symbols是不可改变且唯一的。

let sym2 = Symbol("key");
let sym3 = Symbol("key");

sym2 === sym3; // false, symbols是唯一的

像字符串一样,symbols也可以被用作对象属性的键。

let sym = Symbol();
let obj = {
    [sym]: value;
}
console.log(obj[sym]);

Symbols也可以与计算出的属性名相结合来声明对象的属性和类成员。

const getClassNameSymbol = Symbol();
class C {
    [getClassNameSymbol]() {
        return 'C';
    }
}
let c = new C();
let className = c[getClassNameSymbol](); // "c"

众所周知的Symbols

除了用户定义的symbols是,还有一些已经众所周知的内置symbols。 内置symbols用来表示语言内部的行为。

以下为这些symbols的列表:

Symbol.hasInstance

方法,会被instanceof运算符调用。构造器对象用来识别一个对象是否是其实例。

Symbol.isConcatSpreadable

布尔值,表示当在一个对象上调用Array.prototype.concat时,这个对象的数组元素是否可展开。

Symbol.iterator

方法,被for-of语句调用。返回对象的默认迭代器。

Symbol.match

方法,被String.prototype.match调用。正则表达式用来匹配字符串。

Symbol.replace

方法,被String.prototype.replace调用。正则表达式用来替换字符串中匹配的子串。

Symbol.search

方法,被String.prototype.search调用。正则表达式返回被匹配部分在字符串中的索引。

Symbol.species

函数值,为一个构造函数。用来创建派生对象。

Symbol.split

方法,被String.prototype.split调用。正则表达式来用分割字符串。

Symbol.toPrimitive

方法,被ToPrimitive抽象操作调用。把对象转换为相应的原始值。

Symbol.toStringTag

方法,被内置方法Object.prototype.toString调用。返回创建对象时默认的字符串描述。

Symbol.unscopables

对象,它自己拥有的属性会被with作用域排除在外。

迭代器和生成器

可迭代性

当一个对象实现了Symbol.iterator属性时,我们认为它是可迭代的。一些内置的类型如Array,Map,Set,String,Int32Array,Uint32Array等都已经实现了各自的Symbol.iterator。对象上的Symbol.iterator函数负责返回供迭代的值。

for…of语句

for…of会遍历可迭代的对象,调用对象上的Symbol.iterator方法。下面是在数组上使用for…of的简单例子:

let someArray = [1,"string","false"];

for (let entry of someArray) {
    console.log(entry); // 1,"string","false"
}

for…of VS for…in 语句

for…of 和 for…in 均可迭代一个列表;但是用于的迭代的值却不同,for…in迭代的时对象的 键 的列表,而 for…of 则迭代对象的键对应的值。

下面的例子展示了两者之间的区别:

let list = [4,5,6];

for (let i in list) {
	console.log(i); // 0,1,2
}
for(let i of list) {
	console.log(i); // 4,5,6
}

另一个区别是for…in 可以操作任何对象;它提供了查看对象属性的一种方法。但是 for…of 关注于迭代对象的值。内置对象Map 和 Set 已经实现了 Symbol.iterator 方法,让我们可以访问它们保存的值。

let pets = new Set(["Cat","Dog","Hamster"]);
pets['species'] = "mammals";

for (let pet in pets) {
	console.log(pet); // "species"
}
for (let pet of pets) {
    console.log(pet); //"Cat", "Dog", "Hamster"
}

代码生成

目标为 ES5 和ES3

当生成目标为ES5或ES3,迭代器只允许在Array类型上使用。在非数值上使用for…of语句会得到一个错误,就算这些非数组值已经实现了Symbol.iterator属性。

编译器会生成一个简单的for循环做为for..of循环,比如:

let numbers = [1, 2, 3];
for (let num of numbers) {
    console.log(num);
}

生成的代码为:

var numbers = [1, 2, 3];
for (var _i = 0; _i < numbers.length; _i++) {
    var num = numbers[_i];
    console.log(num);
}
目标为ECMAScript 2015 或更高

当目标为兼容ECMAScipt 2015的引擎时,编译器会生成相应引擎的for..of内置迭代器实现方式。

标签:TypeScript,console,log,迭代,对象,Symbol,let
From: https://blog.csdn.net/weixin_73918953/article/details/136903841

相关文章

  • 玩转TypeScript-基础(转载)
    转载自:https://www.cnblogs.com/alexander3714/p/14268982.htmlPart1内容#安装typescript编译器#全局安装:npminstall-gtypescript在命令行中查看ts编译器版本判断是否安装成功。TypeScript文件默认以.ts为后缀,TypeScript是JavaScript的扩展,所以TypeScript代码要......
  • 尚硅谷Vue3入门到实战,最新版vue3+TypeScript前端开发教程
    1.创建Vue3工程npmcreatevue@latest或者npminitvue@latest输入项目名和需要的工具后进入项目如果项目报错使用命令安装Node.js的项目依赖包npmi启动vue项目,查看项目是否创建完成npmrundev直接删掉src然后创建src文件夹,在该文件夹中创建main.ts和App.vue文件......
  • find symbolic links
    -P永远不要跟随符号链接。这是默认行为。当find检查或打印有关文件的信息时,如果该文件是符号链接,则所使用的信息应从符号链接本身的属性中获取。 -L遵循符号链接。当find检查或打印有关文件的信息时,所使用的信息应取自链接指向的文件的属性,而不是链接本身(除非它是一个断开的......
  • 【python】(02)初识迭代器Iterator
    系列文章回顾【python】(01)初识装饰器Decorator【python】(02)初识迭代器Iterator文章目录一.迭代器的定义二.迭代器的作用三.实际代码示例四.使用注意事项五.常见问题迭代器是Python中非常重要的概念,通过灵活运用迭代器可以实现高效的数据遍历和处......
  • 每日一看大模型新闻(2024.1.20-1.21)英伟达新对话QA模型准确度超GPT-4,却遭吐槽:无权重代
    1.产品发布1.1韩国Kakao:推出多模态大模型Honeybee发布日期:2024.1.20KakaounveilsmultimodallargelanguagemodelHoneybee-TheKoreaTimes主要内容:韩国科技巨头Kakao今天宣布他们已经开发了一种名为“蜜蜂”(Honeybee)的多模态大语言模型。据Kakao称,“蜜蜂”能够同时......
  • vite + vue3 + typescript 搭建
    1.安装node.js 下载地址:https://nodejs.p2hp.com/,安装好后,cmd输入node-v查看版本号,出现以下图版本号内容则安装成功2.安装vite(本步骤可省略)可先切换淘宝镜像 npmconfigsetregistryhttpsregistry.npm.taobao.org确保node安装好,输入 npminstall-gcreate-vite命......
  • 哈希技术解析:从哈希函数到哈希桶迭代器的全面指南
    文章目录引言一、哈希表与哈希函数1、哈希表的基本原理2、哈希函数的作用与特点3、哈希冲突的处理方法二、哈希桶及其迭代器1、哈希桶a.定义哈希桶结构b.哈希函数c.哈希桶的插入、查找、删除2、哈希桶的迭代器a.类型定义与成员变量b.构造函数c.解引用与比较操作d.递......
  • 中文编程入门(Lua5.4.6中文版)第九章 Lua 迭代器 参考种田游戏
    迭代器(iterator)在游戏开发中扮演着重要角色,尤其是在Lua语言中。它是一种特殊的数据结构,能够逐个访问集合中的元素,犹如一位探险家穿越种田游戏的领土,逐一揭示各个城市与资源。在Lua中,迭代器以一种强大的机制实现,它可以跟踪并遍历表或其他集合类型的每一个项目。其中,泛型for循环......
  • 第一章TypeScript初始化和基础类型
    初始化1.安装node和typescript1.1node安装 Node.js(nodejs.org)Node.js下载安装及环境配置教程【超详细】_nodejs下载-CSDN博客1.2typescript安装npminstalltypescript-g安装完成后初始化文件,就会有package.json文件npminit然后再初始化tstsconfig.jsonts......
  • 第二章 TypeScript任意类型
    在第二章开始前我们先安装一个插件为ts-node和一个声明文件@types/node,这样执行起来就没有第一章那么麻烦了//安装ts-node的插件npmits-node-g//安装声明文件npmi@types/node-D然后新建一个文件执行ts-node文件名.ts你会发现直接就可以输出了any任意类......