代码细节优化之ES6篇

今天是高考的第二天,也就是最后一天,先预祝大家高考大捷,考上理想的大学!好了,接下来该进入正题了。今天不讲难懂的知识,就聊一些我们学过的知识,怎么才能提高基础代码的运行效率~

尽量的使用let和const:

在ES5中,var是全局声明,只有在函数作用域内才会得以限制,并且会使得声明的变量得到提升。但是,如果使用了let或const声明的变量,则不会出现变量提升问题,并且会按照开发人员的意愿,限制在各个作用域内,十分符合广大程序猿的思想。

那么在let和const中,又怎么选择呢?建议优先选择const:

有助于提醒阅读程序的人,该变量不可变。

有利于分布运算

JavaScript编译器会对const进行优化,这是为什么使用const的最根本的原因了。

字符串中的const

尽量使用反引号或单引号:

conststr1=`string`;

conststr2='string';

解构赋值

使用数组成员对变量赋值时,优先使用解构赋值:

constarray= [1,2,3,4];

const[a,b] =array;

使用对象对另一个对象进行赋值:

constAnimal= {

name:'dog',

action:'eat',

}

var{name,action} =Animal;

对象静态化

对象静态化的意思就是使用const来声明对象,一旦定义,就不得随意添加新的属性。如果需要添加属性,要使用Object.assign方法。当然,修改对象属性是没有问题的。

constAnimal= {

name:'dog',

action:'eat',

}

Object.assign(Animal,{favorite:'chicken'});

数组的复制

数组的复制最实用的方法如下:

consta= [1,2,3,4];

constb= [...a];

此时的b与a是互不干扰的,原因是:创建了一个新的数组对象,该对象中的值为数组a中的值。可以看出来,扩展运算符在某些时候是非常有用的~

函数表达式尽量使用箭头函数:

varAnimal= ()=>{

console.log("我是小动物");

}

这样就能少些个function,使得代码更加简洁。

立即执行的函数也应该使用箭头函数:

console.log("我是小动物");

})();//我是小动物

尽量使用class代替原型

原型不仅难以理解,而且使用起来也麻烦,为何不使用class去替代它呢?

在继承方面,类更直观易懂,这里就不再展开了~

单页大型应用尽量使用模块(Module)

使用模块能很好的将数据,业务分离开来,能更好的管理自己的项目。

喜欢的朋友可以点击左上角"Miku灬Rua"关注,也可以扫下方二维码。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180608G0MYGD00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券