面接官:es 6の知識を知っていますか.

前言
皆さん、こんにちは.青団を食べましたか.作者はあんこ党.また、著者の面接シリーズの3番目の文章です.
この比較の基礎はes 6の新しい文法を議論している.
では、始めましょう.
let constのコマンド

//    
console.log(a);  // undefined
console.log(b);  //   
console.log(c);  //   
var a = 1;
let b = 2;
const c = 3;

//     
console.log(window.a) //  1 

//     
let b  = 200;//  

実はここでは簡単に理解できますが、varは変数を上げることができます.letとconstは宣言してから呼び出す必要があります.letとconstにとって、ここは一時的なデッドゾーンです.
ここの知識点は覚えやすいので、次の表を見ればいいです.
null
変数の移動
繰り返し宣言
グローバル宣言
var
yes
yes
yes
let
no
no
no
const
no
no
no
例えば、著者自身がこの問題に対する解答は以下の通りである.

letとconstは変数を昇格させることができず、変数宣言前に呼び出すと一時的なデッドゾーンが発生し、エラーが報告されます.

宣言後もwindow(ブラウザ)とglobal(node)に縛られませんが、varはできます.

は、宣言を繰り返すことができず、constは定数であり、値を変更することはできません.

はいれつ
配列は、仕事でよく使う方法をいくつか説明します.

let array = [1,2,3,4,5];
//map
let mapResult = array.map(num => num + 1);
console.log(array); // [ 1, 2, 3, 4, 5 ]
console.log(mapResult);// [ 2, 3, 4, 5, 6 ]

//filter
let filterResult = array.filter(num => num === 4);
console.log(array); // [ 1, 2, 3, 4, 5 ]
console.log(filterResult); // [4]

// ...
let functionResult = (...array) => console.log(arguments); // 1,2,3,4,5

map:map関数は配列の各要素を循環し、削除して変更した後、新しい配列にドロップします.
filter:filter関数もループ配列の各要素であり、後続のコードは真の要素を新しい配列にドロップします.
...: これはよく理解されていますが、実は配列を分割して、すべての要素を一つ一つ伝えます.
最も一般的なes 6の重面試験問題のように:

let newArray = Array.from(...new Set(array))

例えば、著者自身がこの問題に対する解答は以下の通りである.
いくつかの配列方法の使用方法を,パラメータに入力して説明すればよい.
また、手書きでいくつかの方法を実現することもできますが、ここでは拡張しません.
Objectの新規メソッド
Object.assign()
この新しい方法の役割は、オブジェクトの列挙要素を最初のパラメータオブジェクトにコピーすることです.一般的には浅いコピーに使われています.

let a = {
        url: '996'
}
let b  = {
        name: '  ',
        url: a
}

let c = Object.assign({}, b)
a.url = a.url + '.icu'
console.log(c) // 996.icu

メソッドの最初のパラメータはソースオブジェクトで、後のパラメータはすべて要素を最初のオブジェクトにドロップするために使用されます.
コードのように、cの要素urlはやはりa.urlのメモリアドレスを指して、私はa.urlを修正して、それも変わりました.
Object.keys() 、Object.values()とObject.entries()
このいくつかの方法は名前を見て何を返すことができるか分かりますが、実はes 6の前に、これらの要素を手に入れるには自分で手でforinを書いてから出す必要があります.素晴らしい文法糖ですね.

let a = {
        work: '996',
        sick: 'icu' 
}

console.log(Object.keys(a)); //[ 'work', 'sick' ]
console.log(Object.values(a)); // [ '996', 'icu' ]
console.log(Object.entries(a)); // [ '996', 'icu' ]

例えば、著者自身がこの問題に対する解答は以下の通りである.

得意だと思う方法を話して、それらを紹介して一般的に何に使うことができて、もちろんあなたも手書きで波を打つことができます!

assignメソッドを引き出して、浅いコピーと深いコピーに対する理解を話したほうがいいです.

Objectの常用新手法についてはここまで紹介しますが、詳しくはチェン先生のes 6標準入門を見ることができますよ.
Class
Es 6に新たに追加されたClassも文法糖であり、jsの底層にはclassの概念はなく、原型継承のパッケージでもある.

class Fruit {
        constructor(props) {
                this.props = props;
                this.name = 'fruit';
        }
        callMyName() {
                console.log(this.name);
        }
}
class Apple extends Fruit { // extends           
        constructor(props) {
                //  super             
                //  Fruit.call(this, props)
                super(props)
        }
        callMyApple() {
                console.log('    ！')
        }
}

let a = new Apple('   ')
a.callMyName(); //fruit
a.callMyApple(); //     ！

コード注釈を見ても分かりやすく、プロトタイプ継承のパッケージですが、classの書き方は結局コードやメンテナンスクラスを表示しやすいです.
例えば、著者自身がこの問題に対する解答は以下の通りである.

面接の大物、classのいくつかの使い方、super、constructorなどを教えます.

es 6のclassがなければ、どうやって実現しますか.

は,組合せ継承,寄生継承などを拡張できる.

さて、この話はもう終わりました.
これはes 6に関する3番目の文章です.
面接シリーズ第一編:面接官:Callback Hell(コールバック地獄)を知っていますか.
面接シリーズ第二編:面接官:reactとvueは何か違いがありますか.
もしあなたが収穫あるいは疑問があるならば下で評論して、称賛を求めます!ここまで見てくれてありがとう.
転載先:https://juejin.im/post/5ca84b3de51d454f9528e276