ES6入门

Posted 2020-10-15

一.ES6简介

　　引用阮一峰老师的话:ECMAScript 6.0（以下简称 ES6）是 javascript 语言的下一代标准，已经在2015年6月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。

二.变量

　　let命令:

　　　　ES6新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效,而且不允许重复声明。

　　　　

 for(var i=0;i<10;i++){
   (function(i){
     setTimeout(function(){
      console.log(i);
     })
    })(i)
 }  //es5的写法
for(let i=0;i<10;i++){
    setTimeout(function(){
        console.log(i);
    })
 }//es6的写法,说实话确实方便了很多

 　　const命令:声明一个只读的常量。一旦声明，常量的值就不能改变,但是如果常量保存的是一个对象，那么对象的属性是可以被修改的

　　

const a = {
    name:‘leo‘
};
a.name = ‘momo‘;
console.log(a.name);

三.解构赋值

　　ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。

　　数组的解构赋值：

　　　　按照对应的顺序解构。

　　

var arr = [1,[2,3]];
     var [a,[b,c]] = arr;

     console.log(a,b,c);

输出结果是:1,2,3

 

 四.字符串扩展

　　JavaScript内部，字符以UTF-16的格式储存，每个字符固定为2个字节。对于那些需要4个字节储存的字符（Unicode码点大于0xFFFF的字符），JavaScript会认为它们是两个字符

　　

var s = "??";

s.length // 2
s.charAt(0) // ‘‘
s.charAt(1) // ‘‘
s.charCodeAt(0) // 55362
s.charCodeAt(1) // 57271

　　ES6提供了codePointAt方法，能够正确处理4个字节储存的字符，返回一个字符的码点。

　　模板字符串:模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

　　代码中的字符串用反引号(`)表示，如果需要引入变量则使用${变量名}， 在{}中可以进行运算，也可以引用对象属性。

　　

var name =‘leo‘;
var age = 39;

var str = `你的名字是：${name}你的年龄是：${age}`;

五.数值的扩展

　　Math的扩展:

　　　 Math.trunc():Math.trunc方法用于去除一个数的小数部分，返回整数部分。

　　　 Math.sign():判断参数是正数、负数、正0还是负0  

 　 　  Math.hypot(x,y):返回所有参数的平方和的平方根(勾股定理)

　　数组的扩展:

　　　　Array.from():　把类数组转成真正的数组。

　　　　Array.of():  方法用于将一组参数，转换为数组。

　　　　

　　var arr = Array.of(1,2,3,4,5);
　　console.log(arr);

　　

　　　　arr.find():找出第一个符合条件的数组元素
　　　　参数：
　　　　1、回调函数
　　　　2、回调函数内this的指向
　　　　　　遍历整个数组，遍历过程中调用回调函数，如果回调函数的返回值为true，则返回当前正在遍历的元素。
　　　　　　如果所有元素都不符合条件则返回undefined

　　　　

var arr = [1,2,3,4,5];

 var n = arr.find(function(value,index){

    return value > 4;
 })
 console.log(n);

 

　　　　arr.findIndex():找出第一个符合条件的数组元素的位置
　　　　参数：
　　　　1、回调函数
　　　　2、回调函数内this的指向
　　　　遍历整个数组，遍历过程中调用回调函数，如果回调函数的返回值为true，则返回该数组元素的位置。
　　　　如果所有元素都不符合条件则返回-1

 

var n = arr.findIndex(function(value,index){
    return value > 5;
})
console.log(n);

 

　　　　arr.fill():用来填充数组,填充的位置会覆盖原来的数组元素
　　　　参数:
　　　　1、填充的内容
　　　　2、起始位置
　　　　3、结束位置

　　　　

var arr = [1,2,3,4,5];

arr.fill(6,2,4);

console.log(arr);