關於 JavaScript 的進制轉換

前言

  在先前的 關於 BigInt 轉換非十進制的作法 裡做了 BigInt 的進制轉換的介紹，這次來學習更多的進制轉換，在此把學習的過程做個紀錄。

內容

  範例如下

let num = 42;
let hexNum = num.toString( 16 );
//
console.log( hexNum );//2a
//Hex int to int
console.log( parseInt( hexNum , 16 ) );//42
//Hex int to BigInt
console.log(  BigInt( "0x"+hexNum ).toString() );//42
//Binary to BigInt
console.log(  BigInt( "0b"+"11111111111111111111111111111111111111111111111111111" ).toString() );
//"9007199254740991"

//Octal to BigInt
console.log(  BigInt( "0o"+"71" ).toString() );//"57"

範例開頭示範的是把 Number 轉換進制，是透過 Number.toString() 來達成，透過參數可以決定要轉換的進制，如果要把它轉換回原來的 Number ，可以透過 parseInt() 來達成，第二個參數就是要轉換的進制，如果要把非十進制的 Number 轉到 BigInt 呢?可以透過 BigInt 的建構式來達成，在建構式輸入進制的字串就可以轉換，二進制的前方是 "0b" ，八進制的前方是 "0o" ，十六進制的前方是 "0x"，那如果碰到非二進制 ，也非八進制與十六進制呢?這些情況就要透過 parseInt() 先變回十進制再轉 BigInt 。

參考資料

[ tech.havocfuture.tw ] 如何使用 javascript 進行十進位、十六進位轉換

[ developer.mozilla.org ] BigInt

相關文章與資料

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

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

前言

  最近需要將 BigInt 轉成 16 進制，但發現沒提供直接輸出的做法，上網查了一下發現了做法，仔此做個紀錄。

內容

  解決的做法可以在 [ stackoverflow.com ] Convert A Large Integer To a Hex String In Javascript 找到，範例如下

let num = 42n;
console.log( num.toString(2) );//101010
console.log( num.toString(8) );//52
console.log( num.toString(10) );//42
console.log( num.toString(16) );//2a

作法意外的簡單，只要在 BigInt.toString() 加入進制的參數就可以輸出對應的進制，如果沒輸入參數的話就等於輸入 10 ，這點可以在範例的第三次的使用看到。

參考資料

[ developer.mozilla.org ] BigInt

[ stackoverflow.com ] Convert A Large Integer To a Hex String In Javascript

相關文章與資料

關於 BigInt

 在 JavaScript 裡合併 Map

前言

  最近在 [ developer.mozilla.org ] Map 發現 Map 可以用很簡單的方法合併，在此把學習的過程做個紀錄。

內容

  範例如下

let map1 = new Map( [
  [ 1 , '123'] ,
  [ 2 , '456'] ,
  [ 3 , '789'] 
] );
let map2 = new Map( [
  [ 1 , 'I am 1'] ,
  [ 2 , 'I am 2'] ,
  [ 4 , 'I am 4'] 
] );
//
let combinedMap1 = new Map( [ ...map1 , ...map2] );
for( let [ key , value] of combinedMap1.entries() ){
  console.log(`Key:${ key } Value:${ value }`);
}
// "Key:1 Value:I am 1"
// "Key:2 Value:I am 2"
// "Key:3 Value:789"
// "Key:4 Value:I am 4"

//
let combinedMap2 = new Map( [ 
  ...map1 , 
  [ 4 , '1234' ],
  [ 2 , '2887' ]
] );
for( let [ key , value] of combinedMap2.entries() ){
  console.log(`Key:${ key } Value:${ value }`);
}
// "Key:1 Value:123"
// "Key:2 Value:2887"
// "Key:3 Value:789"
// "Key:4 Value:1234"

合併的方法是透過初始哈的參數來達成，合併時可以看到如果碰到同樣的 Key  的話會是後面合併的 Map 的內容，也可以直接想成照陣列的順序來加入內容，範例的第二段示範了直接加入 Key 的方法，就是直接透過陣列來增加，當然如果有重複還是會以後面的為主。

參考資料

[ developer.mozilla.org ] Map

 關於 JavaScript 的 Map 瀏覽

前言

  在先前的 關於 JavaScript 的 Set 瀏覽 介紹了 Set 的瀏覽，這次來介紹 Map 的瀏覽，在此把學習的過程做個紀錄。

內容

  範例如下

let valueMap = new Map( [ 
  ['z','aa'] , 
  [12,'bb'] , 
  ['abc',13] , 
  [1234,5678] 
] );
//use Map.entries()
for( const [ key , value ] of valueMap.entries() )
  console.log( `key:${ key } value:${ value }`);
// "key:z value:aa"
// "key:12 value:bb"
// "key:abc value:13"
// "key:1234 value:5678"

//use Map.keys()
for( const key of valueMap.keys() )
  console.log( `key:${ key }`);
// "key:z"
// "key:12"
// "key:abc"
// "key:1234"

//use Map.values()
for( const value of valueMap.values() )
  console.log( `value:${ value }`);
// "value:aa"
// "value:bb"
// "value:13"
// "value:5678"

瀏覽的方法一樣是透過 entries() 、 keys() 與 values() ，不過這次不會像 Set 一樣發生 key 與 value 是一樣的問題，因為這樣也正好反映了 Map 的特性。

參考資料

[ developer.mozilla.org ] Map

相關文章與資料

關於 JavaScript 的 Set 瀏覽

 關於 JavaScript 的 Set 瀏覽

前言

  在之前的 關於 JavaScript 的 Set 簡單用了 Set ，但只是簡單使用，沒用到瀏覽，最近需要瀏覽 Set ，所以發現 Set 的瀏覽有一些不直覺，在此把學習的過程做個紀錄。

內容

  範例如下

let valueSet = new Set( [ 'z' , 12 , 'abc' , 1234] );
//use Set.entries()
for( const [ key , value ] of valueSet.entries() )
  console.log( `key:${ key } value:${ value }`);
// "key:z value:z"
// "key:12 value:12"
// "key:abc value:abc"
// "key:1234 value:1234"

//use Set.keys()
for( const key of valueSet.keys() )
  console.log( `key:${ key }`);
// "key:z"
// "key:12"
// "key:abc"
// "key:1234"

//use Set.values()
for( const value of valueSet.values() )
  console.log( `value:${ value }`);
// "value:z"
// "value:12"
// "value:abc"
// "value:1234"

Set 同時堤供三個瀏覽的方法，分別是 Set.entries() 、 Set.keys() 與 Set.values()  ，Set.entries()  瀏覽後會發現 iterator 會是 key 與 value !?，而且 key 與 value 的值永遠是一樣的，這個原因可以在 [ developer.mozilla.org ] Set.prototype.entries() 裡找到，是為了與 Map 有一樣概念，但這樣就用起來不太直覺，而透過 Set.keys() 與 Set.values() 瀏覽其實都可以，結果都會是一樣的。

參考資料

[ developer.mozilla.org ] Set

[ developer.mozilla.org ] Set.prototype.entries()

相關文章與資料

關於 JavaScript 的 Set

對 JavaScript 的 Set 的觀念修正