ApeeScape開発者による実用的なJavaScript（ES6以降）のチートシート

JavaScript（ES6以降）のチートシート

定数

対var

> const EULER = 2.7182818284
>オイラー= 13
>オイラー
> 2.7182818284

>変数平均= 5
>変数平均=（平均+ 1）/ 2
>平均
> 3
> let value = ‘hello world’
> let value =「何が新しいか」
//-> TypeErrorをスローします：識別子 '値'はすでに宣言されています

警告！配列またはオブジェクトの場合、参照は一定に保たれます。定数がオブジェクトへの参照である場合でも、コンテンツを変更することはできますが、変数を変更することはできません。

> const CONSTANTS = []
> CONSTANTS.push（EULER）
>定数
> [2.7182818284]
>定数= {‘オイラー’：2.7182818284}
>定数
> [2.7182818284]

注意してください一時的なデッドゾーン：

> console.log（val）//-> '未定義'
> var val = 3
> console.log（val）//-> 3

それは以下と同等であるため：

2進数、8進数、16進数の表記

>選択でした
> console.log（val）
> val = 3
> console.log（val）

> 0b1001011101// 605
> 0o6745// 3557
> 0x2f50a// 193802

次のうちどれが広告がどのように配置されるべきかを導く原則ですか？

'let / const'で宣言された変数は、引き上げられません。

新しいタイプ

> console.log（val）
//-> ReferenceErrorをスローします
> val = 3とします
> console.log（val） //-> 3

シンボル、マップ、WeakMapsおよびセット

矢印機能

新しいスコープ関数

> setTimeout（（）=> {
＆hellip; console.log（ ‘delayed’）
＆hellip; }、1000）

> {
＆hellip;キュー= 'ルーク、私はあなたの父です'
＆hellip; console.log（cue）
＆hellip; }
>「ルーク、私はあなたの父です」

匿名関数と同等

即時呼び出し関数式（IIFE）と同等

> setTimeout（function（）{
＆hellip; console.log（ ‘delayed’）
＆hellip; } .bind（this）、1000）

>> （関数（） {
＆hellip; var cue = 'ルーク、私はあなたの父です' ＆hellip; console.log（cue） // 'ルーク、私は–
＆hellip; }（））
> console.log（cue） //参照エラー

オブジェクト表記のノベルティ

テンプレートリテラルのおかげで文字列補間

//計算されたプロパティ
> let key = new Date（）。getTime（）
> let obj = {[key]：“ value”}
> obj
> {'1459958882881'： '値'}

//オブジェクトリテラル
バルーン= {色、サイズ};

// と同じ
バルーン= {
色：色、
サイズ：サイズ

}

//より良いメソッド表記
obj = j
foo（a、b）{＆hellip; }、
バー（x、y）{＆hellip; }
}

> const name = 'タイガー'
>定数年齢= 13
>> console.log（ `私の猫は$ {name}という名前で、$ {age}歳です。`）
>私の猫はタイガーという名前で13歳です。

//改行を保持できます＆hellip;
しましょうテキスト=（ `猫
犬
ニコロデオン
）

デフォルトのパラメータ

> function howAreYou（answer = ‘ok’）{
console.log（answer） //多分'OK'
}

約束

クラス、継承、セッター、ゲッター

new Promise（（resolve、reject）=> {
request.get（url、（error、response、
本体）=> {
if（body）{
resolve（JSON.parse（body））;
} そうしないと {
resolve（{}）;
}
}）
}）。then（（）=> {...}）
.catch（（err）=> throw err）

//タスクを並列化します
Promise.all（[
promise1、promise2、promise3
]）。then（（）=> {
//すべてのタスクが終了しました
}）

クラスRectangleはShape {を拡張します
コンストラクター（id、x、y、w、h）{
スーパー（id、x、y）
this.width = w
this.height = h
}
//ゲッターとセッター
幅を設定（w）{this._width = w}
get width（）{return this._width}
}

クラスCircleはShapeを拡張します{
コンストラクター（id、x、y、radius）{
スーパー（id、x、y）
this.radius = radius
}
do_a（バツ） {
a = 12とします。
super.do_a（x + a）;
}
static do_b（）{...}
}
Circle.do_b（）

配列の破壊

オブジェクトの破壊

> let [a、b、c、d] = [1、2、3、4];
> console.log（a）;
> 1
> b
> 2

> let luke = {職業： 'ジェダイ'、
父： 'アナキン'}
> {職業、父親} =ルーク
> console.log（職業、父親）
>ジェダイアナキン

スプレッド演算子

...上司のように破壊する

//配列をカンマ区切りに変換します
//値など
>関数ロガー（... args）{
console.log（ ‘％s引数’、
args.length）
args.forEach（console.log）
// arg [0]、arg [1]、arg [2]
}

> const [猫、犬、...魚] = [
「シュレーディンガー」、「ライカ」、「ネモ」、「ドリ」]
>魚//-> [‘Nemo’、 ‘Dori’]

またはより良いプッシュを行う

...そして将来のES7の破壊

> arr = [1、2、3]とします
> [... arr、4、5、6]
> [1、2、3、4、5、6]

{a、b、... rest} = {a：1、b：2、c：3、d：4}

非同期ES7

ES7を待つ

非同期関数シュレディンガー（）{
新しいPromise（（resolve、reject）を返す
=> {
const result = Math.random> 0.5
setTimeout（（）=> {
結果を返しますか？ resolve（ ‘alive’）
：reject（ ‘dead’）
}）
}）
}

{を試してください
console.log（schrodinger（）を待つ）
//->「生きている」
} catch（err）{
console.log（err）
//->「死んだ」
}

ES7をエクスポート

ES7のインポート

エクスポート関数sumTwo（a、b）{
a + bを返します。
}
export const EULER = 2.7182818284
let stuff = {sumTwo、EULER}
エクスポート{デフォルトとしてのもの}

「react」からReactをインポートする
‘./myexports’から{EULER}をインポートします
インポート*を「./myexports」からのものとして
// に相当
「./myexports」からインポートします
// {sumTwo、EULER}

発電機

彼ら反復プロトコルを実装するオブジェクトを返します。つまり、{value：、done：}を返すnext（）メソッドがあります。。

function * incRand（max）{//アスタリスクはこれをジェネレーターとして定義します
while（true）{
//譲歩後に実行を一時停止し、再開します
// next（）が呼び出されたとき
//そしてxに割り当てます
x = yield Math.floor（Math.random（）* max + 1）;
最大+ = x;
}
}

> var rng = incRand（2）//ジェネレータオブジェクトを返します
> rng.next（）// {値：、完了：false}
> rng.next（3）//上記と同じですが、1から5の間です
> rng.next（）// 5+未定義の結果がNaNになるためNaN
> rng.next（20）//誰もNaNを再び期待していませんか？
> rng.throw（new Error（ 'Unrecoverable generator state。'））
// yieldからスローされます