![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
#author("2024-03-20T22:48:31+09:00;2024-03-17T22:48:12+09:00","default:shota","shota") #author("2024-03-23T22:03:58+09:00","default:shota","shota") [[FrontPage]] *概要 [#w819b14f] -ガッツリ書く機会が少なかったので復習 -雰囲気で書いていた部分もあるので理解を深める *目次 [#vb12ef64] #contents *変数の宣言 [#o7639a7b] -変数を宣言するときに利用するキーワードはvar/const/letの3つがある -それぞれ再代入の可否とスコープが異なる -基本的には'const'を利用する |キーワード|再代入|スコープ|h |var|OK|関数| |let|OK|ブロック| |const|NG|ブロック| *関数 [#ae206f3d] -ES6から引数のデフォルト値が指定可能となった #region(例) #highlightjs(javascript) function multiplication(a, b = 2) { return a * b; } console.log(multiplication(3)); // = 3 * 2 console.log(multiplication(3, 3)); // = 3 * 3 console.log(multiplication(a = 1, b = 4)); // = 1 * 4 console.log(multiplication(4, b = 4)); // = 4 * 4 // undefinedの場合はデフォルト引数が使用される console.log(multiplication(4, undefined)); // = 4 * 2 // nullの場合はnullが引数として渡される console.log(multiplication(4, null)); #endregion *分割代入 [#ta14a306] -配列やオブジェクトの要素から個別の変数に代入する -配列の場合は'[変数, ...] = 配列'の形で代入を行う -オブジェクトの場合は'{変数, ...} = オブジェクト'で代入を行う #region(配列の例) #highlightjs(javascript) const array = [10, 20, 30]; // 分割代入の変数 < 配列の要素数 であれば問題ない const [a1, b1] = array; // a=10, b=20 console.log(a1, b1); const [a2, ,c2] = array; // a2=10, c=30 console.log(a2, c2); #endregion #region(オブジェクトの例) #highlightjs(javascript) const object = { a: "a", b: "b", c: "c", d: function() { console.log("d"); }, e: "e", // f: "f" g: "g", z: "h", }; // object.a, object.bが入る const {a, b} = object; console.log(a, b); // 順番はどのような順番でもOK // object.d, object.cが入る const {d, c} = object; // console.log("d")が呼ばれる d(); // デフォルト値を指定しておくと，プロパティが存在しない場合でも対応可能 const {e, f = "f"} = object; // "e", "f" console.log(e, f); // 'プロパティ名: 変数名'とすると別の変数名でも取り出せる const {g, z: h} = object; // "g", "h" console.log(g, h); #endregion *map/filter/reduce [#je0dfeea] -最近の言語で取り入れられている関数プログラミングスタイルと同じ **map [#jeb8e7b4] #highlightjs(javascript) const array = [1, 2, 3, 4, 5]; // 各要素の値を2倍する array.map((elem) => elem * 2); // 要素と対応するインデックスを乗ずる array.map((elem, idx) => elem * idx); **filter [#s411c66c] #highlightjs(javascript) const array = [ {name: "Bob", age: 10}, {name: "Kevin", age: 20}, {name: "Tim", age: 30}, ]; array.filter((elem) => elem.age < 20); // ブロックを使用する場合は'return'で返す必要がある array.filter((elem) => { return elem.age >= 30 }); **reduce [#g1b98f26] -第一引数に指定するコールバックの引数は(accumulator, currentValue, currentIndex, array) --accumulator: 前回の値．初期値が与えられた場合の初回は与えられた値，そうでない場合は0番目の要素 --currentValue: 現在の要素，初期値指定時の初回は0番目，未指定の場合は1番目 --currentIndex: インデックス．初期値指定=0, 初期値未指定=1 --array: reduceが呼ばれた配列 #highlightjs(javascript) const array = [0, 1, 2, 3]; array.reduce((acc, cur) => acc + cur, 0); // 初期値は省略できる array.reduce((acc, cur) => acc + cur);
