1: ES6 とは何ですか? なぜそれを学ぶ必要があるのですか?
ES6 (ECMAScript) は JavaScript の構文仕様であり、JavaScript の重要な部分です。JS の記述方法を指定します。
ES6 を学ぶ理由:
(1) ES6 バージョンには最も多くの変更があり、マイルストーンです。
(2) ES6 には多くの新しい文法機能が追加され、プログラミングがより簡単かつ効率的になりました。
(3) ES6 はフロントエンド開発のトレンドであり、就職に必要なスキルです。
2: let、var、constの違い。
(1) var で宣言した変数はグローバルスコープや関数スコープを持ち、宣言前から使用でき、繰り返し定義・代入が可能で、変数昇格という現象があります。
(2) let を使用して宣言された変数はブロック レベルのスコープを持ち、最初に宣言されてから使用されます。繰り返し定義することはできませんが、複数回割り当てることができます。変数の昇格はありません。
(3) const で宣言したものは定数であり、後のコードでは定数の値を変更することはできません。スコープはブロック レベルのスコープであり、最初に宣言されてから使用されます。繰り返し定義することはできません。基本データ型を複数回割り当てることはできません。また、変数の昇格はありません。
(4) let および const を使用して宣言された変数は、トップレベルのオブジェクトに属さないため、未定義を返します。
3: オブジェクトを分解する方法、例を挙げてください。
オブジェクトの構造化の最も基本的な使用法は、オブジェクトからプロパティ キーの値を取得することです。まず同じ名前の属性を見つけて、それを対応する変数に割り当てます。
たとえば、オブジェクト「人物」を定義すると、彼には本名と年齢という 2 つの属性があります。
人物 = {本名:「張三」、年齢: 20};
let {realname:myrealname,age,height=180} = Person; //重命名
console.log(myrealname,age,height); // チャン サン 20 180
オブジェクトのプロパティは順序どおりではありません。正しい値を取得するには、変数の名前がプロパティと同じである必要があります。そうでない場合、構造化が失敗した場合、変数は未定義になります。
4: for...in と for...of の違いは何ですか?
for in はインデックスを走査します (列挙可能な型を走査します)。
for of は配列の値を走査します (走査可能な iterable にはイテレータ インターフェイスがあります)。
5: アロー関数のこれと通常の関数のこれの違いは何ですか?
違い：
(1) 通常関数の this の点は呼び出し元、アロー関数の this の点は親関数です。
(2) アロー関数の this は宣言で定義されますが、通常の関数の this は呼び出し時に定義されます。
(3) アロー関数では方向を変更できず、通常の関数関数のみが方向を変更できます。
6: ES6 でのテンプレート文字列の使用方法の例を教えてください。
関数デモ(){
「終了」を返します。
}
es6 = "es6!" とします。
let str = `hello,${es6},${demo()}`;
コンソール.ログ(文字列); // こんにちは、es6!、終了
7: Array の拡張メソッドマップとフィルタは同一点と相違点があります。
類似点: どちらも空の配列をチェックせず、元の配列を変更しません。
違い: map() メソッドは新しい配列を返し、配列内の要素は関数の呼び出し後に元の配列要素によって処理された値です。
filter() メソッドは、条件を満たす指定された配列内のすべての要素をチェックすることによって要素がチェックされる新しい配列を作成します。
8: 次の図の出力は何ですか?またその理由は何ですか?
出力結果は10です。
変数 i は var によって宣言され、グローバル変数です。スコープは for ループ全体です。各ループで i が変更されると、a の各 i の値も同期して変更されます。ループが終了すると、i の値は 10 になります。
9: 以下の図の出力結果は何ですか?またその理由は何ですか?
出力は20です。
まず、obj を介して fn 関数を呼び出します。fn 関数内の this ポイントは obj です。setTimeout のアロー関数は this の方向を変更しないため、ここでは this.a === obj.a となり、出力結果は obj 内の a の値になります。
10: 残りのパラメータに関する次の図の結果は何ですか? なぜ？
残りのパラメータは最後の仮パラメータでなければならないため、結果はエラーになります。それ以外の場合は、エラーが報告されます。
2: 操作に関する質問
1: 配列を使用して学生のグループを保存します。各学生の属性には、名前、スコア、ページ上の入力ボックスからの名前とスコアが含まれます。クエリ ボタンをクリックして、スコアが 60 を超えるすべての学生を選択します。効果は図の通り：（30点）
コードは以下のように表示されます。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 1：用数组保存一组学生，每个学生的属性包含，姓名，分数，姓名和分数从页面input框获取，点击查询按钮，刷选出分数大于60的所有同学。效果如图：(30分) -->
<div>
姓名: <input placeholder="输入学生姓名" type="text" id="uname" value="" />
分数: <input placeholder="输入学生分数" type="text" id="score" value="" />
<button>添加</button>
</div>
<p>学生信息:</p>
<ul class="persons"></ul>
<input type="button" value="查找及格的学生" id="search" />
<p>及格学生如下:</p>
<ul class="pass"></ul>
<script>
let sName = document.querySelector('#uname');
let sScore = document.querySelector('#score');
let btn = document.querySelector('button');
let ul1 = document.querySelector('.persons');
let search = document.querySelector('#search');
let ul2 = document.querySelector('.pass');
let arr = [];
btn.addEventListener('click', function () {
let obj = { uname: sName.value, score: sScore.value };
arr.push(obj);
sName.value = '';
sScore.value = '';
let str = '';
arr.forEach(item => {
const { uname, score } = item;
str = str + `<li>姓名：${uname} 分数：${score}</li>`;
})
ul1.innerHTML = str;
})
search.addEventListener('click', function () {
let newArr = arr.filter(item => {
return item.score >= 60;
})
let str = '';
newArr.forEach(item => {
const { uname, score } = item;
str = str + `<li>姓名：${uname} 分数：${score}</li>`;
})
ul2.innerHTML = str;
})
</script>
</body>
</html>効果：
2: 配列のセット内の最小値を計算します。例: const arr = [3,4,10,1,9]; (20 点)
