es6基础知识总结
一、let 与const
let:
cosnt:拥有上面let的各项规则,同时拥有以下的规则
声明必须赋值
声明的常量储存简单的数据类型时不可改变其值,如果存储的是对象,那么引用不可以被改变;至于对象里面的数据如何变化,是没有关系的。
二、模板字符串
var obj = { name:'李明', age:34}//es5字符串拼接console.log('名字'+obj.name+'年龄'+obj.age);//`模板字符串 名字:${obj.name} 年龄:${obj.age}`console.log(`名字:${obj.name} 年龄:${obj.age}`);
三、简化对象的书写
var a=1;var b=2;var obj1={ a, //省略同名关键字 即 a:a,直接写成a b, setA(x){ console.log('aaaa'); //省略function关键字 }}console.log(obj1);
四、箭头函数
//一般形式:let fn1=(x,y)=>{ console.log(this);}fn1();//注意this指向的问题:箭头函数的this指向不是在调用时决定的,而是在定义的时候决定的//即:this指向定义时环境所在的对象,而不是使用时环境所在的对象//如果外部有函数,那么this指向外部函数的this//如果外部没有函数,指向window//箭头函数体内没有arguments对象,如果使用,使用rest参数代替let obj={};let fn1=(x,y)=>{ console.log(this); //window let fn3=()=>{ console.log(this); //window function f4() { console.log(this); //obj } f4.call(obj); //这里调用 } fn3.call(obj); //call不会改变箭头函数的this指向}fn1.call(obj);//call会改变普通函数的this指向function foo2() { let fn1=(x,y)=>{ //箭头函数,指向外部函数的this console.log(this); //obj } fn1();}foo2.call(obj); //call会改变this指向
五、扩展运算符
把一个对象或者数组打散成参数,即获取到对象或者数组里面的每一项
var arr = [1,2,3,4];
console.log( arr ); //(4) [1, 2, 3, 4]
console.log( ...arr ); //1 2 3 4
六、形参默认值
function foo(x=1,y=2){ this.x=x; this.y=y}var f=new foo(); //没有实参,执行形参默认值console.log(f);var p=new foo(4,5); //有实参,执行实参中的值console.log(p);
七、set数据集合
set对象允许存储任何类型的唯一值,无论是原始值或者是对象引用
set:是一个集合,类似于数组,与数组的主要区别是没有重复的元素
主要的作用可以进行去重。NaN也不会重复添加
不存储value。由于key不能重复,所以,在Set中没有重复的key
重复元素在Set中自动被过滤
要创建一个Set,需要提供一个Array作为输入,或者直接创建一个空Set:
var set = new Set();//空setvar set = new Set([1,2,3]);
重点:一个属性,四个方法
1、size属性:返回set数组的长度,类似于length
2、四个方法:add,delete,clear,has
let set =new Set([1,2,3,4,1]);console.log(set.size); //4//添加元素set.add(7); console.log(set); // {1, 2, 3, 4, 7}//删除数组中的某个元素set.delete(3);console.log(set); // {1, 2, 4, 7}//检测数组中是否含有某个元素,返回值为布尔console.log(set.has(2)); //true//清空数组set.clear();console.log(set) //{}var str = 'siiva';new Set(str) //{'s','i','v','a'}
八、map数据集合:类似于对象,一组键值对的结构
Javascript对象Object只能使用字符串当做key值,这给它的使用带来了很大的限制,为了解决这个问题,ES6提供了map数据结构。它类似于对象。是键值对的集合,但是键的返回不限制于字符串,各种类型的值都可以作为键
var m = new Map(); //Map(0) {} 空maplet obj={a:1};const map = new Map([ ['name','java'], ['feel','今天天气贼好'], ['jieguo','适合看帅哥'], [obj,'是!']]);console.log(map); //{"name" => "java", "feel" => "今天天气贼好", "jieguo" => "适合看帅哥", {…} => "是!"}
由于一个key只能对应一个value,所以,多次对一个key放入value,后面的值会把前面的值冲掉:
var m = new Map();m.set('Adam', 67);m.set('Adam', 88);m.get('Adam'); // 88
Map与Object的区别
Map的size属性可以直接获取键值对个数两者都是对应的keys-value键值对,但是Object的keys只能是字符串或者 Symbols,Map的key可以是任意值,比如数组、对象等map方法:
size:返回键值对长度set:设置键值对get:获取对应的value值delete:删除对应的键值对clear:清空maphas:查看是否有对应的键值对,返回值为布尔对应代码:
console.log(map.size); //4 map.set('shia','怎么了'); //设置键值对console.log(map.get('shia')); //返回对应的value值console.log(map.delete('shia'));console.log(map.has('shia'));console.log(map.has(obj));map.clear()console.log(map);
九、Symbol()方法
1、Symbol()相当于第七种数据类型,ES6中为了防止冲突,引入了Symbol()。
凡是用Symbol()引用的属性名都是独一无二的
总结:独一无二,防止冲突
let s1 = Symbol();let s2 = Symbol();console.log(s1); //Symbol()console.log(s2); //Symbol()console.log(s1===s2); //false,验证独一无二let s3 = Symbol('name');let s4 = Symbol('name');console.log(s1===s2); //false,验证独一无二//数据类型console.log(typeof s) //symbol
2、可以用来添加对象的属性值,但是是唯一的,验证独一无二
一般的对象添加的属性名对应的属性值只能是一个,重复添加会覆盖
let obj1={};obj1.name='ni';obj1.name='wo';console.log(obj1); //{name: "wo"}
利用Symbol()添加的会全部显示出来,因为每一个name属性都是独一无二的,解决了命名冲突的问题
let obj2={};obj2[Symbol('name')]='ni';obj2[Symbol('name')]='wo';console.log(obj2); //{Symbol(name): "ni", Symbol(name): "wo"}
3、不能使用new关键字,否则会报错。这是因为Symbol()是一个原始类型的值,不是对象不能添加任何属性
let snew = new Symbol();console.log(snew); //报错 Symbol is not a constructor
4、Symbol()可以将字符串作为参数,
表示对实例对象的描述,主要作用可以针对不同变量进行区分 注意:由于其参数的值是对其的描述,所以可能每次返回的值是不同的let a = Symbol('a');console.log(a.toString()); //Symbol(a)let b = Symbol('B');console.log(b); //Symbol(B) console.log(a===b); //false
5、Symbol()不能与其他类型的值进行运算,但是可以返回一个Boolean值
let c = Symbol();console.log(s+'nihao'); //Cannot convert a Symbol value to a stringconsole.log(s+'2'); //Cannot convert a Symbol value to a stringconsole.log(Boolean(c)); //true
6、不能被for in循环遍历
var obj3 = {};var str1 = Symbol('str1');var str2 = Symbol('str1');obj3[a] = '我是刘昊然的女朋友';obj3[b] = '我承认了';obj3.c = '妈的,瞒不住了';obj3.d = '我爱刘昊然';for( let key in obj3 ){ console.log(key) // c d}
7、可以通过Object.getOwnPropertySymbols()方法,获取Symbol()属性名console.log(Object.getOwnPropertySymbols(obj3)); //[Symbol(a), Symbol(B)]
8、使用场景
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。