フロントエンドの面接の質問 - JavaScript

Web フロントエンドの面接での質問 JavaScript の記事

1. JavaScriptのデータ型(8項目)とは何ですか?

ES5 には、Number、String、Boolean、Unknown、Null、Object の 6 つの型がありますが、
ES6 では
Google 6 バージョンのシンボル bigInt が追加されました: 大きな整数の安全な保存と操作を指します。

2. JSの基本型と参照型の違い

基本データ型:
1. 基本型の変数はスタック領域に格納されます
2. 基本型の比較は値の比較です
3. 基本型の代入 代入操作後の 2 つの変数は影響を受けない
参照データ型
です1. 参照型がスタック メモリに保存するのは、実際にはヒープ メモリ内のオブジェクトの参照アドレスです 2.参照
型の比較は参照アドレスの比較です 3. 参照型
の割り当て参照型は実際にはスタック領域に格納された参照アドレスの割り当てであるため、2 つの変数は同じオブジェクトを指しており、操作は相互に影響します。

3. ES6 の新機能は何ですか?

1. 変数宣言: let と const の追加
2. テンプレート文字列
3. アロー関数
4. 関数パラメータのデフォルト値
5. 代入の構造化
6. for…of と for…in
7. class キーワードが導入されています。
8. モジュールのインポート、エクスポート (ES6 のクラス)
9. Promise

4. var、let、constの違い

1. var
   ① var で定義された変数にはブロックの概念がなく、ブロックを越えてアクセスできます。
   ②var で定義された変数は変更可能ですが、初期化されていない場合は undefine が出力され、エラーにはなりません。
   ③誤りのない繰り返しの記述は修正とみなされます。
2. let①で定義した変数
   はブロックスコープ内でのみアクセスでき、ブロックを越えてアクセスすることはできませんが、スコープチェーンには影響しません。
   ②変数は繰り返し宣言できません。
3. const
   ① const で定義された変数は、一度定義すると変更できません。つまり、const で宣言された変数は定数です。使用時に初期化する (つまり、割り当てる) 必要があり、ブロック スコープ内でのみアクセスできます。
   ②const宣言は値への読み取り専用参照を作成しますが、変数識別子の再代入はできません。したがって、オブジェクトのプロパティの変更や配列要素の変更によって const エラーが発生することはありません。
   ③オブジェクト型を宣言するときは、オブジェクトを誤って変更することを避けるために、通常、const が使用されます。

回答テンプレート
まず、var、let、const はいずれも変数を宣言するためのキーワードですが、これらの違いは次のとおりです:
1. var で定義された変数には宣言昇格がある
2. var で宣言された変数は繰り返し宣言できるが、let は宣言できない繰り返し宣言
3.let と const は最初に定義してから使用する必要があります。繰り返し定義することはできません。ブロック レベルのスコープと一時的なデッド ゾーンがあります。 4.
const 宣言後、初期値を代入する必要があります。そうでない場合はエラーが発生します。変数名は大文字にするのが通例であり、const で定義された変数は読み取り専用の変数であり、変更できません。

5. 配列から重複を削除する方法

方法 1: トラバース比較

var arr = [5, 5, 7, 7, 4, 9, 3, 1, 3];
    var arr1 = [];
    for (var i = 0; i < arr.length; i++) {
    
    
        if (arr1.indexOf(arr[i]) == -1) {
    
    
            arr1.push(arr[i]);
        }
    }
    console.log(arr1);

方法 2: 設定する

var arr = [5, 5, 7, 7, 4, 9, 3, 1, 3];
var newarr = [... new Set(arr)]
console.log(newarr);

方法 3:

var arr = [5, 5, 7, 7, 4, 9, 3, 1, 3];
var newarr = Array.from( new Set(arr))
console.log(newarr);

6. js のデータ型を決定するためのいくつかの実用的な方法

typeof

typeof は次の結果のみを返しますnumber，string，boolean，object，undfined，function
: typeof が null を決定する場合、戻り値は object です。
アプリケーションの種類を決定する場合、戻り値は object です。オブジェクトの種類を特定することはできません。したがって、オブジェクト、配列、null を区別したい場合は、単純に typeof を使用するだけでは機能しません。

instanceof:instanceof は、オブジェクトが別の関数によって構築されたかどうかを判断するために使用されます。

Instanceof 演算子は typeof 演算子に似ており、処理されるオブジェクトの種類を識別するために使用されます。typeof メソッドとは異なり、instanceof メソッドでは、開発者はオブジェクトが特定の型であることを明示的に確認する必要があります。

var simpleStr = "This is a simple string"; 
var myString = new String();
var newStr = new String("String created with constructor");
var myDate = new Date();
var myObj = {
    
    };
var myNonObj = Object.create(null);

// 返回 false, simpleStr 并不是对象
simpleStr instanceof String;
// 返回 true
myString instanceof String;
// 返回 true
newStr instanceof String;
// 返回 true
myString instanceof Object;
// 返回 true
myObj instanceof Object;
// 返回 true
({
    
    }) instanceof Object;
// 返回 false, 一种创建非 Object 实例的对象的方法
myNonObj instanceof Object;
// 返回 false
myString instanceof Date;
// 返回 true
myDate instanceof Date;
// 返回 true
myDate instanceof Object;
// 返回 false
myDate instanceof String; 

Object.prototype.toString.call()

    Object.prototype.toString.call(null);// ”[object Null]”
    Object.prototype.toString.call(undefined);// ”[object Undefined]”
    Object.prototype.toString.call(“abc”);// ”[object String]”
    Object.prototype.toString.call(123);// ”[object Number]”
    Object.prototype.toString.call(true);// ”[object Boolean]”

7. アロー関数を使用する理由は何ですか? どのような問題が解決されましたか?

アロー関数は匿名関数であり、ES5 匿名関数の構文糖体であり、独自の this および引数を持ちません。その利点は:
(
1) 簡潔な構文、
(2) 暗黙的な戻りです。たとえば、次のコードは、 return してコードを 1 行に移動し、コード量を削減します
(3) this のポインティングの問題を解決します. ネイティブ記述メソッド this は呼び出し元をポイントし、アロー関数 this は定義時にオブジェクトにバインドされます。ネストされたオブジェクトがある場合、これはオブジェクトの最も近いレイヤーにバインドされます。

8. アロー関数と通常の関数の違い

アロー関数 this はウィンドウを指しませんが、親 (ポインターは変数) を指します
。アロー関数は、独自の this を持たず、インスタンス化できないため、コンストラクターとして使用できません。
アロー関数には独自の this がないため、アロー関数内に引数オブジェクトはありません。
このポインタはバインドを通じて変更でき、通常の関数は適用および呼び出しを通じてこのポインタを変更できます。

9. 呼び出し、適用、バインドの違い

call、apply、bind の機能は、this のポインタ、つまり関数実行時のコンテキストを変更することです。Apply は 2 つのパラメータを受け取ります。最初のパラメータは
thisのポインタで、2 番目のパラメータは受け入れられたパラメータです配列の形式で渡される関数によって。this ポインタを変更すると、元の関数がすぐに実行され、メソッドは this ポインタを一時的に 1 回だけ変更します。最初のパラメータが Null または未定義の場合、デフォルトのポイントは window
fn1.apply(想要将this指向哪里, [函数实参1, 函数实参2]);
callです。これは apply の使用法とよく似ています。違いは、2 番目のパラメータが配列ではなくパラメータ リストであることです。bind メソッドは新しい関数を作成し
fn1.call(想要将this指向哪里, 函数实参1, 函数实参2);
ます。この新しい関数が呼び出されると、 this は指定された値に設定され、パラメータ リストの最初のいくつかの項目は、作成時に指定されたパラメータ シーケンスに設定されます。

10. これは問題を示しています

まず、これは関数の組み込みオブジェクトです
1. 通常の関数実行時、内部の this はデフォルトで window になり、strict モードでは未定義になります
2. オブジェクトメソッド () を実行すると、内部の this はオブジェクト自体です
3. コンストラクターは new で実行され、内部の this は新しく作成されたインスタンス オブジェクトを指します
4. アロー関数 アロー関数には独自の this がありません。アロー関数の this はこれは、アロー関数が作成されたときに現在のコンテキストで行われます。現在のコンテキストに this がない場合は、上方向への検索を続行します
5. イベント処理関数: 関数内の this は現在の要素そのものです
6. 関数内の this は call、apply、bind によって強制的に変更され、概要
: Arrow This は関数の作成時にすでに決定されており、arrow 関数自体には this がないため、all などのメソッドを使用して this ポインタを変更することはできず、最初のパラメータは無視されます。通常の関数では、これは実行されるまで指定されません。

11. クロージャについてどのように理解していますか?

コンセプト: 関数の入れ子関数、入れ子の関数はクロージャ関数と呼ばれます。 機能
:関数の本体の外側で、関数のローカル変数が使用され、関数の内部と関数の外部を接続するブリッジになります。
実装: メイン関数 fun で内部変数 (count) と関数 (funzi) を定義し、サブ関数 funzi でメイン関数の内部変数 (count) を使用し、サブ関数 (funzi) を戻り値として使用します。 fun を実行し、グローバル関数を外部に渡します。変数 (f) は (fun) の戻り値にバインドされているため、(funzi) のライフサイクルが延長され、(count) を外部から使用できるようになります。
ガベージコレクション メカニズム、ローカル変数のライフ サイクルの拡張、クロージャの使用 パッケージによりメモリ リークが発生する可能性がある
アプリケーション: クロージャ アプリケーション: 変数のプライベート化、イベントの安定化、イベント スロットリング、部分関数とカリー化、バインドおよびその他の関数

12. localStorage、sessionStorage、Cookie の違いは何ですか?何を保存するために使用しましたか?

違い	クッキー	ローカルストレージ	セッションストレージ
ライフサイクル	設定した Cookie は、ウィンドウまたはブラウザを閉じても、有効期限まで有効です。	データを積極的に削除しない限り、ウィンドウやブラウザを閉じてもデータが消えることはありません。	現在のセッションでのみ有効です
収納サイズ	4kb	5M	5M
データがサーバーとやりとりする仕組み	Cookie データは自動的にサーバーに渡され、サーバーはクライアントに Cookie を書き込むこともできます。	データはサーバーに自動的には送信されず、ローカルにのみ保存されます。	データはサーバーに自動的には送信されず、ローカルにのみ保存されます。
使いやすさ	元の Cookie インターフェイスは使いやすいものではなく、プログラマが自分でカプセル化する必要があります。	生のインターフェイスを受け入れたり、再カプセル化したりして、オブジェクトと配列のサポートを向上させることができます。	生のインターフェイスを受け入れたり、再カプセル化したりして、オブジェクトと配列のサポートを向上させることができます。

13. Cookie をカプセル化する方法

 // 存储Cookie
    setCookie(key, value) {
    
    
        var day = 1;  // 缓存时间
        var path = '/'; // 设置路径，在同一路径下的网页可以共享cookie，路径不同时，不可以访问
        var date = new Date();
        date.setDate(date.getDate() + day); //设置失效时间
        document.cookie = encodeURIComponent(key) + '=' + encodeURIComponent(value) + ';expires=' + date + ';path=' + path;
    },
 // 获取Cookie
    getCookie(key) {
    
    
        var cookieStr = document.cookie;
        var cookieArr = cookieStr.split("; ");
        for (var i = 0; i < cookieArr.length; i++) {
    
    
            var temp = cookieArr[i].split("=");
            if (temp[0] === key) {
    
    
                return decodeURIComponent(temp[1]);
            }
        }
    },
// 删除Cookie
    delCookie(key) {
    
    
        var path = '/'
        CookieUtils.setCookie(key, 1, -1, path);
    },

14. ブラウザ側のイベントループのワークフロー（原理）は何ですか？

1. js には同期タスクと非同期タスクの 2 種類があります
2. 同期タスクは JS エンジンのスレッドで実行され、実行スタックを形成します
3. 実行スタック内の同期タスクが実行中に非同期タスクに遭遇すると、非同期タスクはタスク キューに入れられ、実行を待機します
4. 実行スタック内のタスクが完了した後 (JS エンジンがアイドル状態)、タスク キューから非同期タスクを読み取り、実行スタックに追加して実行します
5メインスレッドは上記の 3 番目のステップを繰り返し続けます。

15. タスクキュー、同期タスク、非同期タスク?

タスクキューには主にマクロタスクとマイクロタスクの2種類があり
、現在の実行スタックが完了するとマイクロタスクキュー内のすべてのイベントが即座に処理され、マクロタスクキューからイベントが取り出されます。同じイベント ループ内では、マイクロタスクは常にマクロタスクの前に実行されます。

同期タスク: メインスレッドでは、実行のためにキューに入れられたタスクの場合、次のタスクは前のタスクが実行された後にのみ実行できます。

非同期タスク: メインスレッドには入らず「タスクキュー」に入るタスクの場合、「タスクキュー」が非同期タスクの実行が可能であることをメインスレッドに通知した場合にのみ、タスクはメインスレッドに入って実行されます。

15. スロットリングと手ぶれ補正

手ぶれ補正機能：Baidu検索など、複数の実行を最後の実行に変換します。

function debounce(func,time){
    
    
	var timerid = null;
	return function(){
    
    
		if(timerid){
    
    
			clearTimeout(timerid );
			timerid = null;
		}
		timerid = setTimeout(()=>{
    
    
			func();
		},time)
	}
}

スロットリング関数: イベントがトリガーされたときに関数を 1 回呼び出すのではなく、複数の実行を時々呼び出す関数に変換します。これにより、リソースの無駄が削減されます。

function throttle(func,time){
    
    
	var timerid = null;//保存定时器id
	return function(){
    
    
		if(!timerid){
    
    //定时器若不存在，则创建定时器
			timerid = setTimeout(()=>{
    
    
				func();
				clearTimeout(timerid );
				timerid = null;
			},time)
		}
	}
}

16. for in と for of の違い、および配列を走査する for in の出力値

for of と for in は両方ともトラバースに使用されるプロパティです。1
. オブジェクト プロパティをループする場合は for...in を使用し、配列をトラバースする場合は for...of を使用することをお勧めします。2.
どちらも配列をループでき、for in 出力も可能です。は配列のインデックス添字であり、for of は配列内の各項目の値を出力します。
3. for in はオブジェクトを走査できますが、for of はオブジェクトを走査できません。

17.mapとforEatchの違い

forEach と map の類似点:

1. どちらも配列内の各項目をループします。
2. 
   forEach メソッドと map メソッドの匿名関数の各実行では、item (現在の各項目)、 index (インデックス値)、arr (元の配列) の3 つのパラメーターがサポートされます。

forEach と mapの違い:

1. Map には戻り値があり、戻り値は Map コールバック関数によって決定されます。
2. forEach() は元の配列を変更します。map() メソッドは新しい配列を取得して返します。
3. forEach()の実行速度<map()の実行速度

18. 配列のメソッドには何がありますか?

配列自体を変更するメソッド: Push、pop、shift、unshift、splice、sort、reverse、
配列自体を変更しないメソッド: concat、join、slice、toString
ES5 配列メソッド: forEach、map、every、some、 filter、reduce、indexOf、lastIndexOf
ES6 配列拡張子: from、of、find、findIndex、includes

19. 文字列のメソッドには何がありますか?

文字列の選択：substr、substring、slice
クエリ文字列：indexOf、includes、search、match
その他：split、replace、charAt、toLowercase、toUppercase、trim

20. フロントエンド タイマーとは何ですか?またその違いは何ですか?

setTimeout() メソッドは、指定されたミリ秒数の経過後に関数または計算式を呼び出すために使用されます。setInterval() メソッドは、ミリ秒単位で指定された周期
で関数を呼び出すか、式を評価します。違い: setInterval() メソッドは、clearInterval() が呼び出されるかウィンドウが閉じられるまで、関数を呼び出し続けます。setInterval() によって返されたID 値は、clearInterval() メソッドのパラメータとして使用できます。

21. 取得と投稿の違いは何ですか?

1.データの受け渡し方法: get は URL または Cookie を使用してパラメータを渡します。そしてpostはBODYにデータを入れます。
2.伝送されるデータの量: get の URI の長さは制限されており、post のデータは非常に大きくなる可能性があります。
3.データのセキュリティ: データはアドレス バーに表示されないため、post は get よりも比較的安全です。

22. httpとhttpsの違い

1. HTTP はハイパーテキスト転送プロトコルです。情報は平文で送信されますが、HTTPS は安全な SSL 暗号化通信プロトコルです。 2. HTTP
と
HTTPS はまったく異なる接続方法を使用し、使用するポートも異なります。前者は 80. 、後者
は443
3. HTTP 接続は非常にシンプルでステートレスです。HTTPS プロトコルは、SSL+HTTP プロトコルをベースに構築されたネットワークプロトコルで、暗号化通信と本人認証が可能で
、HTTP プロトコルよりも安全です。

23. プロトタイプチェーン、プロトタイプ、コンストラクター、インスタンスオブジェクト、プロトタイプオブジェクトの違い

プロトタイプ: JavaScript では、プロトタイプもオブジェクトです。オブジェクトのプロパティの継承は、プロトタイプを通じて実現できます。JavaScript
オブジェクトにはすべて、「プロトタイプ」という内部プロパティが含まれています。このプロパティは、オブジェクトのプロトタイプに対応します。の主な機能プロトタイプは、継承を実装し、オブジェクト
プロトタイプ チェーンを拡張するためです。オブジェクトのプロパティにアクセスするとき、そのプロパティがオブジェクト内に存在しない場合、プロパティを見つけるためにプロトタイプに移動し、
プロトタイプは独自のプロトタイプがある、それで終わりです それを探し続けます、
これが私たちが通常プロトタイプチェーンの概念と呼ぶものです
コンストラクター: コンストラクター、インスタンス オブジェクト、プロトタイプ オブジェクトの間の関係を説明してください?
各コンストラクターはプロトタイプを指すことができますオブジェクトはプロトタイプを介して渡され、プロトタイプ オブジェクトはコンストラクターを介してコンストラクターをポイントし、インスタンス オブジェクトは __ proto__ を介してプロトタイプ オブジェクトをポイントします。

24. JavaScript で継承を実装するための解決策は何ですか?

1. プロトタイプチェーン継承: プロトタイプオブジェクトによる継承、
サブクラスのプロトタイプオブジェクト = 親クラスのインスタンス化されたオブジェクト
欠点:

1. サブクラス オブジェクトの構築時に、親クラスからサブクラスに派生した属性を初期化できません。
2. 最初に継承を実装し、次に新しいプロパティとメソッドをサブクラス オブジェクトに追加する必要があります。継承が実装されると、プロトタイプ オブジェクトのポイントを変更することはできません。

  function Parent1() {
    
    
    this.name = 'parent1';
    this.play = [1, 2, 3]
  }
  function Child1() {
    
    
    this.type = 'child2';
  }
  Child1.prototype = new Parent1();
  console.log(new Child1());

2.コンストラクタ継承借用
の不具合：プロトタイプオブジェクトのプロパティを継承できない

  function Parent1(){
    
    
    this.name = 'parent1';
  }
  Parent1.prototype.getName = function () {
    
    
    return this.name;
  }
  function Child1(){
    
    
    Parent1.call(this);
    this.type = 'child1'
  }
  let child = new Child1();
  console.log(child);  // 没问题
  console.log(child.getName());  // 会报错

3. 混合継承：プロトタイプ継承と借用構法継承により完全継承を実現

  function Parent3 () {
    
    
    this.name = 'parent3';
    this.play = [1, 2, 3];
  }
  Parent3.prototype.getName = function () {
    
    
    return this.name;
  }
  function Child3() {
    
    
    // 第二次调用 Parent3()
    Parent3.call(this);
    this.type = 'child3';
  }
  // 第一次调用 Parent3()
  Child3.prototype = new Parent3();
  // 手动挂上构造器，指向自己的构造函数
  Child3.prototype.constructor = Child3;
  var s3 = new Child3();
  var s4 = new Child3();
  s3.play.push(4);
  console.log(s3.play, s4.play);  // 不互相影响
  console.log(s3.getName()); // 正常输出'parent3'
  console.log(s4.getName()); // 正常输出'parent3'

4. Es6 の継承: ES6 の継承はクラスを通じて実現されます。親クラスとサブクラスはクラスを通じて定義されます。サブクラスは extends を通じて親クラスを継承し、super キーワードを使用して親クラスのオブジェクトのメソッドにアクセスして呼び出します (これは親クラスのコンストラクタメソッドを呼び出すことができます（親クラスの通常のメソッドも呼び出すことができます）

//定义父类
class Parent{
    
    
    constructor(name,gender){
    
    
        this.name = name;
        this.gender = gender;
    };
    get(){
    
    
        console.log("姓名：",this.name);
        console.log("性别：",this.gender);
    }
}
class Child extends Parent{
    
    
    constructor(name,gender,age){
    
    
        super(name,gender);  //super必须在子类的this之前调用
        this.age = age;
    }
    disp(){
    
    
        console.log("年龄：",this.age)
    }
    change(){
    
    
        console.log(this.name+'的性别是'+this.gender,'今年'+this.age)
    }
}
var c1 = new Child('小红','女',20);
c1.get();  //姓名： 小红  性别： 女
c1.disp(); //年龄： 20
c1.change(); //小红的性别是女 今年20

26. オブジェクトトラバーサルメソッド

for in : 数値をトラバースして、対応するキーを返すことができます

for (let i in obj){
    
    
  执行的代码块
}

Object.keys()、Object.values()、Object.entries()
Object.keys(): オブジェクト キー名を含む配列を返します
Object.values(): オブジェクト キー値を含む配列を返します
Object.entries() : オブジェクトのキー名とキー値を含む配列を返します。

let obj={
    
    
 id:1,
 name:'hello',
 age:18
}
console.log(Object.keys(obj)) //['id','name','age']
console.log(Object.values()) //[1,'hello',18]
console.log(Object.entries()) //[['id',1],['name','hello'],['age',18]]

27. クロスドメインの問題を解決する方法

1. オリジナル以外の Web ページから Cookie を読み取るようにドキュメント ドメインを設定します
2 postMessage()、ドキュメント間通信 API
3. JSONP、サーバーとクライアント間のソース間通信
4. CORS、クロスドメイン リソース共有、CORS のサーバー側サポート、主に Access-Control-Allow-Origin の設定による
5. webpack ローカル プロキシ、webpack.config.js でローカル プロキシ プロキシを構成する
6. websocket、ブラウザとの間の全二重通信を実現サーバー
7. Nginx リバース プロキシでは、リクエストを転送するためにリレー nginx サーバーを設定する必要があります。

28. ディープコピーとシャローコピー、実装方法

方法 1 : for in を使用してトラバースし、再帰を追加する

let obj ={
    
    name:"hhh",age:18};
let newobj = {
    
    }
function fun(obj){
    
    
	for(let key in obj){
    
    
		if(obj.ket.typeof=="object"){
    
    
			fun(obj.ket)
		}else{
    
    
			newobj.key=obj.key
		}
	}
}

方法 2 : JSON.parse() と JSON.stringify()

JSON.parse(JSON.stringify(obj))

29. ブラウザのデフォルトイベントとイベントバブリングを防ぐ

イベントのバブリングを防ぐメソッド:event.stopPropagation()、
デフォルトの動作を防ぐメソッド:e.preventDefault()

30. メモリリークとは何ですか?

メモリ リークとは、所有または必要がなくなった後も存続するオブジェクトです。
クロージャは、クロージャやタイマーなどによって発生する可能性があります。

31. Promise とは何ですか? Promise を使用してどのような問題を解決できますか?

1. Promise は非同期プログラミングのソリューションです
2. Promise には 3 つの状態があります: pending (待機状態)、resolve (成功状態)、rejected (失敗状態);
3. 一度状態が変化すると、再度変化することはありません。
4. Promise インスタンスを作成した後、すぐに Promise を実行して、従来の非同期コールバックで発生するコールバック地獄の問題を解決します 5.
Promiseコンストラクターは同期的に実行され、then メソッドは非同期的に実行されます。

32. setTimeout、Promise、Async/Await の違い

イベント ループはマクロ タスク キューとマイクロ タスク キューに分かれています
マクロ タスク (macrotask): 新規格ではタスクと呼ばれ、
主にスクリプト (コード全体)、setTimeout、setInterval、setImmediate、I/O、UI レンダリング
マイクロ タスクが含まれます(microtask) : ジョブは新しい標準ではジョブと呼ばれ
、主に次のものが含まれます: process.nextTick、Promise、MutationObserver (html5 の新機能)

setTimeout、Promise、および Async/Await の違いは、
setTimeout のコールバック関数がマクロ タスク キューに配置されることです。実行スタックがクリアされた後、
Promise.then のコールバック関数は、マクロ タスク キューに配置されます。対応するマクロ タスク。同期コードの実行後に async 関数を実行するということは、
関数内に非同期メソッドが存在する可能性があることを意味します。await の後に式が続きます。async メソッドが実行されると
、await が発生するとすぐに式が実行されます、その後、式に続くコードがマイクロタスク キューに配置されます。 、実行スタックを放棄し、同期コードを最初に実行させます。

33. ES6 および ES5 クラスの作成?

ES6 はクラスを作成します。ES6 のすべてのプロパティとメソッドはコンストラクターで定義されます。

class Point{
    
    
	constructor(x,y,z) {
    
    
	    this.x = x;
	    this.y = y;
	    this.z = z;
	}
	toString(){
    
    
		return '(' + this.x + ',' + this.y + ',' + this.z + ')';
	}
}
let p = new Point(89,56,12);
console.log(p,typeof p,typeof Point,Point === Point.prototype.constructor);

ES5 クラス作成

function Point(x,y,z){
    
    
	this.x = x;
	this.y = y;
	this.z = z;
}
Point.prototype.toString = function(){
    
    
	return '(' + this.x + ',' + this.y + ',' + this.z + ')';
}
var p = new Point(23,67,98);
console.log(p,typeof p,typeof Point,Point === Point.prototype.constructor);

34. Promise の印刷データと setTimeout コールバック データ、どちらが先に実行されますか?

最初にマイクロ、次にマクロなので、最初に Promise、次に setTimeout

35. アルゴリズムの質問: 文字列を入力し、各文字の出現数を調べます。

var str="aakjaahgaaayjaaabbbrfghe";
    function unique(str) {
    
    
   var obj={
    
    };
    for(var i=0;i<str.length;i++){
    
    
        if(obj[str[i]]){
    
    
            obj[key]++;
        }else{
    
    
            obj[key]=1;//obj[w]=1
        }
    }
   var arr = Object.keys(obj);   
   for(var i=0;i<arr.length;i++){
    
    
      console.log(arr[i]+'出现次数为:'+obj[arr[i]])
   }
 }
 unique(str)

更新を続けます。。。