如何编写高性能的 Javascript ?

x33g5p2x  于2022-02-12 转载在 JavaScript  
字(1.0k)|赞(0)|评价(0)|浏览(452)

在编写javascript代码时,可以注意如下编写代码方式,保证编写高性能的javascript代码。
1、尽量不要使用for-in循环去访问数组,尽量使用for循环来进行访问。
2、可以将对象缓存起来,特别是DOM的访问特别消耗资源。

//1、对数组进行遍历时,可以将数组长度先使用一个变量保存起来。
//不应该使用如下方式:
var array = [1, 2, 3, 4, 5, 6]
for(let i = 0; i < array.length; i++) {
  console.log(array[i])
}
应该使用如下方式:
var array = [1, 2, 3, 4, 5, 6]
for (let i = 0, len = array.length; i < len; i++) {
  console.log(array[i])
}

//2、对DOM对象进行缓存
//如下所示代码,在每一次都必须从document中取出其DOM对象。
document.getElementById("app").innerHTML = "我是哈哈哈"
document.getElementById("app").innerHTML = "你是谁呀"
//此时我们可以将该对象提前保存到一个变量中
let app = document.getElementById("app")
app.innerHTML = "我是哈哈哈"
app.innerHTML = "你是谁呀"

3、不要在函数内部使用过深的嵌套判断

//如下所示,判断嵌套过深
function foo1() {
  var r = {}
  r.data = {}
  r.data.preset = 2
  if(r) {
    if(r.data) {
      if(r.data.preset) {
        //在此时执行相关代码
      }
    }
  }  
}
//此时可以进行如下代码设置。
function foo1() {
  var r = {}
  r.data = {}
  r.data.preset = {}
  if(!r) {
    //执行相关代码
  }
  if(!r.data) {
    // 执行相关代码
  }
  if(!r.data.preset) {
    //执行相关代码
  }
}

4、不使用未定义的变量

因为如果存在没有定义的变量,则就会在将该变量定义到全局对象上。

5、使用var声明变量,建议写在多行。

var c = 1, sum = 0, d = 0, e = 0
可以将其转化为这样的形式
var c = 1;
var sum = 0;
var d = 0;
var e = 0;

相关文章