rabbit-tian / rabbit-tian.github.io Goto Github PK

    setTimeout(function () {
      console.log('我是定时器');
    });


    new Promise(function (resolve) {
      console.log('马上要执行for循环啦');
      for (let i = 0; i < 1000; i++) {
          if (i == 999) {
            resolve();
          }
      }
    }).then (function () {
      console.log('执行then函数');
    })
    console.log('我是普通的log');

// 执行结果
// 马上要执行for循环啦
// 我是普通的log
// 执行then函数
// 我是定时器

1. JavaScript本身是一门单线程语言

   • 为什么 JS 是单线程的？作为浏览器脚本语言，JavaScript 的主要用途是与用户互动，以及操作 DOM 。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定 JavaScript 同时有两个线程，一个线程在某个 DOM 节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？

2. 同步执行和异步执行

   • 单线程就意味着，所有任务都需要排队，前一个任务结束，才能执行后一个任务。如果前一个任务耗时很长，那么后一个任务就不得不一直等待 于是乎，JS 设计者们把所有任务分成两类，同步和异步
     - 同步：只有前一个任务执行完毕，才能执行后一个任务
     - 异步：当同步任务执行到某个 WebAPI 时，就会触发异步操作，此时浏览器会单独开线程去处理这些异步任务。

用法上区别

1. forEach

   • forEach()不会返回有意义的值的。我们在回调函数中直接修改arr的值。

     let arr = [1,2,3,4]; 
     arr.forEach(function (e,i) {
       arr[i] = e*2;
     })
     console.log(arr); // [2,4,6,8]
     

2. map

   • map()会返回一个全新的数组，原本的数组不受到影响

     let arr2 = [1, 2, 3, 4];
     let newArr = arr2.map(function (e) {
         return e*2
     })
     console.log(newArr); // [2,4,6,8]
     console.log(arr2); // [1,2,3,4]
     

适用环境

1. forEach适合于你并不打算改变数据的时候，而只是想用数据做一些事情 – 比如存入数据库或则打印出来。

   let arr3 = ['a', 'b', 'c', 'd'];
   arr3.forEach((letter) => {
     console.log(letter); 
   });
   

2. map()适用于你要改变数据值的时候。不仅仅在于它更快，而且返回一个新的数组。这样的优点在于你可以使用复合(composition)(map(), filter(), reduce()等组合使用)来玩出更多的花样。

   // 先使用map将每一个元素乘以2，然后紧接着筛选出那些大于5的元素。最终结果赋值给arr2
   
   let arr = [1, 2, 3, 4, 5];
   let arr2 = arr.map(num => num * 2).filter(num => num > 5);
   
   // arr2 = [6, 8, 10]
   

速度

1. map 比 forEach更快

总结

1. 能用forEach()做到的，map()同样可以。反过来也是如此。
2. map()会分配内存空间存储新数组并返回，forEach()不会返回数据。
3. forEach()允许callback更改原始数组的元素。map()返回新的数组。