学习JavaScript(2)|青训营笔记

77 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第3天。今天从月影老师举过的例子中又学到了很多知识。

1.评估代码的好坏

一开始月影老师举出了一段判断一个mat2d矩阵是不是单位矩阵的代码,
本来看似代码写得十分简陋也并没有用循环等等,但是在具体应用场景中这样的判断方式消耗的方式更少,
因为项目会经常单位矩阵,所以这样的方法更利于稳定性。在这个例子中老师意在说明,
写代码的过程中会有各种取舍,符合当前应用场景的就是好的代码。
代码的好坏评估要根据实际应用场景来看。

2.红绿灯

`const traffic = document.getElementById('traffic');

(function reset(){
  traffic.className = 's1';

  setTimeout(function(){
      traffic.className = 's2';
      setTimeout(function(){
        traffic.className = 's3';
        setTimeout(function(){
          traffic.className = 's4';
          setTimeout(function(){
            traffic.className = 's5';
            setTimeout(reset, 1000)
          }, 1000)
        }, 1000)
      }, 1000)
  }, 1000);
})();
`
//但是这个代码套用了5次 setTimeout,十分繁琐。

改进方法:

1.数据抽象,将红绿灯的状态设置成类,将状态进行抽象,后续代码只需要完成状态转变。
    `
    const stateList = [      {state: 'wait', last: 1000},      {state: 'stop', last: 3000},      {state: 'pass', last: 3000},    ];
    `
2.过程抽象:将红绿灯转换的过程进行抽象
3.异步+函数式
`
const traffic = document.getElementById('traffic');

function wait(time){
  return new Promise(resolve => setTimeout(resolve, time));
}

function setState(state){
  traffic.className = state;
}

async function start(){
  //noprotect
  while(1){
    setState('wait');
    await wait(1000);
    setState('stop');
    await wait(3000);
    setState('pass');
    await wait(3000);
  }
}

start();
`//代码可扩展性更高且更加简洁

3.是否为4的幂

`function isPowerOfFour(num){
  num = parseInt(num);

  return num > 0 &&
         (num & (num - 1)) === 0 &&
         (num & 0xAAAAAAAAAAAAA) === 0;
}`//在本节课中学到了O(1)的方法判断是否是4的幂

4.洗牌

随机抽取前i-1张牌中的一张放到第i个位置,同时i=i-1

5.分红包

算法难点总和一定,且保证每份中最少有0.01元
(1)切西瓜法
每次取最大的进行切分
(2)抽牌法
将总金额分为金额*100份进行随机数的抽取

6.总结

真的很喜欢月影老师,因为他总能用一些形象的例子为我们讲解如何优化代码
之前写代码写算法总是觉得做出来就可以,听完这节课 后发现不同的方法真的有很大不同
以后我也会尝试在写完代码后寻求更高效的解决方案。