JavaScriptを学ぶ
合計時間：71時間 作業時間：3時間 現代のJavaScript チュートリアル
JavaScript の基礎
基礎練習を何度でもする。 undefined,nullの数値変換や比較とかのアルゴリズムの理解がやっぱり弱い。 論理演算子も複数かけるの知らなかった。。
コード品質
debugger;を知る。 テストはMochaを知る。describeとitから主に成る。 describeは上から、itも上から順に実行される。 descriptの最初の第一引数には、テストしたい関数名を入れておけば良い認識をしている。 BDD（ビヘイビア駆動開発）を今更知る。 ユースケースを試して失敗したパターンを網羅していく感じかな。 関数をスパイする、が分かっていない。
オブジェクト: 基本
オブジェクト
算出プロパティを知らなかった。
let fruit = 'apple';
let bag = {
[fruit]: 5,
}
bag.apple //5
整数プロパティの場合、昇順ソートされることを知らなかった。 const で定義した場合、プロパティから変更することはできる。 独立したクローンを作成する方法だったのを思い出す。
Object.assign({},obj)
オブジェクトのプロパティの値がオブジェクトの場合で独立したクローンを作成するなら、 値がプリミティブかオブジェクトか検査してループ処理が必要となる。 これをディープクローンと呼ぶことを知る。
ガベージコレクション
到達可能性という考えを知らなかった。 グローバルなルートから参照が可能かどうかを指している。 ガベージコレクションは、到達出来なくなったデータで使用していたメモリの開放を指す。 アルゴリズムとしては、ルートから参照していく、参照先で更に参照があれば終わるまで繰り返す。
シンボル型
プリミティブ型で同じ名前を使用する事ができ、且つ異なった値をセットできる。 オブジェクトでは、列挙されることがないキーとして扱われる。 ユースケースとしては、外部からアクセスされたくないキーに用いるのかな？
オブジェクトメソッド, "this"
thisが毎回曖昧になる。 アロー関数では、ブロック外のスコープから値を参照しにいく
let user = {
firstName: "Ilya",
sayHi() {
let arrow = () => alert(this.firstName);
arrow();
}
};
user.sayHi(); // Ilya
関数宣言では、ブロック内のスコープを参照しにいく
let user = {
firstName: 'Ilya1',
sayHi: {
firstName: 'Ilya2',
arrow(){
alert(this.firstName);
}
}
}
user.sayHi.arrow(); //Ilya2
xとyを定義できるの知らんかった。。
let calculator = {
read(x,y){
this.x = x;
this.y = y;
console.log(this)
},
sum(){
return this.x+this.y;
},
mul(){
return this.x*this.y;
},
};
メソッドでobjectを返却すれば、メソッドチェーンの実装ができる。
let ladder = {
step: 0,
up() {
this.step++;
return this;
},
down() {
this.step--;
return this;
},
showStep: function() { // 現在の段を表示します
alert( this.step );
}
};
ladder.up().up().down().showStep();
オブジェクトからプリミティブへの変換
objectからプリミティブへは、string,number,defaultの種類がある。 そして変換する時、hintというパラメータで区別される。
let user = {
name: "John",
money: 1000,
[Symbol.toPrimitive](hint) {
console.log(hint)
}
};
alert(user) //string
alert(+user) // nuber
alert(user+5) //default
もしくは以下。
let user = {
name: "John",
money: 1000,
// hint="string" の場合
toString() {
return `{name: "${this.name}"}`;
},
// hint="number" or "default" の場合
valueOf() {
return this.money;
}
};
コンストラクタ 演算子 new
new演算子は暗黙的に以下を行う。
new User(...)
function User(name) {
// this = {}; (暗黙)
// this へプロパティを追加
this.name = name;
this.isAdmin = false;
// return this; (暗黙)
}
グローバルな変数をコンストラクタ関数で返却しておくと、 異なるコンストラクタ同士で比較した場合に、trueとなる。
let obj = {};
function A() { return obj }
function B() { return obj }
let a = new A;
let b = new B;
alert( a == b ); // true
データ型
プリミティブのメソッド
トレースという単語を知らなかった。
プログラミングやソフトウェア開発の分野で、実行するとエラーなど不具合を生じるコンピュータプログラムのどこに問題があるか突き止めるために、命令の実行を順番にたどって各段階の状態・状況を確認する作業をトレースという。
数値
小数は２進数の都合上、精度が低下していることを思い出した。 parseInt,parseFloatが、文字列から数値だけを抜き出すのを知らなかった。 小数の演算は気を使わないとミスが多そう。
文字列
サロゲートペアは罠が多い。 16進数で記述した複合文字は、normalize()でユニコードに変換できる
配列
- queue：ティッシュをとる
- stack：カードの山札をひく
for...inはオブジェクトで使用するべき。 whileを使えていない。
配列の中で連続する最大の合計をだす問題について Math.max()を使えていない。 アプローチが２つある。 （１）各要素において、パターンの合計を計算していく。 （２）合計値がマイナスになる場合、0にする ※どちらも、最大値を保存する変数と配列の合計を計算する変数が必要。 （１）は、多重ループで各要素を合算する。 例えば下記。
const arr = [1,2,-3];(1)
1,1+2,1+2+(-3)
2,2+(-3)
-3
(2)は、途中の合計がマイナスになる場合に、0にするのが味噌だと思った。
配列の中で連続する最大の合計をだすアルゴリズム。 Maximum subarray problem
タスク
border-left-width を borderLeftWidth に変換する
charAt()で指定文字だけ大文字にし、残りはsliceで取り出して返却できる。
const text = 'hello'
const str = text.charAt(0).toUpperCase() + text.slice(1)