初入ES6随笔

Posted sundayboy

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了初入ES6随笔相关的知识,希望对你有一定的参考价值。

初入ES6随笔

 
var c = a => console.log(a)
 
 
 
let a1 = 1; //只在块儿状作用域生效的变量声明
 
const a2 = 1; //常量声明,值不可改变,快儿状作用域
 
解构赋值语法
 
let [a3, b3, c3] = [1, 2, 3]; //数组解构赋值
 
let [a4 = 0, ...b4] = [1, 2, 3, 4] //数组解构赋值 a4 = 1 b4 = [2,3,4] 允许默认值;
 
let {a5, b5} = {a5: "1", b5: "2"} // 对象解构赋值 a5 = 1; b5=2;
 
let {a6: b6, c6: d6} = {a6: "2323", c6: "2"} // 对象解构赋值 将a6的值赋给b6 b6 = 2323;
 
let [a7, b7, c7, d7, e7] = "hello"; //字符串解构赋值 a7="h"; b7="e" ....
 
 
字符串扩展
let a8= "hello world!"
 
for(let a8 of ‘let‘){ /*console.log(a8)*/ } //for...of 循环遍历 "h","e","l" ....
 
a8.indexOf("hello"); //是否包含该字符 //返回在字符串的位置
 
a8.startsWith("wo"); //true 返回是否包含该字符
 
a8.startsWith("wo", 6); //true 当前数字的位置是否包含该字符 返回布尔值
 
a8.endsWith("d!"); //true 最末是否有该字符
 
a8.endsWith("e",2); //true 第二个是否是该字符 只针对单个字符
 
a8.includes("hel"); //true 是否包含该字符 返回布尔值
 
a8.includes("world",6); //true 当前数字的位置是否包含该字符 返回布尔值
 
a8.repeat(2); //hello world!hello world! 返回一个新的字符串,将该字符串重复N次
 
‘x‘.padStart(5, ‘ab‘); // ‘ababx‘ 在数值前补全到指定位数 常用与数字位数的补全 0000012
 
‘x‘.padEnd(5, ‘ab‘); // ‘xabab‘ 在数值后补全到指定位数 常用与数字位数的补全 0000012
 
`${a8}我是ME`; //模板字符串,使用“ ` ” 在${} 中加入js代码可直接运行并输出
 
`${a8}我是ME`.trim(); //使用 .trim() 可以消除反引号中的换行
 
 
数值的扩展
 
Number.parseInt(‘12.34‘) //12 取整
 
Number.parseFloat(‘12.34sdf‘) //12.34 只保留数字部分
 
 
Math.trunc(4.1) //4 去掉小数部分。只保留整数
 
Math.sign(-5) //-1 判断是否正数还是负数 负数返回-1 正数返回 +1
 
Math.cbrt(2) //1.2599210498948734 计算数字的立方根
 
 
函数的扩展
 
function a9(b=0, c=1){}; //函数的参数中允许使用默认参数 替代了之前的 b = b || 0;
 
function a10({x,y=5}){ console.log(x,y)} // a10({x:1,y:2}) 可以使用解构方式赋值 直接调用 并可以设置默认值
 
function a11({x,y=5} = {} ){ console.log(x,y)} //a11({y:2}) X 对象为undefined // 为了避免没有默认值的参数报错,所以给对象复制一个空对象
 
function a12(a,...b){ console.log(a+b[0]+b[1]) }(1,2,3); //6 rest参数 形式为...变量名 获取函数的多余参数 rest是一个数组。和调用数组的方式一样
 
a12.name //字符串返回函数的名字
 
var a13 = a=>a; //相当于 var a13 = function(a){return a} 箭头函数 声明 变量名 = 参数 => 返回值 如果函数体大于一条语句需要改为 =>{return a}
//如果需要添加多个参数则需要加上() var a13 = (a,b) => a+b
 
let a14 = ({ first, last }) => first + ‘ ‘ + last; //箭头函数与变量解构结合使用
 
 
class的基本使用
 
class a15{ //创建class 类
constructor(x, y){ //类的默认属性
this.x = x;
this.y = y;
this.h = "hello"
}
toString(){ //类中的方法。不需要写function
console.log(`${this.h}--${this.x+this.y}`)
}
b(){ //类中的方法。不需要写function
console.log(`world--${this.x+this.y}`)
}
static classMethod(){ //静态方法,只能在本类调用。赋给其他表达式将找不到本方法
 
}
}
//new a15(1,2).toString();
 
class a16 extends a15{ //a16 类 将继承a15类的所有方法
constructor(x,y){//定义类的默认属性
super(x,y);//**调用父级的所有属性和芳芳,此方法必须存在
this.c();//调用当前类的C方法。
}
c(){
super.h="world2";//调用父级类的h属性。调用父级方法时可以依然使用this调用,也可以使用super调用
this.toString();//调用父级类的toString()方法,方法中打印出来的h属性被改变了
 
}
}
//var a18 = new a16(1,2)
 
class a17 extends a16{ //a17 类 将继承a16类和15类的所有方法的所有方法
constructor(x,y){//设置类的默认方法
super(x,y);//调用父级类(a16)。父级类中默认改变了a15类中的h属性。所以在这里也改变了
super.toString();//此方法调用的是父级类的父级类的方法。此方法中的变量被a16类改变后。在a17中调用a15类依然被改变了。
}
}
 
 
 
 
 
 
 
 
 
//new a17(13,22)
 

以上是关于初入ES6随笔的主要内容,如果未能解决你的问题,请参考以下文章

ES6随笔--声明变量

ES6标准入门 论文随笔

ES6里class杂乱随笔

ES6随笔--各数据类型的扩展--数值

ES6 Promise随笔

ES6随笔--各数据类型的扩展--函数