• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录
kikia
博客园    首页    新随笔    联系   管理    订阅  订阅
es6实用特性小结

  1,const 和 let

    let表示声明局部变量,而const表示声明常量,两者都为块级作用域;

    const 声明的变量都会被认为是常量,意思就是它的值被设置完成后就不能再修改了

 

  2,模板字符串

  在ES6之前,我们往往这么处理模板字符串: 通过“\”和“+”来构建模板

 $("body").html("This is a description \" + name + ", " + seatNumber +  ", " + sex + "and so on."); 

  而对ES6来说

  1. 基本的字符串格式化。将表达式嵌入字符串中进行拼接。用${}来界定;
  2. ES6反引号(``)直接搞定; 
例 : $("body").html( ` This is a description , ${name} , ${seatNumber} , ${sex} and son on. ` )


3,数组的扩展 --- 扩展运算符/include
a,扩展运算符(spread)是三个点(...)。
它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。
用法例:后台返回数据全部作为参数传给跳转页面写法:
  let params={
    ...res.body
  }
          // this.$router.push({
          //   path:'/pageTest/page',
          //   query:{
          //      params
          //   }
          // })   
b,include:方法返回一个布尔值,表示某个数组是否包含给定的值,
[1, 2, 3].includes(2)     // true
[1, 2, 3].includes(4)     // false
[1, 2, NaN].includes(NaN) // true
include和indexOf的区别:
indexOf方法有两个缺点:
一是不够语义化,它的含义是找到参数值的第一个出现位置,所以要去比较是否不等于-1,表达起来不够直观。
二是,它内部使用严格相等运算符(===)进行判断,这会导致对NaN的误判。

4,函数的扩展 --- 箭头函数
ES6 允许使用“箭头”(=>)定义函数。如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。
箭头函数可以让this指向固定化,这种特性很有利于封装回调函数

 var f = () => 5; // 等同于 var f = function () { return 5 };

 如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。

 var sum = (num1, num2) => { return num1 + num2; }

  由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号,否则会报错。

 // 报错

 let getTempItem = id => { id: id, name: "Temp" };

 // 不报错

 let getTempItem = id => ({ id: id, name: "Temp" });


 

posted on 2019-11-04 14:52  gogo0  阅读(158)  评论(0)    收藏  举报
刷新页面返回顶部
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3