JSについての速記

1.三項演算子

場合は、書き込み   の場合に応じ... else文、代わりに三項演算子を使用します。

コードをコピー
CONST X = 20。
答えを聞かせて。
もし(x> 10){
    答え=「大きいです」;
}他{
    答え=「小さいです」;
}
コードをコピー

短縮形:

constの答え= X> 10?「大きい」:「より小さいあります」;

2.短絡評価速記

始原決意値のような変数に割り当てられた別の値は、ヌル未定義またはNULL値でない場合。あなたは、if文の複数条件を書くために書くことができます。

もし(変数1!== nullの||変数1!==未定義||変数1!== ''){
     変数2 =変数1ましょう。
}

それとも、短絡評価方法を使用することがあります:

const変数2 =変数1 || '新着';

3.宣言変数の簡単な方法

Xましょう。
yとしましょう。
letz = 3。

簡単な方法:

せてX、Y、Z = 3。

条件は、速記法の4.if存在します

IF(likeJavaScript === TRUE){}。
IF(!likeJavaScript == TRUE){}。

短縮形:

(likeJavaScript){}もし。
(!likeJavaScript){}もし。

5.JavaScriptサイクル速記法

(聞かせてI = 0; I <allImgs.length、私は++)のために

短縮形:

(allImgsのインデックスを聞かせて)のために

またArray.forEachを使用することができます。

コードをコピー
関数logArrayElements(要素、インデックス、アレイ){
  console.log( "[" +インデックス+ "] =" +要素)
}
[2、5、9] .forEach(logArrayElements)。
//ログ:
// [0] = 2
// [1] = 5
// [2] = 9
コードをコピー

前記短絡評価

値がnullまたは未定義であるか否かを決定することによって、割り当てられた変数の値に、それがあってもよいです。

コードをコピー
DBHOSTをしましょう。
IF(process.env.DB_HOST){
  DBHOST = process.env.DB_HOST。
}他{
  DBHOST = 'localhostの';
}
コードをコピー

短縮形:

constのDBHOST = process.env.DB_HOST || 'localhost' の;

7.進指数

それがゼロ(例えば、10000000)での数値の多くを書き込むことが所望される場合、代わりにこの図のインデックス(1E7)を使用することができます。

ため(LET I = 0; iが<10000; I ++){}

短縮形:

コードをコピー
{}(; iが1E7を<I ++は、I = 0せて)のために

//以下に該当する返します
1E0の=== 1。
1E1 === 10。
1E2の=== 100;
1E3の=== 1000;
1E4の=== 10000;
1E5の=== 100000;
コードをコピー

8.オブジェクトのプロパティ速記

属性名と同じキーの名前場合は、この方法は、ES6のために使用することができます。

CONST OBJ = {X:X、Y:Y}。

短縮形:

CONST OBJ = {X、Y};

9.機能略し矢印

伝統的な方法を理解して書き込むための関数を書くのは非常に簡単ですが、他の関数内で入れ子になったときに、これらの利点は消えてしまいます。

コードをコピー
関数のsayHello(名){
  console.log( 'こんにちは'、名前)。
}

setTimeout(関数(){
  console.log( 'ロードされました')
}、2000)。

list.forEach(関数(アイテム){
  console.log(アイテム)
});
コードをコピー

短縮形:

sayHello =名=>はconsole.log( 'こんにちは'、名前)。

setTimeout(()=>はconsole.log( 'ロードされた')、2000);

list.forEach(項目=>にconsole.log(アイテム))。

10.暗黙の戻り値の速記

多くの場合、returnステートメント機能最終的な結果を返すために使用され、単一の機能矢印暗黙文は、その値を返すことができる({}関数は、returnキーワードを省略するために省略されなければなりません)

文が複数行を返すために(例えば、リテラル表現オブジェクト)、あなたは体を囲むように()関数を使用する必要があります。

コードをコピー
関数calcCircumference(直径){
  Math.PI *直径を返します
}

VAR関数=関数func(){
  リターン{FOO:1}。
}。
コードをコピー

短縮形:

calcCircumference =直径=>(
  Math.PI *直径;

VaRのFUNC =()=>({FOO:1});

11.デフォルトのパラメータ値

if文を書くことが、ES6は、デフォルト値を定義し使用することは非常にシンプルになります使用し、一般的に、関数のパラメータにデフォルト値を渡すためには:

コードをコピー
関数のボリューム(L、W、H){
  (W ===未定義)場合
    3 = W。
  (時間===未定義)場合
    H = 4。
  戻りのL * W * hで。
}
コードをコピー

短縮形:

体積=(L、W = 3、H = 4)=>(のL * W * hで)。

ボリューム(2)//出力:24

12.テンプレート文字列

伝統的なJavaScriptの言語出力テンプレートは、通常、次のように書かれています。

constの歓迎=「最後の+ +」+最初の+「「あなたはとしてログインしています」。」

constのデシベル= 'のhttp://' +ホスト+ ':' +ポート+ '/' +データベース。

ES6はバッククォート$ {}と略語が使用されることができます。

constの歓迎= `あなたは$ {最初} $ {最後}`としてログインしています。

CONST DB = `のhttp:// $ {ホスト} $ {ポート} / $ {データベース}`。

13.分割代入する速記法

ウェブ、又はしばしば前後成分とAPIとの間のリテラルフォームからデータを渡す必要があるオブジェクトの配列の枠組みの中で、それが分解する必要

コードをコピー
CONST観察=は( 'mobx /観察')が必要。
CONSTアクション=( 'mobx /アクション')を必要とします。
CONST runInAction =( 'mobx / runInAction')を必要とします。

CONST店舗= this.props.store。
CONST形式= this.props.form。
CONSTローディング= this.props.loading。
constのエラー= this.props.errors。
constの実体= this.props.entity。
コードをコピー

短縮形:

'mobx' からインポート{観察、アクション、runInAction}。

CONST {店舗、フォーム、ローディング、エラー、エンティティ} = this.props。

また、変数名を割り当てることができます。

CONST {店舗、フォーム、ローディング、エラー、エンティティ:コンタクト} = this.props。
//最後という名前の変数の接触

14.マルチライン短い文字列

これは、複数行の出力文字列は+スプライスする必要がある必要があります。

コードをコピー
コスト= loremの 'Loremのイプサムのニンジン、トマト\ n個の\ t' の
    +リベートが、彼らは "occaecat時間と活力\ n個の\ tを行います
    労働と肥満に+」。長年にわたり\ n個の\ t 'の
    仕事、運動、学校区の\ n個の\ tを「nostrud + I、
    +それからというaliquipの利点を除きます。しかし、宿題の\ n個の\ t 'の
    + Cupidatat消費者は喜びになりたい見つけるために。\ N \ tの "
コードをコピー

抗引用符の使用は、あなたが省略役割に到達することができます:

コードをコピー
コスト= `LoremのLoremのイプサムのニンジン、ミネアポリス
    リベートは、彼らはoccaecat時間と活力を行います
    UT laboreらdoloreマグナaliqua。長年にわたり
    運動、学区の仕事をnostrud I、
    それから利点をaliquipが、問題であることを。しかし、宿題
    彼はcupidatatの痛みの喜びに非難したいesse.`
コードをコピー

15.拡張オペレータ速記

拡張演算は、使用の例は、JavaScriptコードをより効率的に使用する配列関数の代わりに使用することができる有します。

コードをコピー
//配列参加
CONST奇数= [1、3、5]。
= [2,4,6] .concat(奇数)CONST NUMS。

//クローニングアレイ
CONST ARR = [1、2、3、4]。
CONST ARR2 = arr.slice()
コードをコピー

短縮形:

コードをコピー
//配列参加
CONST奇数= [1、3、5]。
CONST NUMS = [2、4、6、...奇数]。
console.log(NUMS)。// [2、4、6、1、3、5]

//クローニングアレイ
CONST ARR = [1、2、3、4]。
constのARR2 = [... ARR]。
コードをコピー

CONCAT()関数とは異なり、アレイ内の任意の場所に挿入された別のアレイへの拡張演算子を使用することができます。

CONST奇数= [1、3、5]。
CONST NUMS = [2、...奇数、4、6]。

オペレータは、拡張解体を使用することができます。

CONST {A、B、...、Z} = {1、B:2、C 3、D 4}。
console.log(a)は// 1
console.log(B)// 2
console.log(Z)// {C:3、D 4}

16.必須パラメータの速記

JavaScriptがない場合、関数のパラメータ値に渡されたパラメータが定義されていません。パラメータの割り当てを高めるために、あなたは例外、または必須パラメータの速記法の使用をスローするようにif文を使用することができます。

コードをコピー
関数foo(バー){
  IF(バー===未定義){
    (「!パラメータがありません」)新しいエラーを投げます。
  }
  バーを返します。
}
コードをコピー

短縮形:

コードをコピー
必須=()=> {
  (「!パラメータがありません」)新しいエラーを投げます。
}

FOO =(バー=必須())=> {
  バーを返します。
}
コードをコピー

17.Array.findの速記

配列から値を見つけたい、あなたはサイクルに必要です。ES6では、同じ効果を達成するために()関数を見つけます。

コードをコピー
constのペット= [
  {タイプ: '犬'、名称: 'マックス'}、
  {タイプ: '猫'、名称: 'カール'}、
  {タイプ: '犬'、名称: 'トミー'}、
]

関数findDog(名){
  {ため(; I <pets.length ++ I I = 0ましょう)
    IF(ペット[I] .TYPE === '犬' &&ペット[I] .nameの===名){
      ペット[I]を返します。
    }
  }
}
コードをコピー

短縮形:

ペット= pets.find(PET => pet.type === '犬' && pet.name === 'トミー')。
console.log(ペット); // {タイプ: '犬'、名称: 'トミー'}

18.Object [キー]速記

検証関数を考えてみましょう。

コードをコピー
機能検証(値){
  (もし!values.first)
    falseを返します。
  (!values.last)の場合
    falseを返します。
  trueを返します。
}

console.log(検証({最初 'ブルース'、最後: 'ウェイン'}))。//真
コードをコピー

あなたは異なるドメインと検証ルールを想定する必要がある場合、能力は、実行時に確認するための汎用的な関数を書くには?

コードをコピー
//ターゲットバリデーションルール
スキームCONST = {
  最初: {
    必要:真
  }、
  最後:{
    必要:真
  }
}

//一般的な検証機能
CONST検証=(スキーマ、値)=> {
  (スキーマ内のフィールド)のために{
    (スキーマ[フィールド]は.required)場合{
      IF(!値[フィールド]){
        falseを返します。
      }
    }
  }
  trueを返します。
}


console.log(検証(スキーマ、{最初 'ブルース'}))。//偽
console.logは((検証スキーマ、{最初 'ブルース'、最後: 'ウェイン'}))。//真
コードをコピー

今、すべての状況の検証機能の適用各書かれたカスタム検証機能のために必要とされていませんがあります

19.非ビットデュアルオペレーション速記

実施形態は、デュアル非算術演算子の効果的な使用を有します。Math.floor()、その利点をより速く実行することです代わりに使用することができ、あなたはより多くのビット・コンピューティングを学ぶためにこの記事を読むことができます。

Math.floor(4.9)=== 4 //真

短縮形:

本当~~ 4.9 === 4 //

おすすめ

転載: www.cnblogs.com/zd1314/p/11703840.html