前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >十个JS优化小技巧

十个JS优化小技巧

作者头像
Jimmy_is_jimmy
发布2021-02-02 10:27:32
3830
发布2021-02-02 10:27:32
举报
文章被收录于专栏:call_me_R

今年第一篇文章~

Write Less Do the Same

1. if多条件判断

代码语言:javascript
复制
// 冗余
if (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') {}

// 简洁
if (['abc', 'def', 'ghi', 'jkl'].includes(x)) {}

2. if...else...

代码语言:javascript
复制
// 冗余
let test: boolean;
if (x > 100) {
    test = true;
} else {
    test = false;
}

// 简洁
let test = x > 10;

3. Null, Undefined, 空值检查

代码语言:javascript
复制
// 冗余
if (first !== null || first !== undefined || first !== '') {
    let second = first;
}

// 简洁
let second = first || '';

4. foreach循环

代码语言:javascript
复制
// 冗余
for (var i = 0; i < testData.length; i++)
    
// 简洁
for (let i in testData)
// 或
for (let i of testData)

5. 函数条件调用

代码语言:javascript
复制
// 冗余
function test1() {
  console.log('test1');
};
function test2() {
  console.log('test2');
};
var test3 = 1;
if (test3 == 1) {
  test1();
} else {
  test2();
}

// 简单
(test3 === 1? test1:test2)();
复制代码

6. switch条件

代码语言:javascript
复制
// 冗余
switch (data) {
  case 1:
    test1();
  break;

  case 2:
    test2();
  break;

  case 3:
    test();
  break;
  // so on...
}

// 简洁
var data = {
  1: test1,
  2: test2,
  3: test
};

data[anything] && data[anything]();

7. 多行字符串

代码语言:javascript
复制
// 冗余
const data = 'abc abc abc abc abc abc\n\t'
    + 'test test,test test test test\n\t'

// 简洁
const data = `abc abc abc abc abc abc
         test test,test test test test`

8. 隐式返回

代码语言:javascript
复制
// 冗余
function getArea(diameter) {
  return Math.PI * diameter
}

// 简洁
getArea = diameter => (
  Math.PI * diameter;
)
复制代码

9. 重复字符串多次

代码语言:javascript
复制
// 冗余
let test = ''; 
for(let i = 0; i < 5; i ++) { 
  test += 'test '; 
} 

// 简洁
'test '.repeat(5);

10. 幂乘

代码语言:javascript
复制
// 冗余
Math.pow(2,3);

// 简洁而
2**3 // 8

参考

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. if多条件判断
  • 2. if...else...
  • 3. Null, Undefined, 空值检查
  • 4. foreach循环
  • 5. 函数条件调用
  • 6. switch条件
  • 7. 多行字符串
  • 8. 隐式返回
  • 9. 重复字符串多次
  • 10. 幂乘
  • 参考
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档