初识ES6

一、cmd创建项目

1、cmd创建新文件夹:mkdir es6(新文件夹名)
2、进入某文件夹:cd es6(文件夹名)
3、查看存在哪些文件:ls
4、cmd返回上一级目录:cd ..
5、cmd返回某个文件夹:cd ../文件名/

二、ES6语法

1、let和const

(1)块作用域(用花括号{}包括的)
(2)let只在块作用域内有效,块作用域外访问就会报ReferenceError(引用错误)
(3)-->为什么是引用错误而不是undefind(es6会强制开启严格模式,变量未声明就会报引用错误)
(4)变量不能重复声明
(5)const声明的常量不能修改并且声明时必须要赋值
(6)const声明一个对象时,只是保证常量名指向的地址不变,并不保证该地址的数据不变,也就是说,将对象常量指向另一个地址会报错,但对象本身是可变的,可以为其添加,修改属性。

2、解构赋值
分类:
(1)数组解构赋值:
(2)对象解构赋值:
(3)字符串解构赋值:
(4)布尔值解构赋值:
(5)函数参数解构赋值:
(6)数值解构赋值:
3、正则扩展
(1)/g和/y修饰符:
共同点:都是全局匹配
不同点:g修饰符只要剩余位置中存在匹配即可,而y修饰符必须从剩余的第一个位置开始匹配

(2)i修饰符:不区分大小写的匹配搜索

(4)u修饰符(unicode)
只有在使用u修饰符的情况下,Unicode表达式当中的大括号才会被正确解读,否则会被解读为量词。
注意:如果字符串中含有大于两个字节的,必须加上u修饰符才能正确识别

(5)flags属性:
regex.flags ES6的flags属性,返回正则表达式的修饰符
4、字符串扩展
(1)codePointAt:
(2)fromCodePoint:
(3)遍历器:let .. of..{}
(4)判断字符串是否包含某字符:
let str = 'string';
console.log('include',str.includes('s'));
(5)一个字符串是否以某个字符开始或者结束
startsWith:str.startsWith('s')
endsWith:str.endsWith('s')
(6)重复:str.repeat(2)
(7)模板字符串:`i am ${name} ${info}`
(8)补白(es7): padstart/padend第一个参数表示字符串最小长度,第二个参数表示替补字符串
padStart:console.log('1'.padStart(2,'0'));可用于时间显示小于两位数时自动补零
padEnd: console.log('1'.padEnd(2,'0'));//向后补零
(9)raw转义:若使用String.raw 作为模板字符串的前缀,则模板字符串可以是原始(raw)的。反斜线也不再是特殊字符, 也不会被解释成换行符

5、数值扩展
(1)二进制(0b...)和八进制(0o...)
(2)判断某个数值是否有尽:Number.isFinite(num)
(3)判断是否为数字:Number.isNaN(num)
(4)判断是否为整数:Number.isInteger(num)
(5)判断一个数是否在-2的53次方和2的53次方之间(不包含端点):Number.isSafeInteger(num)
(6)判断带小数的整数部分并返回:Math.trunc(num)
(7)判断一个数是正数/负数/零:Math.sign(Num)
(8)立方根:Math.cbrt(num)

6、数组扩展
(1)Array.of():返回参数值组成的数组。如果没有参数,就返回一个空数组。
(2)Array.from():
1、用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象
2、映射map:(包括ES6新增的数据结构Set和Map)
例子:console.log(Array.from([1,2,3],function(item){return item*2;}));//2,4,6
(3)填充数组fill():
例:console.log('fill',[1,'a',undefined].fill(7));//[7,7,7]
例:console.log('fill,pos',['a','b','c'].fill(7,1,3));//["a", 7, 7] (第一个参数为替换内容,第二个是下标,第三个是结束位置)
(4)遍历:entires(),keys()和value()
·//keys()返回的是数组的下标
for(let index of ['d','g','e'].keys()){
console.log('keys',index);
}
·//values()返回的是数组的值
for(let index of ['d','g','e'].values()){
console.log('values',index);
}
·//entries()返回的是数组的下标,值
for(let [index,value] of ['d','g','e'].entries()){
console.log('entries',index,value);
}
(5)从当前数组的某个位置上的元素复制到另一个数组的其他位置上:
console.log([1,2,3,4,6,8].copyWithin(0,2,4))//从哪个位置开始替换,从哪个位置截取数据,从哪个位置截止(不包含截止位置)
(6)查找find/findindex
console.log([1,4,0,9,2].find(function(item){return item>3}))//只会查找符合条件的第一个
console.log([1,4,0,9,2].findIndex(function(item){return item>3}))//1 只会查找符合条件的第一个index
(7)数组是否包含某元素:console.log('number',[0,1,2,NaN].includes(NaN));//true


7、函数扩展:
(1)参数默认值:function test(x,y = 'world'){}
(2)rest参数:
function test3(...arg){
for(let v of arg){
console.log('rest',v);//在不确定有多少参数时,将传入的参数转化成数组
}
}
test3(1,2,34,'d');//1,2,34,'d'
(3)扩展运算符:
console.log(...[1,2,4]);//1,2,4
console.log('a',...[1,2,4]);//a,1,2,4
(4)箭头函数
// 函数名 参数 返回值
let arrow = v => v+2;
console.log(arrow(1))
//无参数
let arrow2 = ()=> 5;
console.log(arrow2())
(5)//尾调用(某个函数的最后一步是调用另一个函数)
{
function tail(x){
console.log('tail',x)
}
function f(x){
return tail(x)
}
f(123);
}

8、对象扩展
(1)let es6_method = {
hello(){
console.log('hello2')
}
}
(2)属性表达式://属性表达式
{
//es5
let a = 'b';
let es5_obj = {
a:'c',
b:'c'
}

//es6
let es6_obj = {
[a]:'c'
}
console.log(es5_obj,es6_obj)
}
(3)新增API

原文地址:https://www.cnblogs.com/pfyblog/p/7006962.html