ES 6よくある面接問題のまとめ


ES 6よくある面接問題のまとめ
前言
今日はブロガーがES 6のよくある面接問題を共有します.噴霧することを喜ばないでください.異議があれば、討論を歓迎します.
開始
1.es5es6の違いは、知っているes6と言ってください.ECMAScript5、すなわちES5は、ECMAScriptの第5回の改訂であり、2009年に標準化が完了した.ECMAScript6、すなわちES6は、ECMAScriptの第6回の改訂であり、2015年に完成したもので、ES2015とも呼ばれる.ES6ES5に続く改善であり、ES5に比べてより簡潔であり、開発効率が向上した.
ES 6に追加されたいくつかの特性
  • let宣言変数とconst宣言定数は、両方のブロックレベルの機能領域ES 5にブロックレベルの機能領域がないということであり、varに変数がアップグレードされ、letで使用される変数は必ず声明を出さなければなりません.
  • 矢印関数ES 6の関数定義は、キーワードfunction()を使わずに()=>を利用して定義された
  • である.
  • テンプレート文字列テンプレート文字列は拡張版の文字列であり、逆引用符(`)で識別され、通常の文字列として使用されてもよく、複数行の文字列
  • を定義するために使用されてもよい.
  • デフォーカシングES 6は、一定のパターンに従って、配列とオブジェクトから値を抽出し、変数に対して価値を付与することを可能にする
  • .
  • for ofサイクルfor...ofサイクルは、配列、Set、Map構造、いくつかの類似配列のオブジェクト、オブジェクト、および文字列
  • を巡回することができます.
  • import、exportがエクスポートES 6規格を導入する中、Js原生サポートモジュール(module).JSコードを異なる機能の小さい塊に分割してモジュール化し、異なる機能のコードをそれぞれ異なるファイルに記入し、各モジュールは共通インターフェース部分を導出し、モジュールの導入によって他のところで
  • を使用することができる.
  • setデータ構造Setデータ構造、類似配列.すべてのデータは一意で、重複した値はありません.それ自体は構造関数です.
  • …展開演算子は、行列またはオブジェクト内の値を展開することができます.複数の値を1つの変数
  • として収集することもできる.
  • 修飾器@decoratorは、クラスまたはその結果として方法を変更するための関数である.修飾器の本質はコンパイル時に実行される関数
  • です.
  • クラスの継承ES 6はES 5のようにプロトタイプチェーンで継承されなくなり、クラスという概念を導入する
  • です.
  • async、awaitはasyncc/awaitを使って、promiseを組み合わせて、形のように同期するコードを編纂することによって非同期の流れを処理することができます.コードの簡潔性と可読性を高めます.一つのfunctionは非同期です.awaitは一つの非同期の方法の実行が完了するのを待つために使われます.
  • promisePromiseは、従来の解決策(コールバック関数とイベント)より合理的で強力な解決策である.
  • Symbolは基本タイプです.Symbolは、smbol関数を呼び出すことによって生成され、この関数が返したsmbolは唯一の
  • であるオプションの名前パラメータを受信する.
  • Proxyエージェントは、プロキシ(Proxy)がオブジェクトの操作を傍受し、対応することができます.
    2.varletconstの間の違い
    var宣言変数は繰り返し声明できますが、letは繰り返し声明できません.
    varはブロックレベルに制限されず、letはブロックレベルに制限されている.
    varはwindowと映写して、letはwindowと映写しません.
    varは声明の上で変数にアクセスできますが、letはデッドゾーンがあり、声明の上で変数にアクセスするとエラーが発生します.
    const宣言後は必ず値を付けます.そうでないとエラーが発生します.
    constは可変量を定義しないので、変更すればエラーが発生します.
    constとletは同じです.windowとは映写できません.ブロックレベルの機能領域をサポートします.声明の上で変数にアクセスするとエラーが発生します.
    3.矢印関数を使うには何に注意すればいいですか?
  • は矢印関数を使いました.thisはwindowを指すのではなく、父のレベルです.
  • です.
  • アーグメンントオブジェクト
  • は使用できません.
  • は構造関数としては使えません.つまりnewコマンドは使えません.そうでないとエラーが発生します.
  • はyield命令を使用してはいけないので、矢印関数はGenerator関数
  • としては使用できません.
    4.ES6のテンプレート文字列にはどのような新しい特性がありますか?そして、クラステンプレート文字列の機能を実現します.
    基本的な文字列の書式設定.表式を文字列に埋め込んでスティッチングします.${}で定義する
    ES 5では、バックスラッシュ()によって複数行の文字列または文字列の1行を綴り合わせます.ES 6アンチクォーテーション(``)で解決できます.
    クラステンプレート文字列の機能
    et name = 'sunny';
    let age = 21;
    let str = '  ,${name}    ${age}  '
    str = str.replace(/\$\{([^}]*)\}/g,function(){
         return eval(arguments[1]);
       })
    console.log(str);//  ,sunny    21  
    
    5.SetMapの違いを紹介してください.
    アプリケーションシーンセットはデータの再構築に使用され、Mapはデータの保存に使用されます.
    セット:
  • メンバーは、
  • を繰り返すことができません.
  • キーの値だけがキー名がなく、配列
  • のようなものです.
  • は巡回することができて、方法はaddがあって、delete、has
  • Map:
  • は本質的に健値ペアの集合であり、類似の集合
  • である.
  • は、巡回することができ、様々なデータフォーマットと
  • を変換することができます.
    6.ECMAScript 6はどうしてclassと書くのですか?
    ES 6のクラスは文法飴として見られます.ほとんどの機能ES 5はできます.新しいクラスの書き方は対象の原型の書き方をより明確にし、対象に向けてプログラミングする文法のようです.
    //   
    class Point { 
      constructor(x,y) { 
          //    
           this.x = x; //this         
           this.y = y; 
      } toString() {
           return '(' + this.x + ',' + this.y + ')'; 
      }
    }
    
    7.classコンストラクタは同期実行ですか?それとも非同期実行ですか?Promise構築関数は同期して実行され、then方法は非同期的に実行される.
    8.promisethensetTimeoutの違い
    イベントサイクルはPromiseAsync/Awaitに分かれている. のコールバック関数は、スタックがクリアされた後に実行されるまでマクロタスクキューに入れられる. の中のコールバック関数はsetTimeoutpromise.thenに置いて、マクロタスクの中の同期コードが実行されたら実行します. 関数は、関数内に非同期的な方法がある可能性があると表しています.awaitの後に、表式があります. 方法が実行されると、asyncに遭遇したら、すぐに式を実行し、表式の後のコードをマイクロタスクキューに入れて、実行スタックを空けて同期コードを先に実行させる.
    9.asyncにはいくつかの状態がありますが、いつawaitに入りますか?
    三つの状態:pending、fulfilled、reject
    二つの過程:padding->fulfilled、padding->rejectid
    pendingがreject dの時、catchに入ります.
    10.下記の出力結果はいくらですか?
    const promise = new Promise((resolve, reject) => {
        console.log(2);
        resolve();
        console.log(333);
    })
    
    
    promise.then(() => {
        console.log(666);
    })
    
    
    console.log(888);
    
    promiseは、新規作成後すぐに実行されるので、先に2,333を出力し、catch内部のコードは、イベントサイクルの最後の時点で実行されるので、888を出力し続け、最後に666を出力します.
    11.構造割当値を使用して、2つの変数の値の交換を実現する.
    let a = 1;let b = 2;
    [a,b] = [b,a];
    
    12.1つのオブジェクトを設計し、キーのタイプは少なくとも1つのPromiseタイプを含み、すべてのPromise.then()を巡回することを実現する.
    let name = Symbol('name');
    let product = {
        [name] : "   ",    
        "price" : 1999
    };
    Reflect.ownKeys(product);
    
    13.下のsymbol構造、プリントしたkeyはいくらですか?
    let s = newSet();
    s.add([1]);s.add([1]);
    console.log(s.size);
    
    3はい、わかりました
    2つの配列[1]は同じ値ではなく、それぞれ定義された配列はメモリ内でそれぞれ異なる記憶アドレスに対応していますので、同じ値でもSet構造に記憶できるわけではないので、sizeは2です.
    14.Setにおけるsize Promiseの処理にはどんな違いがありますか?
    rejectは異常を出すために使うもので、catchは異常を処理するために使うものです.
    rejectはPromiseの方法で、catchはPromiseの例の方法です.
    rejectの後のものはきっとthenの中の第二回に入って、もしthenの中で第二回を書いていないならば、catchに入ります.
    ネットの異常(たとえばネットを切断します)は直接にcatchに入ってthenの第二のフィードバックに入らないです.
    15.rejectを使って、一つのcatchを手書きします.
      //    Promise  
      class Promise{
        constructor(executer){//    constructor       
          this.status = 'pending';//      pending
          this.value = undefined//      undefined
          this.reason = undefined//      undefined
          //     pending      
          let resolveFn = value =>{
            //         resolve  
            if(this.status == pending){
              this.status = 'resolve';
              this.value = value;
            }
          }
          //         reject  
          let rejectFn = reason =>{
            if(this.status == pending){
              this.status = 'reject';
              this.reason = reason;
            }
          }    
          try{
            // resolve reject         executer
            executer(resolve,reject);
          }catch(e){
            reject(e);//     catch
          }
        }
        then(onFufilled,onReject){
          //        onFufilled
          if(this.status = 'resolve'){
            onFufilled(this.value);
          }
          //        onReject
          if(this.status = 'reject'){
            onReject(this.reason);
          }
        }
      }
    
    16.classの使い方
    let arr = [12,43,23,43,68,12];
    let item = [...new Set(arr)];
    console.log(item);//[12, 43, 23, 68]
    
    17.以下のpromiseSet 形式に循環する.
    let arr = [11,22,33,44,55];
    let sum = 0;
    for(let i=0;i
    答え:
    let arr = [11,22,33,44,55];
    let sum = 0;
    for(value of arr){
        sum += value;
    }
    
    18.for及びfor ofの利点を理解する.
    async awaitは非同期を解決するためのもので、async関数はGenerator関数の文法飴です.
    キーワードasyncを使って表します.関数内部でawaitを使って非同期を表します.
    async関数はPromiseオブジェクトを返します.thenメソッドを使ってコールバック関数を追加できます.
    関数が実行されると、awaitに出会うと先に戻り、非同期の操作が完了するまで関数の後の文を実行します.
    asyncはGeneratorより優勢です.
  • は、アクチュエータを内蔵する.Generator関数の実行はアクチュエータに依存しなければならないが、Aysnc関数はアクチュエータを持参しており、呼び出しは一般関数の呼び出しと同じ
  • である.
  • より良い意味.asyncとawaitは*とyieldよりもっと意味化されています.
  • より広い適用性.yield命令の後はThunk関数またはPromiseオブジェクトしかできません.async関数のawaitの後はPromiseでも良いし、元のタイプの値
  • でもいいです.
  • の戻り値はPromiseです.async関数はPromiseオブジェクトを返します.Generator関数よりも返したIteratorオブジェクトが便利です.直接にthen()メソッドを使って
  • を呼び出すことができます.
    19.async/awaitGeneratorforEachの3つの違い
  • forEachは、配列
  • を巡回するために使用されます.
  • for inは一般的にオブジェクトまたはjson
  • を巡回するために使用される.
  • for of配列オブジェクトはすべて巡回できます.オブジェクトを巡回するにはObject.keysを通過する必要があります.
  • for inはkeyを循環し、for ofはvalue
  • を循環する.
    20.for inの導入導出モジュール
    importキーでインポート
    //      
    import {sum} from "./example.js"
    //     
    import {sum,multiply,time} from "./exportExample.js"
    //        
    import * as example from "./exportExample.js"
    
    エクスポート
    //   export      ,         
    export var firstName = 'Chen';
    export var lastName = 'Sunny';
    export var year = 1998;
    //                   
    var firstName = 'Chen';
    var lastName = 'Sunny';
    var year = 1998;
    export {firstName, lastName, year};
    //  export default ,   import          
    let bosh = function crs(){}
    export default bosh;
    import crc from 'crc';
    //   export default ,   import         
    let bosh = function crs(){}
    export bosh;
    import {crc} from 'crc';
    
    ここまでES 6のよくある面接問題をまとめます.皆さん、早く行ってみてください.
    最後に
  • もっと参考にしてください.素晴らしいブログはここをご覧ください.
  • ブロガーが好きな子は注目して、いいね、更新し続けてください.