JS備註

一、S中!!的作用

!!是將表達式強制轉化爲bool值的運算,

NaN || undefined || null || 0 || '' 都爲 false


二、檢測函數是否存在

你可以通過 typeof 操作符檢測一個函數是否存在。

在下面的例子中,用一個測試來演示檢測window對象是否擁有一個noFunc函數的屬性。如果存在,那就使用它;否則就採取其它的一些操作。

if ('function' === typeof window.noFunc) {
   // use noFunc()
 } else {
   // do something else
 }

三、async 函數

var resolveAfter2Seconds = function() {
  console.log("starting slow promise");
  return new Promise(resolve => {
    setTimeout(function() {
      resolve("slow");
      console.log("slow promise is done");
    }, 2000);
  });
};

var resolveAfter1Second = function() {
  console.log("starting fast promise");
  return new Promise(resolve => {
    setTimeout(function() {
      resolve("fast");
      console.log("fast promise is done");
    }, 1000);
  });
};

var sequentialStart = async function() {
  console.log('==SEQUENTIAL START==');

  // 1. Execution gets here almost instantly
  const slow = await resolveAfter2Seconds();
  console.log(slow); // 2. this runs 2 seconds after 1.

  const fast = await resolveAfter1Second();
  console.log(fast); // 3. this runs 3 seconds after 1.
}

var concurrentStart = async function() {
  console.log('==CONCURRENT START with await==');
  const slow = resolveAfter2Seconds(); // starts timer immediately
  const fast = resolveAfter1Second(); // starts timer immediately

  // 1. Execution gets here almost instantly
  console.log(await slow); // 2. this runs 2 seconds after 1.
  console.log(await fast); // 3. this runs 2 seconds after 1., immediately after 2., since fast is already resolved
}

var concurrentPromise = function() {
  console.log('==CONCURRENT START with Promise.all==');
  return Promise.all([resolveAfter2Seconds(), resolveAfter1Second()]).then((messages) => {
    console.log(messages[0]); // slow
    console.log(messages[1]); // fast
  });
}

var parallel = async function() {
  console.log('==PARALLEL with await Promise.all==');

  // Start 2 "jobs" in parallel and wait for both of them to complete
  await Promise.all([
      (async()=>console.log(await resolveAfter2Seconds()))(),
      (async()=>console.log(await resolveAfter1Second()))()
  ]);
}

// This function does not handle errors. See warning below!
var parallelPromise = function() {
  console.log('==PARALLEL with Promise.then==');
  resolveAfter2Seconds().then((message)=>console.log(message));
  resolveAfter1Second().then((message)=>console.log(message));
}

sequentialStart(); // after 2 seconds, logs "slow", then after 1 more second, "fast"

// wait above to finish
setTimeout(concurrentStart, 4000); // after 2 seconds, logs "slow" and then "fast"

// wait again
setTimeout(concurrentPromise, 7000); // same as concurrentStart

// wait again
setTimeout(parallel, 10000); // truly parallel: after 1 second, logs "fast", then after 1 more second, "slow"

// wait again
setTimeout(parallelPromise, 13000); // same as parallel

結果:

> "==SEQUENTIAL START=="
> "starting slow promise"
> "slow promise is done"
> "slow"
> "starting fast promise"
> "fast promise is done"
> "fast"
> "==CONCURRENT START with await=="
> "starting slow promise"
> "starting fast promise"
> "fast promise is done"
> "slow promise is done"
> "slow"
> "fast"
> "==CONCURRENT START with Promise.all=="
> "starting slow promise"
> "starting fast promise"
> "fast promise is done"
> "slow promise is done"
> "slow"
> "fast"
> "==PARALLEL with await Promise.all=="
> "starting slow promise"
> "starting fast promise"
> "fast promise is done"
> "fast"
> "slow promise is done"
> "slow"
> "==PARALLEL with Promise.then=="
> "starting slow promise"
> "starting fast promise"
> "fast promise is done"
> "fast"
> "slow promise is done"
> "slow"
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章