当前位置: 首页 > 科技观察

编写JavaScript代码的四个关键原则_0

时间:2023-03-21 20:59:35 科技观察

1。用强类型语言编写代码JavaScript是一种弱类型编程语言,其中变量在语法上可以具有不同类型的值。但是为了提高编译性能并使您的代码更容易被其他程序员阅读,建议您以强类型风格编写代码。1)定义变量时,需要指定数据类型错误代码:上述代码中的变量缺少类型信息,导致其他程序员难以理解代码或JavaScript解释器无法优化。好的代码:2)、不要随意改变变量的类型。错误码:earning开始是一个整数,然后变成一个字符串。如果其他人需要阅读或修改这段代码,他或她势必会对代码产生怀疑,甚至写出错误的代码。同时,在V8这样的引擎中,JavaScript代码被转换成字节码执行,并确定字节码中的数据类型。如果我们在JavaScript代码中改变变量的数据类型,编译器就不得不做一些额外的处理,这会降低程序的性能。好的代码:当你需要转换一个值的类型时,使用一个新的变量。3)函数的返回类型应该是一个固定的错误代码:这个函数可能返回一个整数或一个字符串。虽然这符合JavaScript语法,但调用该函数的人很难直接对getPrice()的结果进行算术运算。好的代码:我们可以在函数注释中约定返回-1以指示参数无效,这允许调用者以统一的方式处理函数的结果。2.减少不必要的作用域查找JavaScript支持嵌套作用域和作用域链,这让我们可以编写高效的代码。但是不正确地使用这些语法会弄乱代码。1)如果没有必要,不要把你的代码暴露在全局范围内错误代码:首先,script标签中的所有变量都在全局范围内,不同script标签中的代码可能由不同的程序员开发,这可能导致命名冲突。其次,上面第二行代码,在使用元素变量时,在全局范围内寻找元素变量,降低了程序的性能。好的代码:这样,我们使用闭包来隐藏元素变量,这样全局范围就不会被污染,局部范围内的变量查找也更快。当然,如果您确定元素变量将在其他地方使用,您仍然应该全局公开它。2)不要滥用闭包。JavaScript通过作用域链搜索变量。如果在当前作用域中找不到该变量,JavaScript引擎会在当前作用域的父作用域中查找,然后逐级查找全局作用域。所以闭包嵌套得越深,变量查找的时间就越长。错误码:process函数内部使用了上层作用域变量count,导致JavaScript引擎在调用process函数时查找count变量比较耗时。同时,如果scope嵌套多次,process和count之间有几十行代码,读取process函数时很容易混淆count变量。更好的方法是将计数作为参数传递给流程。好代码:3.利用ES6特性简化代码ES6已经存在很多年了,现在已经非常兼容了。我们应该积极拥抱ES6,让代码更加简洁优雅。1)使用箭头函数代替普通函数作为回调函数如果不需要考虑这个绑定,最好使用箭头函数代替普通函数作为回调。错误代码:正确代码:2)。使用使用传统原型语法的类会将构造函数代码与原型方法代码分开,无法有效组织代码。糟糕的代码:使用类可以使代码更简单易懂,使用类也可以很容易地实现继承的静态成员函数。好的代码:3)使用模板字符串模板字符串用反引号()字符而不是双引号或单引号括起来。错误码:在模板字符串中,我们可以使用任意字符来代替\n这样的转义字符。此外,我们可以直接使用表达式${}来插入变量,而不是拆分字符串并使用+连接。好的代码:这显然更容易阅读。4)、使用默认参数在ES5中,如果我们想给一个函数参数一个默认值,我们可以这样写:在ES6中,我们可以写得更简单、更易读:5)、使用块作用域变量如果我们希望控制台每隔100毫秒打印0,1,2,...10,反过来,有人可能会这样写代码:for(varindex=0;index<=10;index++){setTimeout(()=>console.log(index),100)}不幸的是,上面的代码还不够。因为var声明的变量是全局作用域的,所以执行setTimeout回调函数时,index的值已经变成了11。ES5中的一种解决方案是使用闭包:for(varindex=0;index<=10;index++){(function(archivedIndex){setTimeout(()=>console.log(archivedIndex),100)})(index)}这里我们通过闭包保存索引值,这样每次执行setTimeout时都会找到正确的索引值。但上述写法比较繁琐,不易理解。更好的方法是使用let来声明块作用域变量。for(letindex=0;index<=10;index++){setTimeout(()=>console.log(index),100)}只需要改三个字符就可以完成需求,非常简单方便容易读书。4、语法风格1)、用三元运算符代替简单的if-else一般来说,三元运算符的语法如下:condition?表达式_1:表达式_2;condition是一个表达式,结果是一个布尔值,true或Fake。如果条件为真,三元运算符返回expression_1,否则返回expression_2。坏代码:好代码:2)、避免====有很多特殊的机制,太多使用==会让我们的代码更难理解。我们可以显式转换数据类型以使代码更易于理解。错误代码:好的代码: