高性能的 JavaScript -- 流程控制

Mike617 发布于2019-08-20 16:24 / 2115人阅读

摘要：高性能的流程控制与语句第一种情况第二种情况我们来看上面两个例子大多数的人都觉的语句在条件较少的时候要比清晰，如果条件较多那么就是使用更加清晰明了，事实上语句较语句相比较具有更高的效率。

高性能的 JavaScript -- 流程控制 If-Else 与 Switch 语句

// 第一种情况
if (x === 0) {
  console.log(0);
} else if (x === 1) {
  console.log(1);
}

switch (x) {
  case 0:
    console.log(0);
    break;
  case 1:
    console.log(1);
    break;
}

// 第二种情况
if (x === 0) {
  console.log(0);
} else if (x === 1) {
  console.log(1);
} else if (x === 2) {
  console.log(2);
} else if (x === 3) {
  console.log(3);
} else if (x === 4) {
  console.log(4);
} else if (x === 5) {
  console.log(5);
} else if (x === 6) {
  console.log(6);
} else if (x === 7) {
  console.log(7);
} else if (x === 8) {
  console.log(8);
} else if (x === 9) {
  console.log(9);
}

switch (x) {
  case 0:
    console.log(0);
    break;
  case 1:
    console.log(1);
    break;
  case 2:
    console.log(2);
    break;
  case 3:
    console.log(3);
    break;
  case 4:
    console.log(4);
    break;
  case 5:
    console.log(5);
    break;
  case 6:
    console.log(6);
    break;
  case 7:
    console.log(7);
    break;
  case 8:
    console.log(8);
    break;
  case 9:
    console.log(9);
    break;
}

我们来看上面两个例子大多数的人都觉的 if 语句在条件较少的时候要比 switch 清晰，如果条件较多那么就是使用
switch 更加清晰明了，事实上 switch 语句较 if 语句相比较具有更高的效率。当然这种效率性能的提升只能在分支
条件较多较为复杂的时候体现出来，这与我们的直觉一样 条件较多的时候使用 switch 语句。

优化 If-Else 语句

另外一种减少条件判断数量的方法是将 if-else 组织成一系列嵌套的 if-else 表达式。使用一个多带带的一长
串的 if-else 通常导致运行缓慢，因为每个条件体都要被计算。

if (x < 3) {
  if (x === 0) {}
  else if (x === 1) {}
  else if (x === 2) {}
} else if (x < 6) {
  if (x === 3) {}
  else if (x === 4) {}
  else if (x === 5) {}
} else if (x < 9) {
  if (x === 6) {}
  else if (x === 7) {}
  else if (x === 8) {}
}

在重写的 if-else 表达式中，每次抵达正确分支时最多通过四个条件判断。它使用二分搜索法将值域分成
了一系列区间，然后逐步缩小范围。当数值范围分布在 0 到 9 时，此代码的平均运行时间大约是前面那
个版的一半。此方法适用于需要测试大量数值的情况 (相对离散值来说 switch 语句更合适)。

表查法

有些情况下要避免使用 if-else 或 switch。当有大量离散值需要测试时，if-else 和 switch 都比使用查表法
要慢得多。在 JavaScript 中查表法可使用数组或者普通对象实现，查表法访问数据比 if-else 或者 switch 更快，
特别当条件体的数目很大时。

let map = [1, 2, 3, 4, 5, 6, 7, 8, 9];

console.log(map[x]);

GPU云服务器云服务器高性能的javascript 如何编写高性能的javascript 流程控制语句 java控制执行流程

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/82911.html

吹毛求疵的追求优雅高性能JavaScript

摘要：这样优化后我们最多进行次判断即可，大大提高了代码的性能。表达式的值具有离散性，个人博客,点击查看目录,喜欢可以关注一下. 1.从[]==![]为true来剖析JavaScript各种蛋疼的类型转换 2.吹毛求疵的追求优雅高性能JavaScript 李小龙说过:天下武功,无坚不摧,唯快不破.(真的说过吗?)我想说的是:世间网站,完美体验,唯快不破.(这个我承认我说过.) showImg...

saucxs 2019-08-20 14:34 评论0 收藏0
JavaScript核心语法——语句

摘要：语句块的结尾不需要分号，语句块中的行都有缩进单并不是必须的。条件语句条件语句就是指通过判断指定的计算结果，来决定执行还是跳过指定的语句块。语句，在语句的基础上，允许提供多个条件判断。语句是终端语句，用于循环语句或开关语句。语句语句的概念语句其实就是JavaScript中的整句或命令，使用分号进行分隔，可以编写一句，也可以编写多句。JavaScript中使用花括号（{}）表示一个语...

seanlook 2019-08-23 10:51 评论0 收藏0
Javascript Generator - 函数式编程 - Javascript核心

摘要：中的的引入，极大程度上改变了程序员对迭代器的看法，并为解决提供了新方法。被称为，也有些人把的返回值称为一个。其中属性包含实际返回的数值，属性为布尔值，标记迭代器是否完成迭代。原文： http://pij.robinqu.me/JavaScript_Core/Functional_JavaScript/JavaScript_Generator.html 源代码： htt...

yearsj 2019-08-19 14:50 评论0 收藏0
个人常用JavaScript及React常用优化总结

摘要：插件性能优化及个人常用优化方法经常会触发视觉变化。作用域链指的是当前作用于下可用变量的集合，它在各种主流浏览器中至少包含两个部分局部变量的集合和全局变量的集合。在考虑优化时，数值和变量的性能差不多，并且速度显著优于对象属性和数组元素。 JavaScript 插件性能优化及个人react常用优化方法 JavaScript 经常会触发视觉变化。有时是直接通过样式操作，有时是会产生视觉变化...

yuanxin 2019-08-20 15:07 评论0 收藏0
简单理解Javascript的各种异步流程控制方法

摘要：所以仅用于简化理解，快速入门，依然需要阅读有深入研究的文章来加深对各种异步流程控制的方法的掌握。原文地址：http://zodiacg.net/2015/08/javascript-async-control-flow/ 随着ES6标准逐渐成熟，利用Promise和Generator解决回调地狱问题的话题一直很热门。但是对解决流程控制/回调地狱问题的各种工具认识仍然比较麻烦。最近两天...

makeFoxPlay 2019-08-21 10:38 评论0 收藏0