ECMAScript 6学习总结(2)——ECMAScript 6常用方法总结

时间:2021-07-06 13:30:28
1.不存在变量提升
2.暂时性死区

var a = 40;
if(true){
a = 30;
let a = 10;
console.log(a)
}
3.不允许重复声明,同一作用域内只能声明一次
4.新增的块级作用域

for(作用域A){作用域B} 循环的应用;
var a = [];
for(var i= 0;i<10;i++){
a[i] = function(){
console.log(i);
};
}
a6; //10
var b = [];
for(let i = 0; i<10;i++){
a[i] = function(){
console.log(i);
}
}
a[6](); //6
const关键字用来声明常量,其使用规则除了声明之后不能修改之外,其他特性和let一样
2.ES6字符串的扩展
1.字符的Unicode的表示法
以前是\u + 四位十六进制,超出范围双字节表示,即两组16进制比如console.log("\uoo61")
现在超出用{}表示,比如console.log("\u{20bb9}")
codePointAt() 解码 字变十六字符
String.fromCodePoint()编码 十六进制变字
2.新增字符串的遍历器接口
for....of 遍历
var arr = ["a","b","v","r"];
for(var i of arr){
console.log(i);
}
for(var i in arr){
console.log(i);
}
3.repeat()重复功能
'x'.repeat(3) //xxx;
重复字符串;
4. indexOf()补充includes() startsWith() endsWith() 判断字符串中是否存在某个字符串:
var s = 'Hello world!';

s.startsWith('Hello') // true 以参数开头
s.endsWith('!') // true 以参数结尾
s.includes('o') // true 包括参数;
5.字符串模版扩展: ` ` ${name}
6.padStart(),padEnd()

ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。
3.解构赋值
let [a, b, c] = [1, 2, 3];
//等同于
let a = 1;
let b = 2;
let c = 3;
对象的解构赋值:获取对象的多个属性并且使用一条语句将它们赋给多个变量。
var {
StyleSheet,
Text,
View
} = React;
等同于
var StyleSheet = React.StyleSheet

4.箭头函数: 箭头函数还修复了this的指向,使其永远指向词法作用域
当函数后面直接传参运算时可以不要{}花括号,当有return时就要加花括号
var num = (a)=>a+10;
console.log(num(10));
()=>{
return
}
var sum = (num1, num2) => { return num1 + num2; }
//等同于
var sum = function(num1, num2) {
return num1 + num2;
};
document.onclick = function(){
var that = this;
setTimeout(function(){
console.log(that);
},1000)
}
document.onclick = function(){
setTimeout(function(){
console.log(this);
}.bind(document),1000)
}
document.onclick = function(){
setTimeout(function(){
console.log(this);
}.bind(this),1000)
}
document.onclick = function(){
setTimeout(()=>{
console.log(this);
},1000)
}
5.Symbol 字典量
var a = Symbol();
ES5 的对象属性名都是字符串,这容易造成属性名的冲突。
比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突。如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。
6.
/* set (去重)和 map(后端交互) :数组和对象的映射又不是数组和对象,set本质上属于map
* 长的跟数组一样却不能用操作数组的额方式操作它
*/

1.两种赋值方式
var myset = new Set([1,2,3,4,5,”a”,”b”]);
console.log(myset);
/myset.add方法赋值,必须要new 出来操作/
2.利用add()方法赋值
var myset = new Set();
myset.add(1);
myset.add(2);
myset.add(3);
console.log(myset);
//怎么取值了
for(let a of myset){
console.log(a);
}
/*一个神奇的特性 不允许自己的数据重复 但是看数据类型 不相同要求全等于*/
/*我们用神奇的特性来数组去重*/
数组去重封装:
function arrHeavy(arr){
var newArr = [];
for(let a of arr){
newArr.push(a);
}
return(newArr);
}
arrHeavy(arr);
set:
/火狐单箭头 ,谷歌等于加大于号 所对应的是后台语言里面的数组/
/用来跟后头语言做通信/
赋值1.运用set()方法
var mymap = new Map();
mymap.set(“name”,”admin”); //{“” => “admin”} 不加引号为空
mymap.set(“name”,”admin2”);
mymap.set(“age”,30);
/**/
for(let a of mymap){
console.log(a) //得到一个数组a[0] 所有的key a[1]所有有的evalue
/遍历所有的key/
for(var a of myset.keys()){
console.log(a)
}
/所有的value/
for(var a of myset.values()){
console.log(a)
}
/遍历自身 entries/
for(var a of myset.entries()){
console.log(a)
}
/map所有的遍历方法,set都能用,set中所有的值既是key又是value set用entries遍历的结果和map一样 数组键值都一样/
7.了解class的写法和继承
了解:正则的扩展
1.u
ES6对正则表达式添加了u修饰符,含义为“Unicode模式”,用来正确处理大于\uFFFF的Unicode字符。也就是说,会正确处理四个字节的UTF-16编码。
2.y
ES6添加了y修饰符和g类似,不过y 修饰符在下次匹配的时候需要紧跟上次匹配成功之后的结果匹配,而g则是全局匹配;
exec() 方法在匹配全局对象的时候, 多次匹配会在上一次结束的地方继续匹配;