浅谈ES6新增数据类型:Symbol
面试中喜闻乐见的问题就是问我们的ES6新增了哪些个新特性 这篇文章一起学习一下新增的数据类型:Symbol
JS的原始数据类型:6种
Boolean,String,Undefined,NULL,Number,Symbol(ES6新增)
原始的数据类型种不包含object这点需要注意。
Symbol是用来干什么的:用来区分我们的属性名的,用来定义对象的唯一属性名。
console.log(typeof Symbol("Alice")) // 输出:symbol
我们通过Symbol函数来生成symbol;
var symbol1=Symbol();
var symbol2=Symbol("Zhangxin");
Symbol类型的值是一个独一无二的值,Symbol函数的参数只是表示对当前Symbol值的描述,因此相同参数的Symbol函数的返回值是不相等的。
- console.log(Symbol() === Symbol()); // 输出:false
var symbol=new Symbol();

Symbol定义的属性 也不能直接去和String类型的属性进行连接操作:
console(Symbol('aa')+"bb");

另外的 下面是Symbol类型和其他类型的转换结果;
var symbol=Symbol("zhangxin");
console.log(symbol.toString());
console.log(Boolean(symbol));
if(symbol)
{
console.log("Y");
}
else{
console.log("N");
}
console.log(Number(symbol));

作为对象属性名的Symbol:
由于每一个Symbol值都是不相等的,这意味着Symbol值可以用于对象的属性名,保证不会出现同名的属性,这对于一个对象由多个模块构成的情况非常有用,能防止某一个键被不小心改写或覆盖。
对象的属性名可以有两种类型,一种是原来的字符串,另一种是新增的Symbol类型。凡是属性名属于Symbol类型,就都是独一无二的,可以保证不会与其他属性名产生冲突。
通过方括号结构和Object.defineProperty,将对象的属性名指定为一个Symbol值。
方法一:
var name=Symbol():
var obj={[name]:"Zhangxin"};
方法二:
var name=Symbol();
var obj={};
obj[name]="Zhangxin"
方法三:
var obj = {};
Object.defineProperty(obj, name, { value: 'Zhangxin' });
参考文档:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
在对象的内部,使用Symbol值定义属性时,Symbol值必须放在方括号之中,如果不放在方括号中,该属性名就是字符串,而不是代表的Symbol值。
var name = Symbol();
var obj1 = {
[name]: "Zhangxin"
};
console.log(obj1.name); // 输出:undefined
console.log(obj1[name]); // 输出:Zhangxin
Symbol值作为对象属性名时,不能用点运算符。由于点运算符后面总是字符串,所以不会读取name作为标识名所指代的那个值,导致属性名实际上是一个字符串,而不是一个Symbol值。
var obj = {};
var name = Symbol();
obj.name = 'Zhangxin';
console.log(obj.name);
console.log(obj[name]);
console.log(obj['name']);
3、作为对象函数名的Symbol
var func = Symbol();
var obj = {
func: function() {
console.log("YES");
}
};
obj.func(); // 输出:YES
4、获取对象属性的两种方法
1) Object.getOwnPropertySymbols()方法
返回只包含Symbol类型的属性名的数组
2) Object.getOwnPropertyNames()方法
返回只包含字符串类型的属性名的数组
var obj = {};
var age = Symbol("age");
var job = Symbol("job");
obj[age] = "Zhangxin";
obj[job] = "student";
obj.age = 23;
var symbols = Object.getOwnPropertySymbols(obj);
var names = Object.getOwnPropertyNames(obj);
console.log(symbols.length); // 输出:2
console.log(symbols); // 输出:[Symbol(age), Symbol(job)]
console.log(obj[symbols[0]]); // 输出:Zhangxin
console.log(names.length); // 输出:1
console.log(obj[names[0]]); // 输出:23
5、Symbol.for()和Symbol.keyFor()方法
1) Symbol.for()方法
类似于单例模式,首先在全局中搜索有没有以该参数为名称的Symbol值,如果有则返回该Symbol值,否则新建并返回一个以该参数为名称的Symbol值。
var symbol1 = Symbol.for('Zhangxin');
var symbol2 = Symbol.for('Zhangxin');
console.log(symbol1 === symbol2) // 输出:true
2) Symbol.keyFor()方法
返回一个已创建的Symbol类型值的key,实质是检测该Symbol是否已创建。
var symbol1 = Symbol.for("Zhangxin");
console.log(Symbol.keyFor(symbol1)); // 输出:"Zhangxin"
var symbol2 = Symbol("Zhangxin");
console.log(Symbol.keyFor(symbol2)); // 输出:undefined
浅谈ES6新增数据类型:Symbol的更多相关文章
- ES6新增数据类型Symbol
Symbol的含义? ES6(2015) 引入了第七种原始数据类型Symbol,Symbol英文文意思为 符号.象征.标记.记号,在 js 中更确切的翻译应该为独一无二的 Symbol的使用? Sym ...
- es6 新增数据类型Symbol
es6在string number boolean null undefined object之外又新增了一种Symbol类型. Symbol意思是符号,有一个特性—每次创建一个Symbol值都是不一 ...
- 浅谈ES6新特性
ES6的了解 新增模板字符串(为JavaScript提供了简单的字符串插值功能).箭头函数(操作符左边为输入的参数,而右边则是进行的操作以及返回的值Inputs=>outputs.).for-o ...
- 浅谈ES6原生Promise
浅谈ES6原生Promise 转载 作者:samchowgo 链接:https://segmentfault.com/a/1190000006708151 ES6标准出炉之前,一个幽灵,回调的幽灵,游 ...
- ES6的新增数据类型:Symbol
简介:Symbol类型是es6新增的一个数据类型,Es5的基本数据类型(undefined,null,Object,function,Number,string) Symbol值通过Symbol函数生 ...
- 浅谈ES6
ECMAScript6.0(简称ES6)是javaScript语言的下一代标准,已经在2015年6月正式发布了.它的目标,使得javaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言 ...
- ES6新数据类型Symbol
Symbol 需计算字面量属性时使用 const benz = Symbol('benz'); const car = { [benz]: 'benz car' }; const info = Sym ...
- 浅谈ES6中的Class
转载地址:https://www.cnblogs.com/sghy/p/8005857.html 一.定义类(ES6的类,完全可以看做是构造函数的另一种写法) class Greet { constr ...
- 浅谈 es6 箭头函数, reduce函数介绍
今天来谈一下箭头函数, es6的新特性 首先我们来看下箭头函数长什么样子, let result = (param1, param2) => param1+param2; 上述代码 按照以前书写 ...
随机推荐
- python标准库总的random函数用法
Python标准库中的random函数,可以生成随机浮点数.整数.字符串,甚至帮助你随机选择列表序列中的一个元素,打乱一组数据等.random中的一些重要函数的用法:1 ).random() 返回0& ...
- 解决反射型XSS漏洞攻击
对于程序员来说安全防御,无非从两个方面考虑,要么前端要么后台. 一.首先从前端考虑过滤一些非法字符. 前端的主控js中,在<textarea> 输入框标签中,找到点击发送按钮后,追加到聊天 ...
- 【转】链接伪类(:hover)CSS背景图片有闪动BUG
来源:http://www.css88.com/archives/744 --------------------------------------------------------------- ...
- FastDFS 与 Nginx 实现分布式图片服务器
FastDFS 与 Nginx 实现分布式图片服务器 本人的 Ubuntu18.04 用户名为 jj 点我下载所有所需的压缩包文件 一.FastDFS安装 1.安装 fastdfs 依赖包 ① 解压 ...
- WinHex18.4算法分析
经过分析,注册码分为六个部分: Name: "xxx" Addr1: "yyy" Addr2: "zzz" 这三个字符不代表长度 Key1: ...
- axios 发送post请求的时候会发送两次
第一次发送的时候会先发送OPTIONS, 第二次才发送POST, 解决方法: 引用qs模块 安装qs依赖 npm install qs --save 引入qs依赖 import qs from 'qs ...
- work2:贪吃蛇
学号:2017*****7219 姓名:邰嘉琛我的码云贪吃蛇项目仓库:https://gitee.com/tjc666/sesnake/tree/master2) 给出你的各项任务完成时间估算与实际消 ...
- CSS3-1
css3 1 学习前置条件:html + css2 2 概述 *历史 css3 就是层叠样式表的目前的最高版本,带来了许多新特性.如,圆角.渐变.过渡.动画.新布局(多列布局缩进盒子等) // c ...
- Problem after converting keras model into Tensorflow pb - 将keras模型转换为Tensorflow pb后的问题
I'm using keras 2.1.* with tensorflow 1.13.* backend. I save my model during training with .h5 forma ...
- Java final类&所有构造方法均为private的类(类型说明符&访问控制符)
1. final是类型说明符,表示关闭继承,即final类不能有子类: 但final类可能可以在类外创建对象(即final类的构造方法可以不是private型): 在同一包中时,可以在任何另外一个类中 ...