龙空技术网

18个 编写 JavaScript 好习惯,收藏里面吃灰吧

大智视野 3170

前言:

而今小伙伴们对“js设置字体加粗”大体比较关注,兄弟们都需要分析一些“js设置字体加粗”的相关资讯。那么小编同时在网上收集了一些关于“js设置字体加粗””的相关文章,希望各位老铁们能喜欢,同学们快快来了解一下吧!

本文已经经过原作者 ivan 授权翻译。

在我多年的编程生涯中,我会优先考虑编写代码的方式,不仅是为了让代码更简洁,还因为它有助于提高编码效率,使编写代码的速度更快。

写1000行代码和写300行代码是不一样的,这对我们正在做的程序或脚本有很大的帮助。编程时必须非常小心,因为在大型项目中,脏代码可能是一个严重的问题。

许多程序员批评 JS 语言没有像Java或c++那样的标准工作方式,但事实是JavaScript是目前使用的最好的语言之一,其中一些是FacebookNetflix。像React这样的库提高了前端性能,至于后端,nextJs用于提高速度,这些组合让当今的程序员抓狂。

**ECMAScript v6(缩写为ES6或ES2015)**是JavaScript自2015年6月以来一直遵循的标准。

通过学习以下技巧,我们能够改善编写代码的方式。花点时间在控制台上练习,学习好。

开始吧~

1.常量使用const代替var

常量是永远不变的变量,这样声明变量可以确保它们永远不变。

/* 旧方法 */var i = 1;/* 正确方式 */const i = 1;
2. 使用let替换变量,而不是var

let语句声明了一个具有块作用域的局部作用域变量

/* 不适当的*/var myVal = 1;for (var i; i < 10; i++){  myVal = 1 + i;}/* 正确方式*/let myVal = 1;for (let i; i < 10; i++){  myVal += i}
3.声明对象

用快捷方式声明对象

/*   旧方法  The Object() class makes an unnecessary function call*/const myObject = new Object();/* 正确方式*/const myObject = {};
5.连接字符串
/* 旧方法 */const myStringToAdd = "world";const myString = "hello " + myStringToAdd;/* 正确方式*/const myStringToAdd = "world";const myString = `hello ${myStringToAdd}`;
6. 使用对象方法简写
/* 不适当 */const customObject = {  val: 1,  addVal: function () {   return customObject.val + 1;  }}/* 正确方式*/const customObject = {  val: 1,  addVal(){    return customObject.val++  }}**加粗文字**
7.创建对象的值
/* 旧方法*/const value = 1;const myObject = {  value: value}/* 正确方式*/const value = 1;const myObject = {  value}
8. 给对象赋值
/* 旧方法 */const object1 = { val: 1, b: 2 };let object2 = { d: 3, z: 4 };object2.val = object1.val;object2.b = object1.b;/* 正确方式 */const object1 = { val: 1, b: 2 };const object2 = { ...object1, d: 3, z: 4 }
9. 给数组赋值
/* 不适当*/const myArray = [];myArray[myArray.length] = "hello world";/* 正确方式 */const myArray = [];myArray.push('Hello world');
10. 连接数组
/* 不适当*/const array1 = [1,2,3,4];const array2 = [5,6,7,8];const array3 = array1.concat(array2);/* 正确方式 */const array1 = [1,2,3,4];const array2 = [5,6,7,8];const array3 = [...array1, ...array2]
11.获取对象的多个属性
/* 不适当*/function getFullName(client){  return `${client.name} ${client.last_name}`;}/* 正确方式 */function getFullName({name, last_name}){  return `${name} ${last_name}`;}
12.从对象获取值
/* 不适当*/const object1 = { a: 1 , b: 2 };const a = object1.a;const b = object1.b;/* 正确方式 */const object1 = { a: 1 , b: 2 };const { a, b } = object1;
13. 创建函数
/* 老办法,但很好 */function myFunc() {}/* 很好*/const myFunc = function() {}/* 最好 */const myFunct = () => {}// 重要说明:在某些情况下,建议不要将这些函数与箭头一起使用,以避免读取错误
14.默认值
/* 不适当*/const myFunct = (a, b) => {  if (!a) a = 1;  if (!b) b = 1;  return { a, b };}/* 正确方式 */const myFunct = (a = 1, b = 1) => {  return { a, b };}
15. 使用reduce代替forEach和for来求和
/* 不适当*/const values = [1, 2, 3, 4, 5];let total = 0;values.forEach( (n) => { total += n})/* 不适当*/const values = [1, 2, 3, 4, 5];let total = 0;for (let i; i < values.length; i++){  total += values[i];}/* 正确方式 */const values = [1, 2, 3, 4, 5];const total = values.reduce((total, num) => total + num);
16. 是否存在数组中
/* 不适当*/const myArray = [{a: 1}, {a: 2}, {a: 3}];let exist = false;myArray.forEach( item => { if (item.a === 2) exist = true})/* 正确方式 */const myArray = [{a: 1}, {a: 2}, {a: 3}];const exist = myArray.some( item => item.a == 2)
17.布尔值的快捷方式
/* 不适当*/const a = 5;let b;if (a === 5){  b = 3;} else {  b = 2;}/* 正确方式 */const a = 5;const b = a === 5 ? 3 : 2;
总结

回顾这篇文章,加以练习并学会如何以一种更干净的方式工作,提高处理速度。

完~,我是小智,我要去刷碗了,我们下期再见!

作者:ivan.c 译者:前端小智 来源:medium

原文:

标签: #js设置字体加粗