ES6

ES6

const和let

定义常量:const

定义变量:let

let和const解决

  1. var的变量穿透的问题

    例如:

    for(var i=0;i<5;i++){}
    
    console.log(i);
    

    这里可以输出i的值,为5(在Java中是编译错误的)

    当改var为let时,就会报错,不会输出5

  2. 常量修改的问题

在实际开发和生产中,如果是小程序、uniapp或者一些脚手架中,可以去用let和const

但是如果是web开发,建议还是使用var,因为在一些低版本的浏览器还是不支持let和const


模板字符串

`(Tab上面这个键)

``和${}

  1. 基本的字符串格式化。将表达式嵌入字符串中进行拼接。用${}来界定。

    //es5    
    let name = 'itcast'    
    console.log('hello ' + name)    //es6    
    const name = 'itcast'    
    console.log(`hello ${name}`) //hello itcast
    
  2. 在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。ES6反引号(``)直接搞定。

    var username = "张三";
    var age = 30;
    
    // 1: 原始的做法就是去拼接字符串
    var str = "我名字叫 " + username+",年龄是: "+age;
    console.log(str);  
    
    // 2:用模板字符串来拯救 注意:这里是 `(飘键) (tab键盘的上面那个键)
    // jdk1.9 
    var str2 = `我名字叫 ${username},年龄是: ${age}`;
    console.log(str2);
    

函数默认值

函数默认参数:在方法的参数后面加上一个默认值即可

// 默认参数 给参数列表设定初始值
function add(a=100,b=100) {
	return a+b;    
}
// 执行方法,会用默认值填充,打印出来200
add();
// 覆盖默认值打印  结果是300      
add(100,200);

箭头函数

箭头函数最直观的三个特点:

  1. 不需要function关键字来创建函数
  2. 省略return关键字
  3. 继承当前上下文的 this 关键字

改变方法步骤:

  1. 去掉function
  2. 在括号后面加箭头
  3. 如果逻辑代码仅有return可以省去。
  4. 如果参数只有一个,可以把括号也省去。(如果有多个参数就不能省去)
// 无参数的函数
var sum = function(){}
// 箭头改造如下:
var sum = ()=>{}


// 有参数
// 第一种情况  一个参数的如下
//var sum2 = function(a){};
// 箭头改造如下:
var sum2 = (a)=>{};
var sum2 = a=>{
	return a;
};


// 第二种情况 二个参数的以上,记住括号一定要加
var sum3 = function(a,b){
    return a + b;
};
// 箭头改造如下:
var sum3 = (a,b)=>{
	return a + b;
};


// 第三种情况,如果没有逻辑体,只有返回值可以简化如下
var sum4 = function(a,b){
    return a + b;
};
// 箭头改造如下:
var sum4 = (a,b)=>a+b

对象初始化简写

它是指:如果一个对象中的key和value的名字一样的情况下可以定义成一个。

  1. 如果key和变量的名字一致,可以只定义一次
  2. 如果value是一个函数,可以把**:function**去掉,只剩下()

对象解构

在这里插入图片描述

对象解构 :es6提供一些获取快捷获取对象属性和行为方式

在这里插入图片描述

(上面一行代码相当于下面两行代码)
在这里插入图片描述
lan=person.language;


传播操作符

把一个对象的属性传播到另外一个对象中

对象融合
// 1: 定义一个对象
var person1 = {
    name: '小飞飞',
    age: 16,
};

// 2: 对象解构
var {name,age} = person1;

// ...对象融合
var person2 = {
    ...person1,
    gender:1,
    tel:13478900
};
console.log(person2);

person2结果:
在这里插入图片描述


数组
map方法

方法可以将原数组中的所有元素通过一个函数进行处理并放入到一个新数组中并返回该新数组。

自带循环,回填到对应位置

在这里插入图片描述

然后可以箭头函数去化简

var newarr2 = arr.map(ele=>ele*2);

//都是输出:[2,4,6,8,10,12,14]

map处理对象的数据:
在这里插入图片描述

reduce方法

reduce(function(),初始值(可选)) :

接收一个函数(必须)和一个初始值(可选),该函数接收两个参数:

  • 第一个参数是上一次reduce处理的结果

  • 第二个参数是数组中要处理的下一个元素

    reduce() 会从左到右依次把数组中的元素用reduce处理,并把处理的结果作为下次reduce的第一个参数。如果是 第一次,会把前两个元素作为计算参数,或者把用户指定的初始值作为起始参数

在这里插入图片描述

首先a=1,b=2;return了3,所以取代1和2的位置,

然后a=3,b=下一个=3,return 6 ,取代位置,

依次类推

最后输出55

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值