關於預設引數( Default parameters)

前言

  不知從什麼時候開始 JavaScript 開始支援預設引數( Default parameters) ，在此把學習的過程做個紀錄。

內容

  範例如下

function call( name = 'DefaultName' ){
  return name
}
//
console.log( call() );//DefaultName
//
function testCall1( val1 = 1 , val2 ){
  return val1 + val2;
}
console.log( testCall1(1) );//NaN
//
function testCall2( val1 , val2 = 1 ){
  return val1 + val2;
}
console.log( testCall2(1) );//2

預設引數( Default parameters) 用起來很簡單，只要在宣告時在引數後方給予預設值即可使用，不過要注意多個引數又有的沒預設引數的狀況，像 testCall1() 的結果遽然是 NaN ，理由也很簡單引為匹配引數時並不如預期，預期是 testCall1( 1(default) ,1) ，但最後匹配的是 testCall1( 1 , undefined ) ，像 testCall2() 這樣就沒問題，會如預期一樣匹配，所以有預設值的引數要盡量向後擺。

參考資料

[ developer.mozilla.org ] Default parameters

 關於 Unary plus (+)

前言

  在之前的 關於 Unary negation (-) 了解 Unary negation ，這次來學習它的相似處理 Unary plus，在此把學習的過程做個紀錄。

內容

  範例如下

let num = -4;
console.log( +num );//-4
console.log( +"123" );//123
console.log( +"-456" );//-456
console.log( +"ABC" );//NaN

Unary plus 用起來跟 Unary negation 是一樣的!在 Numbe 有加跟沒加是一樣的， Unary negation  還有負負得正的作用。在 String 方面也是會對可以 Parse 成 Number 的內容做轉換，如果不能則回傳 NaN。

參考資料

[ developer.mozilla.org ] Unary plus (+)

相關文章與資料

關於 Unary negation (-)

關於  Unary negation (-)

前言

  在變數前加一個負號，也就是 [ developer.mozilla.org ] Unary negation (-) ，直覺得會覺得是把變數變成負值，但有一些跟寫得不一樣，在此把學習的過程做個紀錄。

內容

   [ developer.mozilla.org ] Unary negation (-)  的功能確實是把變數變成數值，範例如下

let num = -4;
console.log( -num );//4
console.log( -"123" );//-123
console.log( -"-456" );//456
console.log( -"ABC" );//NaN

範例開頭對 Number 使用，沒問題跟預期一樣，但其實

[ developer.mozilla.org ] Unary negation (-) 不只是對 Number 有效，也對 String 有效，如果 String 本身可以被 Pasre 成 Number，那不論是是正值或負值都會成功轉換，但如果不能被 Parser ，會回傳 NaN 。

參考資料

[ developer.mozilla.org ] Unary negation (-)

 直接喚起宣告的匿名函式

前言

  最近看到 [ developer.mozilla.org ] void operator ，發現遽然可以直接喚起宣告的匿名的函式，在此把學習的過程做個紀錄。

內容

  範例如下

void function (){
  console.log('exe!');//exe!
}();
//follow will has error!
// function (){
//   console.log('exe!');
// }();

一班匿名函式宣告後會用變數來承接，以便於喚起，但只要透過 [ developer.mozilla.org ] void operator 後就可以直接喚起，不需要變數承接，用法也很簡單，在匿名函式前加入 void ，接著在宣告後的地方增加 () ，如果也需要輸入引數可在這個 () 裡增加，如此就可以喚起該匿名函式!如果不透過在前方加 void 的方式，直接在後方加 () 喚起是不可行的!

參考資料

[ developer.mozilla.org ] void operator

 將數字(Number)強制顯示成 32 位元

前言

  最近需要把數字(Number)顯示成 32 位元，但發現只是透過進制轉換並不會顯示成 32 位元，它會依據數值大小來決定位元數，如果需要強制顯示成 32 位元該如何做呢?在此把學習的過程做個紀錄。

內容

  範例如下

let num = 5;
let negNum = -5;
console.log( num.toString(2) );//101
console.log( negNum.toString(2) );//-101
console.log( (num >>> 0).toString(2) );//101
console.log( (negNum >>> 0).toString(2) );//11111111111111111111111111111011
//
function ParseNumberToBinary32(num){
  let str = (num >>> 0).toString(2);
  return str.padStart( 32 , '0' );
}
console.log( ParseNumberToBinary32(num) );//00000000000000000000000000000101
console.log( ParseNumberToBinary32(negNum) );11111111111111111111111111111011

範例的前兩例示範只是透過進制轉換時顯示的結果，負數的顯示結果是詭異的負號加二進制數值，該如何正常顯示呢?透過 [ developer.mozilla.org ] Unsigned right shift (>>>) ，利用 >>> 位移 0 來取得結果，第三與第四例即結果，雖然負數顯示的結果正常了，但正數的位元數不足，富麗的最後透過 ParseNumberToBinary32() 來取得結果，可以已看到 ParseNumberToBinary32() 也是透過 >>> 位移 0 來處理，但最後會使用 padStrart() 來輸出，這是為了補足在數值是正數時會位元不足。

 

參考資料

[ developer.mozilla.org ] Unsigned right shift (>>>)

相關文章與資料

關於 JavaScript 的進制轉換

 關於指數運算子(**)

前言

  JavaScript 提供指數運算子(**)，他其實跟早前的 Math.pow() 的功能差不多，但有一些不一樣，在此把學習的過程做個紀錄。

內容

  範例如下

console.log( 2 ** 9 );//512
console.log( 10 ** -3 );//0.001
console.log( Math.pow( 2 , 8 ) );//256
console.log( Math.pow( 10 , -2 ) );//0.01
//
let bigNum = 2n;
console.log( (bigNum ** 10n).toString() );//1024
//Follow has error...
//console.log( (bigNum ** 10n).toString() );
//console.log( (2 ** 10n).toString() );

指數運算子(**)跟一班的運算子用起來一樣，可以在指數運算時提供直觀的程式碼，使用 Math.pow() 也不是不行只是程式碼看起來不簡潔而已。指數運算子(**)有一個不同是可以支援BigInt，Math.pow()並不支援，還有要注意用於 BigInt 時前與後的變數都必須是 BigInt。

參考資料

[ developer.mozilla.org ] 指數運算子（**）

[ developer.mozilla.org ] BigInt

相關文章與資料

關於 JavaScript 的進制轉換

關於 BigInt 轉換非十進制的作法

關於 BigInt 搭配運算子時的注意事項

關於 BigInt

 解構賦值有層級的陣列與物件

前言

  在先前的 解構賦值有層級的物件 與 解構賦值有層級的陣列 分別針對物件與陣列做解構賦值，但其實它們是可以混著用的!在此把學習的過程做個路。

內容

  範例如下

let obj = {
  a : 1234,
  b : 5678,
  ar : [ 1 , 2],
};
( { a : newA , b , ar : [ newAr1 , newAr2] } = obj);
console.log( newA );//1234
console.log( b );//5678
console.log( newAr1 );//1
console.log( newAr2 );//2

範例的 newA 與 b 分別使用重新命名與原名的解構賦值，newAr1 與 newAr2 則是這次的混用，在物件裡的陣列，利用重新命名的方式承接 ar ，接著在後面不直接使用變數來承接，而是使用 [] 的方式解構賦值陣列，這樣就可以承接陣列的的內容。

參考資料

[ developer.mozilla.org ] 解構賦值

相關文章與資料

初探解構賦值

將解構賦值用於物件

利用解構賦值來交換變數

利用解構賦值將陣列剩餘部分解構到一個變數

利用解構賦值將物件剩餘部分解構到一個變數

在解構賦值用於物件時，用不同的變數名稱承接數值

利用解構賦值作為函式的引數

解構賦值有層級的物件

解構賦值有層級的陣列