ES6---新增数据类型Symbol

2023-11-12

es6新标,加入了新的数据类型Symbol与新的数据结构set、map,他们各有特点。


Symbol:

let a=Symbol();
console.log(typeof a);//symbol,js语言的数据类型再添一员


Symbol()==Symbol();//false
let a=Symbol();
let b=Symbol();
a==b;//false,symbol数据的特性,每个symbol数据都是独一无二的值,在对象增加属性的时候,可以避免名字重复的困扰


let a=Symbol();
let b=Symbol();
console.log(a);//Symbol()
console.log(b);//Symbol(),a与b虽然不相等,但是打印出的数据却是一样的,为了区分他们,可以传参:
let c=Symbol('ccc');//Symbol(ccc),传入的参数仅做标记,没有任何实际意义


let a=Symbol();
a+'ccc';//报错
a+2;//报错,symbol类型的数据不能与其他类型的数据进行运算


let a=Symbol('aaa');
String(a);//'Symbol(aaa)'
Boolean(a);//true
Number(a);//报错,symbol类型的数据可以转为string与boolean类型,但是不能转换为number类型


let a=Symbol();
let obj1={a:'aaa'};//结果{a:'aaa'},此时的obj的属性是a
let obj2={[a]:'aaa'};//{Symbol(): "aaa"},此时obj的属性则是Symbol();
console.log(obj2[a]);//aaa,取值时候,属性名依然是a
新的数据类型symbol,最大的特点首当唯一性了,symbol不能隐式的转换类型,所以和其他数类型数据做运算时会报错。但是,symbol可以显式地转为字符串和布尔类型。对象object,在添加symbol类型属性时,必须用[]外扩symbol,不能用点式法对其进行操作。如同其他类型数据一般,symbol也有一些内置方法,,,
let a=Symbol.for('my');
let b=Symbol.for('my');
a==b;//true,到此处,看似已经与上面相抵触,其实不然Symbol(my)仅产生了一个symbol数据,a和b都是同一个值,下面可看例子:

let ab=Symbol();
let a=ab;
let b=ab;
a==b;//true,这里便是上例子的解释


let a=Symbol('my');
let b=Symbol.for('my');
Symbol.keyfor(a);//undefined
Symbol.keyfor(b);//my
///Symbol.keyfor()方法接收一个Symbol.for()产生的数据,返回其对应描述(标记),由于a直接由Symbol()产生,故未能识别

let arr1=[1,2,3];
let arr2=['a','b'];
arr1[Symbol.isConcatSpreadable]=false;
arr1.concat(arr2);//[[1,2,3],a,b]
arr1[Symbol.isConcatSpreadable]=true;
arr1.concat(arr2);//[1,2,3,a,b]
////[Symbol.isConcatSpreadable]表示concat进行拼接时候,是否展开,默认true。
symbol借鉴了很多其他数据类型的方法,包括替换、分割、遍历等等…

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ES6---新增数据类型Symbol 的相关文章

  • JavaScript中的promise

    概述 promise 承诺 是异步编程的一种解决方案 可以替代传统的解决方案 回调函数和事件 ES6统一了用法 并原生提供了Promise对象 promise是异步编程的一种解决方案 什么时候我们会来处理异步事件呢 一种很常见的场景就应该是
  • 微信小程序播放音乐并同步一次显示一行歌词

    主要是对于歌词部分的描述 gitee项目仓库地址 https gitee com manster1231 master cloud music 点个star哦 1 总体思路 先在加载页面时异步获取歌词 根据 musicId 我们可以获取到该
  • 2023最全最新前端面试题(附加解答)

    JS 1 说一下innerHTML 与 innerText的作用与区别 作用 都可以获取或者设置元素的内容 区别 innerHTML可以解析内容中的html标签 innerText不能解析内容中的html标签 2 JavaScript 由以
  • ES6-Map、Set与Arrary的转换

    Map与Array的转换 这个数组要是二维数组
  • js获取数组中最大最小值及对应索引值(下标)

    1 使用原生Js实现该功能 主要是通过循环实现 getMaxMin data key gt if data return false let maxIndex 0 let minIndex 0 let maxNum data 0 key 0
  • JS中的delete

    delete 操作符用于删除对象的某个属性 如果没有指向这个属性的引用 那它最终会被释放 语法 delete expression expression 的计算结果应该是某个属性的引用 例如 delete object property d
  • $nextTick的作用和使用场景

    nextTick的作用和使用场景 vue中的nextTick主要用于处理数据动态变化后 DOM还未及时更新的问题 用nextTick就可以获取数据更新后最新DOM的变化 适用场景 第一种 有时需要根据数据动态的为页面某些dom元素添加事件
  • ES6箭头函数(三)-应用场景

    直接作为事件handler document addEventListener click ev gt console log ev 作为数组排序回调 var arr 1 9 2 4 3 8 sort a b gt if a b gt 0
  • Vue+ElementUI电商项目(六)

    订单列表 创建订单列表路由组件并添加路由规则 在view中新建orderManagement文件夹 新建Order vue组件 组件中添加代码如下
  • Promise,async,await

    什么是Promise Promise 简单说就是一个容器 里面保存着某个未来才会结束的事件 通常是一个异步操作 的结果 从语法上说 promise是一个对象 从它可以获取异步操作的的最终状态 成功或失败 Promise是一个构造函数 对外提
  • Element ui中menu组件(el-menu/el-menu-item/el-submenu/template) 层级结构和用法

    此篇文章写下的时间是2020年 所以如今Element UI都更新了不知道多少版了 肯定会有些许变化 请勿完全照搬照抄 虽然可能这部分代码没什么大的变动 但还是要以官方文档为准 此文仅仅是借鉴 理解具体思路 然后再按照官方的例子来应用到自己
  • ES6迭代器、Set、Map集合和async异步函数

    目录 迭代器 Iterator 的作用 Iterator 的遍历过程 Set Map集合 map和对象区别 async异步函数 迭代器 迭代器 Iterator 就是这样一种机制 它是一种接口 为各种不同的数据结构提供统一的访问机制 任何数
  • ES6中Null判断运算符(??)正确打开方式-

    读取对象属性的时候 如果某个属性的值是null或者undefined 有时候需要为它们指定默认值 常见的作法是通过 运算符指定默认值 const headerText response settings headerText Hello w
  • 深入理解ES6箭头函数中的this

    简要介绍 箭头函数中的this 指向与一般function定义的函数不同 比较容易绕晕 箭头函数this的定义 箭头函数中的this是在定义函数的时候绑定 而不是在执行函数的时候绑定 1 何为定义时绑定 我们来看下面这个例子 1 var x
  • 浏览器无法加载本地文件

    问题描述 在Visual Studio Code 编写HTML文件时需要将 csv文件内容在浏览器控制台窗口输出 浏览器控制一直报错 如下图所示 原因 跨域资源共享问题 本地文件是放在file 这样的系统下 而非网络资源比如http 下 造
  • 【Bun1.0】使用 Bun.js 构建快速、可靠和安全的 JavaScript 应用程序

    bun js Bun 是一个现代的JavaScript运行环境 如Node Deno 主要特性如下 启动速度快 更高的性能 完整的工具 打包器 转码器 包管理 官网 https bun sh 优点 与传统的 Node js 不同 Bun j
  • VUEX各个模块的封装以及Router封装

    一 各个模块的作用 state 用来数据共享数据存储 mutation 用来注册改变数据状态 同步 getters 用来对共享数据进行过滤并计数操作 action 解决异步改变共享数据 异步 二 创建文件 actions js getter
  • 前端基础(三)- ES7~ES12

    为了方便记忆和称呼 ES2015之后的新知识点我们都统称ES6语法 就没必要去划分得那么细 ES7 2016 Array prototype includes includes方法可以判断一个数组是否包含某个指定的值 如果存在返回true
  • VUE实践优化:轮询机制与代码结构升级

    前言 我们之前探讨过 对于包含处理状态的表格数据 我们可以通过轮询的方式进行处理 轮询更新进度条 JavaScript中的定时器和异步编程技巧 然而 当我们离开页面时 定时器仍会继续触发请求 这会造成资源的浪费 因为返回的数据并没有被渲染出
  • 【JavaScript】Set方法

    基本用法 ES6 提供了新的数据结构 Set 它类似于数组 但是成员的值都是唯一的 没有重复的值 Set 本身是一个构造函数 用来生成 Set 数据结构 const s new Set 2 3 5 4 5 2 2 forEach x gt

随机推荐