写点什么

《深入理解 JavaScript 特性》学习总结 1-ES6 基础知识点总结

作者:肥晨
  • 2022-11-17
    江苏
  • 本文字数:1169 字

    阅读完需:约 4 分钟

ES6 特性

书将 ES6 的主要变化归纳为:

  • 语法糖

  • 新机制

  • 更好的语义

  • 更多的内置对象和方法

  • 对原有限制的非破坏性解决方案

ES6 基础

对象字面量

对象字面量是指使用{}简写语法进行对象说明,ES6 对语法进行的改进:属性值简写、可计算属性名和方法定义。

 const study = {        morning: "language",        noon: "algorithm",        nignt: "brush questions",      };
复制代码

属性值简写

在对象的属性名和引用名相同时可以简写:

//原写法 const language = [];      function algorithm() {}      const study = {        language: language,        algorithm: algorithm,      };//属性值简写const language = [];      function algorithm() {}      const study = {        language,algorithm,      };
复制代码


特性:

  • 减少所维护代码复杂性

  • 提高代码可读性以及生产效率

可计算属性名

当事先不知道属性名时,依赖变量或表达式的值:

 const studyLanguage = "morning";      const study = {        [studyLanguage]: "language",        noon: "algorithm",        nignt: "brush questions",      };
复制代码

注意!计算属性名和属性值简写不能同用!

   const language = "language";      const study = {        [language],//语法错误        algorithm:()=>{},      };
复制代码

方法定义

 在使用对象字面量添加属性为对象声明方法时:


//原写法   const study = {        language: function () {},        algorithm: function () {},      };//方法定义写法 const study = {        language () {},        algorithm () {},      };
复制代码


  • 省略冒号和 function 关键字

  • 相对于传统声明更加整洁

箭头函数

 在 JavaScript 中,通常使用如下函数声明:

 // 包含函数名、参数列表和函数体      function name(parameters){        // 函数体      }
复制代码

或者创建匿名函数,省略函数名,将其赋给变量、对象或直接调用:

 // 包含函数名、参数列表和函数体    const name= function (parameters){        // 函数体      }
复制代码

ES6 开始,可使用箭头函数作为匿名函数的一种:


const name= (parameters)=>{    // 函数体  }
复制代码


虽然可使用箭头函数作为匿名函数的一种,但是本质是完全不同的:


箭头函数不能显式命名,尽管现代运行环境会将箭头函数所赋予的变量名作为函数名箭头函数能用作构造函数,没有 prototype 属性,意味不能使用 new 关键字箭头函数绑定在词法作用域中,不会改变 this 的指向词法作用域箭头函数不会创建新的作用域,所以函数体内,this、argument 以及 super 均属于父级作用域。同样在箭头函数作用域中 call、apply、bind 等方法也无法改变 this 的指向,这一限制确保了上下文不被修改


使用箭头函数的优点和用例箭头函数适用于简短用例箭头函数不能显示命名需要定义词法作用域不被改变的函数时使用函数式编程使用,如 map、filter、reduce 等方法时

发布于: 刚刚阅读数: 2
用户头像

肥晨

关注

还未添加个人签名 2021-04-15 加入

平台:InfoQ、阿里云、腾讯云、CSDN、掘金、博客园等平台创作者 领域:前端 公众号:农民工前端

评论

发布
暂无评论
《深入理解JavaScript特性》学习总结1-ES6基础知识点总结_箭头函数_肥晨_InfoQ写作社区