Edited at

【備忘録】『改訂新版JAVASCRIPT本格入門』の参考になった部分まとめ

間違っているところや気になるところがあれば、コメント欄でガンガンご指摘ください:joy:


基本データ型ではnewしない

ダメ絶対

var flag = new Boolean(false);

if (flag) {
console.log('flag is true');
}
// result: flag is true


サロゲートペア?

'叱る'は4バイトで表現される。

var msg = '叱る';

console.log(msg.length); //result: 3

正しくカウントするには?

var msg = '叱る';

var len = msg.length;
var num = msg.split(/[\uD800-\uDBFF][\uDC00-\uDFFF]/g).length - 1;
console.log(msg.length - num); // result: 2


NaNは自分自身を含め全ての値と等しくない

console.log(Number.Nan === Number.Nan) // result: false

が、しかしMapの世界では例外的に NaN === NaN

var m = new Map();

m.set(NaN, 'hoge');
console.log(m.get(NaN)); // result: hoge


eval is evil

eval関数は置き換えを検討する。


アロー関数

functionはいらない。

let getTriangle = (base, height) => {

return base * height / 2;
}

console.log('三角形の面積:' + getTriangle(5, 2));


JavaScriptでは関数はデータ型の一種


varなしは全てグローバル変数になる


ローカル変数は関数の先頭で宣言する


letはブロックスコープに対応している

でもswitchで使うときには注意。


JavaScriptは引数の数をチェックしない


引数必須にするには?

function required() {

throw new Error('引数が不足しています');
}

function hoge(value = required()) {
return value;
}

hoge(); // result: Error: 引数が不足しています


argumentsオブジェクトはArrayではない

配列のように扱えるだけ。


引数に配列を入れるときは「...」を使う(ES2015)

console.log(Math.max(...[15,-3,78,1]));


オブジェクトから特定のプロパティだけを取り出す

オブジェクト丸ごと渡せる。

function show({name}) {

console.log(name);
};

let member = {
mid: 'Y0001';
name: 'Yamada Taro';
address: 't_yamada@example.com';
};

show(member); // result: Yamada Taro


匿名関数

function arrayWalk(data, f) {

for (var key in data) {
f(data[key], key);
}
}

var ary = [1, 2, 4, 8, 16];
arrayWalk(
ary,
function (value, key) {
console.log(key + ':' + value);
}
);


プロパティを動的に生成する(Computed property names)

let i = 0;

let member = {
name: 'YamadaTaro',
birth: new Date(1970, 5, 25),
['memo' + ++i]: '正規会員',
['memo' + ++i]: '支部会長',
['memo' + ++i]: '関東'
};

console.log(member);


ページの初期化処理は DOMContentLoaded で表すのが基本

document.addEventListener('DOMContentLoaded', function() {

document.getElementById('btn').addEventListener('click', function() {
window.alert('clicked button.');
}, false);
}, false);


アロー関数の場合、 this は固定される


setInterval/setTimeout は保証なし


  • あくまで指定された時間にキューに処理を登録するだけ。非同期で後続のコードを実行する。

  • 擬似的な並列処理。