ES6 - 練習問題

目次

1: 短答式の質問

1: Symbol とは何ですか?またその機能は何ですか?

2: セットとマップとは何ですか? 効果は何ですか?

3: イテレータとは何ですか?

4: for...in と for...of の違いは何ですか?

5: モジュール、エクスポート、インポートとは何ですか?またその機能は何ですか?

6: では、Promise は同期ですか、それとも非同期ですか。実行メカニズムを簡単に説明します。

7: 次のコードの出力結果は何ですか?

8: 以下の図の出力結果は何ですか?

9: クラスでの super の用途は何ですか?

10: 浅いコピーと深いコピーとは何ですか?

2: 操作に関する質問

1: Promise オブジェクトをカプセル化する関数。非同期をシミュレートするために setTimeout と組み合わせます。渡された偶数が返された場合 (3 秒後)、渡された値は正しく、奇数または他のクラスが渡された場合、渡された値はエラーになります。返されます。

2: 以下の形式の生徒の得点のセットがあり、合格した生徒を選別し、合格した生徒の得点の合計を計算します。(配列はコピーせずにこの形式で書き込むことができます)


1: 短答式の質問

1: Symbol とは何ですか?またその機能は何ですか?

回答: シンボルは文字列に似たデータ型です。

役割: オブジェクト属性名の競合を防止します。

           プライベートプロパティを模擬する

           非反復定数を定義する

2: セットとマップとは何ですか? 効果は何ですか?

回答: Set: 配列に似ていますが、メンバーの値は一意であり、重複する値はありません。

マップ: JavaScript オブジェクト (オブジェクト)。本質的にはキーと値のペア (ハッシュ構造) のコレクションですが、従来は文字列のみがキーとして使用できました。マップのキーは文字列に限定されず、オブジェクトをキーと呼ぶこともできます。

機能: データの再編成とデータの保存に使用されます。

3: イテレータとは何ですか?

回答: Iterator は反復子です。これは、さまざまなデータ構造に対する統合アクセス メカニズムを提供するインターフェイスです。イテレータ インターフェイスがデプロイされている限り、どのデータ構造でもトラバーサル操作を完了できます。ES6 では、...of 用の新しいトラバーサル メソッドが追加されています。

ネイティブ イテレータ インターフェイスを備えたデータには、配列、引数、セット、マップ、文字列、NodeList が含まれます。

4: for...in と for...of の違いは何ですか?

答え: in はインデックスを走査します (列挙可能な型を走査します)。

for of は配列の値を走査します (走査可能な iterable にはイテレータ インターフェイスがあります)。

5: モジュール、エクスポート、インポートとは何ですか?またその機能は何ですか?

回答: モジュールは js で ES6 インポートを使用する必要があります。<script type="module"></script>、スクリプトのタイプはモジュールとして定義されます。

エクスポート エクスポートされるコードを指定します。エクスポート コマンドはモジュール内のどこにでも使用できますが、モジュールの最上位に存在する必要があります。

import はモジュール関数をインポートします。import は読み取り専用の参照のみをインポートし、その参照に従ってスクリプトが実行されてモジュールに移動して値を取得するまで待機します。これが、インポートをオンデマンドでロードできる理由です。

6: では、Promise は同期ですか、それとも非同期ですか。実行メカニズムを簡単に説明します。

回答: Promise コンストラクターは同期的に実行され、then メソッドは非同期的に実行されます。

then() は Promise のインスタンスメソッドで、Promise の状態が変化した後、成功か失敗かの値を取得して記述することができます。

7: 次のコードの出力結果は何ですか?

結果は 1243 です。

8: 以下の図の出力結果は何ですか?

出力は2です。

9: クラスでの super の用途は何ですか?

回答: ES6 では、サブクラスがconstructor() メソッドで super() を呼び出す必要があると規定しています。そうしないと、エラーが報告されます。スーパー メソッドは、このオブジェクトの親クラスを作成するために使用されます。

10: 浅いコピーと深いコピーとは何ですか?

回答: 浅いコピー: スタック アドレスをコピーします。単純なデータ型の変更は相互に影響しませんが、参照データ型のヒープ アドレスは同じであるため、変更は相互に影響します。

ディープコピー: スタックアドレスだけでなくヒープアドレスもコピーします。基本データ型と参照データ型の変更は元のデータには影響しません。

2: 操作に関する質問

1: Promise オブジェクトをカプセル化する関数。非同期をシミュレートするために setTimeout と組み合わせます。渡された偶数が返された場合 (3 秒後)、渡された値は正しく、奇数または他のクラスが渡された場合、渡された値はエラーになります。返されます。

        let num = prompt('输入一个数字:');
        const MyPormise = new Promise((resolve, reject) => {
            setTimeout(() => {
                if (num % 2 == 0) {
                    resolve('传入正确');
                } else {
                    reject('传入错误');
                }
            }, 3000)
        });
        MyPormise.then(
            resolve => console.log(resolve),
            reject => console.log(reject)
        )

2: 以下の形式の生徒の得点のセットがあり、合格した生徒を選別し、合格した生徒の得点の合計を計算します。(配列はコピーせずにこの形式で書き込むことができます)

const 人 = [

   {本名:「張三 1」、スコア:60}、

   {本名:「張三 2」、スコア:20}、

   {本名:「張三 3」、スコア:90}、

……

 <ul id="scores"></ul>
    <hr>
    <input type="button" value="查找及格的学生" id="search" />
    <p>及格学生如下:</p>
    <ul id="pass"></ul>

    <script>
        let sScore = document.querySelector('#scores');
        let search = document.querySelector('#search');
        let pass = document.querySelector('#pass');
        const scores = [
            { realname: "张三", score: 40 },
            { realname: "李四", score: 60 },
            { realname: "王五", score: 90 },
            { realname: "赵六", score: 50 },
        ];

        let str = "";
        for (var i = 0; i < scores.length; i++) {
            str = str + `<li>姓名:${scores[i].realname},分数:${scores[i].score}</li>`;
        }
        sScore.innerHTML = str;

        search.addEventListener('click', function () {
            let newArr = scores.filter(item => {
                return item.score >= 60;
            })

            let str = '';
            newArr.forEach(item => {
                const { realname, score } = item;
                str = str + `<li>姓名:${realname}  分数:${score}</li>`;
            })
            pass.innerHTML = str;
            console.log("及格学生分数总和为"+newArr.reduce((sum, item) => sum + item.score, 0));
        })
       
    </script>

おすすめ

転載: blog.csdn.net/m0_46461853/article/details/125929387