LoginSignup
0

More than 3 years have passed since last update.

【javascript】書籍のアウトプット

Posted at

こちらの記事は以下の書籍を参考にアウトプットとして執筆しました。

入門JavaScriptプログラミング (日本語) 単行本

文字の検索

最初の文字が$かどうかの判断はこう書く

if(price[0]=='$'){

}

出典:入門JavaScriptプログラミング (日本語) 単行本

最初の3文字の場合はこうかもしれない

if(phone.substr(0,3)===user.areaCode){

}

substr

str.substr(start[, length])
引数 説明
start 最初の文字の位置
length 取り出す数

返り値は、指定された部分が入った新しい文字列

出典:https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/substr

先のコードはphoneの最初の文字から3文字を抜き出している。

ここまでの2つのコードは何をしているのかわかりにくい
そこで自己文書化**が使える

文字列の検索では以下の3つのメソッドが使えるようになった

新しいメソッド 説明
includes その文字が含まれているか
startsWith その文字で始まっているか
endsWith その文字で終わっているか

戻り値はbool値
これらは大文字小文字を区別する

これらは第2引数に検索し始める位置を指定できる(インデックス)
第2引数にindexOfメソッドを使えば効率よく使える
indexOfは検索してマッチした文字の位置を返り値としている

文字列のパディング

特定の文字で特定の長さだけ埋めるというもの
例えば以下は10進数のIPアドレスを2進数へ変換する関数のコード

function binaryIP(decimalIPStr){
  return decimalIPStr.split('.').map(function(octet){
    return Number(octet).toString(2)
  }).join('.')
}

出典:入門JavaScriptプログラミング (日本語) 単行本

Array.prototype.map()

条件に合う新しい配列を生成する

構文
var new_array = arr.map(function callback(currentValue[, index[, array]]) {
    // 新しい配列の要素を返す
}[, thisArg])
コールバック引数 説明
currentValue 現在処理中の値
index 現在処理中の要素の配列内のインデックス
array mapが実行されている配列
thisArg callbackを実行するときにthisとして使う値

このコードでは以下のようなことをしている

  • .split('.')でIPアドレスを4つの配列に分割
  • map(function(octed)により新しいい配列を生成
    • octedは現在処理中の値
  • toString()で引数に入る進数に変換する

以上のコードでは0梅がされないなどうまく行かない
そこでrepeatを使う

function binaryIP(decimalIPStr){
  return decimalIPStr.split('.').map(function(octet){
    let bin= Number(octet).toString(2)
    return '0'.repeat(8-bin.length)+bin
  }).join('.')
}

出典:入門JavaScriptプログラミング (日本語) 単行本

repeat

repeatが呼び出した文字列を繰り返す

'0'.repeat(4);//'0000'

0が4回繰り返される

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0