JavaScript-Interviewzusammenfassung mit 10.000 Wörtern

Dieser Artikel vermittelt Ihnen relevantes Wissen überJavaScript. Er stellt hauptsächlich eine Zusammenfassung einiger häufiger Fragen im Vorstellungsgespräch dar. Ich hoffe, dass er für alle hilfreich ist.

[Verwandte Empfehlungen:JavaScript-Video-Tutorial,Web-Frontend]

1. JS-Grundlagen

1.1 Welche Datentypen gibt es in Js

Es gibt acht Datentypen in JavaScript

Basisdatentyp: Undefiniert, Null, Boolesch, Zahl, Zeichenfolge, Symbol, BigInt.

Komplexer Datentyp: Object

Symbol und BigInt sind neue Datentypen in ES6:

• Symbol stellt einen einzigartigen und unveränderlichen Datentyp nach der Erstellung dar. Er dient hauptsächlich der Lösung möglicher globaler Variablenkonflikte.

• BigInt ist ein numerischer Datentyp, der Ganzzahlen in jedem Präzisionsformat darstellen kann. Mit BigInt können große Ganzzahlen sicher gespeichert und verarbeitet werden, auch wenn die Zahl den sicheren Ganzzahlbereich überschreitet, den Number darstellen kann.

1.2 Sprechen Sie über Ihr Verständnis des Heap-Bereichs und des Stapelbereichs.

Im Betriebssystem ist der Speicher in den Stapelbereich und den Heap-Bereich unterteilt.

• Der Speicher im Stapelbereich ist Wird vom Compiler automatisch zugewiesen und freigegeben. Speichern Sie Funktionsparameterwerte, lokale Variablenwerte usw. Es funktioniert wie ein Stapel in einer Datenstruktur.

• Der Speicher im Heap-Bereich wird im Allgemeinen vom Entwickler zugewiesen und freigegeben. Wenn der Entwickler ihn nicht freigibt, kann er am Ende des Programms vom Garbage Collection-Mechanismus zurückgefordert werden.

In der Datenstruktur:

• In der Datenstruktur ist die Zugriffsmethode für Daten im Stapel „First In, Last Out“.

• Der Heap ist eine Prioritätswarteschlange, die nach Priorität sortiert ist. Die Priorität kann nach Größe angegeben werden.

Datenspeichermethode

• Der ursprüngliche Datentyp wird direkt im einfachen Datensegment im Stapel gespeichert, der wenig Platz einnimmt und eine feste Größe hat. Da es sich um häufig verwendete Daten handelt, werden sie im Stapel gespeichert Stapel;

• Der Referenzdatentyp ist ein im Heap gespeichertes Objekt, das viel Platz einnimmt und keine feste Größe hat. Wenn es auf dem Stapel gespeichert wird, wirkt es sich auf die Leistung des Programms aus. Der Referenzdatentyp speichert einen Zeiger auf dem Stapel, der auf die Startadresse der Entität im Heap zeigt. Wenn der Interpreter nach einem Referenzwert sucht, ruft er zunächst seine Adresse auf dem Stapel ab und ruft dann die Entität vom Heap ab.

1.3 Welche Methoden gibt es zur Datentyperkennung?

Dann kann die Methode zur Beurteilung des Datentyps im Allgemeinen über vier gängige Methoden erfolgen: typeof, Instanzof, Konstruktor, toString

1.4 Beurteilung des Arrays Welche Methoden gibt es?

• Urteilen Sie über Object.prototype.toString.call()

• Urteilen Sie über die Prototypenkette

• Urteilen Sie über Array.isArray() von ES6

• Durch Instanz von Urteilen

• durch Array.prototype.isPrototypeOf

1.5 Der Unterschied zwischen null und undefiniert

Zuallererst sind Undefiniert und Null jeweils grundlegende Datentypen Datentypen haben nur einen Wert, der undefiniert und null ist.

undefiniert bedeutet undefiniert und null bedeutet leeres Objekt. Im Allgemeinen wird undefiniert zurückgegeben, wenn eine Variable deklariert, aber nicht definiert ist. Null wird hauptsächlich verwendet, um einigen Variablen Werte zuzuweisen, die möglicherweise Objekte als Initialisierung zurückgeben.

undefiniert ist kein reserviertes Wort in JavaScript, was bedeutet, dass Sie undefiniert als Variablennamen verwenden können. Dies ist jedoch sehr gefährlich und beeinträchtigt die Beurteilung undefinierter Werte. Mit einigen Methoden können wir sichere undefinierte Werte erhalten, z. B. void 0.

Wenn typeof zur Beurteilung dieser beiden Typen verwendet wird, gibt die Null-Typisierung „Objekt“ zurück, was ein historisches Problem darstellt. Gibt „true“ zurück, wenn ein doppeltes Gleichheitszeichen zum Vergleich zweier Wertetypen verwendet wird, und gibt „false“ zurück, wenn ein dreifaches Gleichheitszeichen verwendet wird.

1.6 Was ist das Ergebnis von typeof null und warum? Das Ergebnis von

typeof null ist Object.

In der ersten Version von JavaScript wurden alle Werte in 32-Bit-Einheiten gespeichert, und jede Einheit enthielt ein kleines Typ-Tag (1-3 Bit) und die tatsächlichen Daten des zu speichernden aktuellen Werts. Typbezeichnungen werden in den unteren Bits jeder Zelle gespeichert und es gibt fünf Datentypen:

000: object - 当前存储的数据指向一个对象。 1: int - 当前存储的数据是一个 31 位的有符号整数。 010: double - 当前存储的数据指向一个双精度的浮点数。 100: string - 当前存储的数据指向一个字符串。 110: boolean - 当前存储的数据是布尔值。

Wenn das niedrigste Bit 1 ist, beträgt die Länge des Typetiketten-Flags nur ein Bit. Wenn das niedrigste Bit 0 ist, beträgt die Länge des Typetiketten-Flags drei Bits, wodurch zwei zusätzliche Bits zum Speichern der anderen vier Daten bereitgestellt werden Typen. Länge.

Es gibt zwei spezielle Datentypen:

• undefinierter Wert ist (-2)30 (eine Zahl außerhalb des Bereichs von Ganzzahlen);

• null-Wert ist ein Maschinencode-NULL-Zeiger (der Wert eines Nullzeigers). ist alles 0)

Das bedeutet, dass die Typbezeichnung von null ebenfalls 000 ist, was mit der Typbezeichnung von Object identisch ist, sodass es als Objekt beurteilt wird.

1,7 Warum 0,1+0,2 ! == 0,3, wie man es gleich macht (Genauigkeit geht verloren)

Computer speichern Daten binär, wenn der Computer also 0,1+0,2 berechnet, berechnet er tatsächlich die Binärsumme von zwei Zahlen.

In JS gibt es nur einen Zahlentyp: Zahl. Seine Implementierung folgt dem IEEE 754-Standard und verwendet eine 64-Bit-Festlänge, um ihn darzustellen, was eine standardmäßige Gleitkommazahl mit doppelter Genauigkeit ist. In der binären wissenschaftlichen Schreibweise kann der Dezimalteil einer Gleitkommazahl mit doppelter Genauigkeit nur bis zu 52 Ziffern plus der vorherigen 1 behalten, tatsächlich bleiben 53 signifikante Ziffern erhalten. Die restlichen Ziffern müssen verworfen werden und der Rundung auf „0“ folgen 1"-Prinzip. Im Prinzip.

Nach diesem Prinzip ergibt die Addition der Binärzahlen 0,1 und 0,2 und deren Umwandlung in Dezimalzahlen: 0,30000000000000004. Also nicht gleich

Die Lösung besteht darin, eine Fehlermarge festzulegen, die oft als „Maschinenpräzision“ bezeichnet wird. Für JavaScript beträgt dieser Wert normalerweise 2-52. In ES6 wird das Attribut Number.EPSILON bereitgestellt. Beurteilen Sie einfach, ob 0,1+0,2-0,3 kleiner ist als Number.EPSILON. dann kann es als 0,1+0,2 ===0,3

function numberepsilon(arg1,arg2){ return Math.abs(arg1 - arg2) < Number.EPSILON; } console.log(numberepsilon(0.1 + 0.2, 0.3)); // true

1,8 beurteilt werden. Wie erhält man einen sicheren undefinierten Wert?

Da undefiniert ein Bezeichner ist, kann er als Variable verwendet und zugewiesen werden. Dies wirkt sich jedoch auf die normale Beurteilung von undefiniert aus. Der Ausdruck void ___ hat keinen Rückgabewert, daher ist das Ergebnis undefiniert. void ändert das Ergebnis des Ausdrucks nicht, sondern führt lediglich dazu, dass der Ausdruck keinen Wert zurückgibt. Sie können also void 0 verwenden, um undefiniert zu werden.

1.9 Was ist das Ergebnis von typeof NaN?

NaN bedeutet „keine Zahl“, NaN ist ein „Sentinel-Wert“ (regulärer Wert mit besonderem Zweck), der zur Anzeige von Fehlerbedingungen in numerischen Typen verwendet wird, d. h. „Mathematik durchführen“. Der Vorgang war nicht erfolgreich ist das Ergebnis, das nach einem Fehler zurückgegeben wird.“

typeof NaN; // "number"

NaN ist ein besonderer Wert, der sich selbst nicht gleicht und der einzige nicht reflexive Wert ist. Das sogenannte Irreflexiv bedeutet, dass NaN niemandem gleich ist, auch sich selbst nicht, sondern in NaN! = NaN gibt true zurück

1.10 Was ist der Unterschied zwischen den Funktionen isNaN und Number.isNaN?

Nach dem Empfang eines Parameters versucht die isNaN-Funktion, den Parameter in einen numerischen Wert umzuwandeln, der nicht in einen numerischen Wert umgewandelt werden kann. Daher wird er zurückgegeben, wenn ein nicht numerischer Wert übergeben wird wird auch true zurückgeben, was sich auf die Beurteilung von NaN auswirkt.

Die Funktion Number.isNaN ermittelt zunächst, ob es sich bei dem eingehenden Parameter um eine Zahl handelt, und ermittelt dann weiterhin, ob es sich um eine NaN-Datentypkonvertierung handelt .

1.11 Was sind die Casting-Regeln für den ==-Operator?

Wenn bei == die Typen der beiden Vergleichsparteien unterschiedlich sind, wird eine Typkonvertierung durchgeführt. Wenn x und y verglichen werden, um festzustellen, ob sie gleich sind, wird der folgende Beurteilungsprozess durchgeführt:

Zunächst wird beurteilt, ob die beiden Typen gleich sind. Wenn sie gleich sind, wird die Größe der beiden beurteilt wird verglichen;

Wenn die Typen nicht identisch sind, wird zunächst festgestellt, ob null und undefiniert verglichen werden. Wenn ja, wird true zurückgegeben, um festzustellen, ob die beiden Typen identisch sind Wenn ja, wird die Zeichenfolge in eine Zahl umgewandelt, um zu bestimmen, ob eine davon boolesch ist. Wenn ja, wird sie in eine Zahl umgewandelt und dann beurteilt, ob eine der Parteien eine ist Objekt und das andere ist eine Zeichenfolge, eine Zahl oder ein Symbol. Wenn ja, wird das Objekt in den ursprünglichen Typ konvertiert und dann beurteilt andere Werttypen in Strings konvertieren?

Typen Null und Undefiniert, null wird in „null“ konvertiert, undefiniert wird in „undefiniert“ konvertiert,

Boolean-Typ, true wird in „true“ konvertiert, false wird in „false“ konvertiert.

Zahlentypwerte werden direkt konvertiert, aber diese sehr kleinen und großen Zahlen verwenden die Exponentialform.

Symboltypwerte werden direkt konvertiert, aber nur explizite Umwandlungen sind zulässig. Die Verwendung impliziter Umwandlungen führt zu einem Fehler.

对普通对象来说，除非自行定义 toString() 方法，否则会调用 toString()（Object.prototype.toString()）来返回内部属性 [[Class]] 的值，如"[object Object]"。如果对象有自己的 toString() 方法，字符串化时就会调用该方法并使用其返回值。

1.13. 其他值类型转成数字的转换规则？

Undefined 类型的值转换为 NaN。

Null 类型的值转换为 0。

Boolean 类型的值，true 转换为 1，false 转换为 0。

String 类型的值转换如同使用 Number() 函数进行转换，如果包含非数字值则转换为 NaN，空字符串为 0。

Symbol 类型的值不能转换为数字，会报错。

对象（包括数组）会首先被转换为相应的基本类型值，如果返回的是非数字的基本类型值，则再遵循以上规则将其强制转换为数字。

为了将值转换为相应的基本类型值， 隐式转换会首先检查该值是否有valueOf()方法。如果有并且返回基本类型值，就使用该值进行强制类型转换。如果没有就使用 toString() 的返回值（如果存在）来进行强制类型转换。

如果 valueOf() 和 toString() 均不返回基本类型值，会产生 TypeError 错误。

1.14 其他值类型转成布尔类型的转换规则？

以下这些是假值： undefined 、 null 、 false 、 +0、-0 和 NaN 、 ""

假值的布尔强制类型转换结果为 false。从逻辑上说，假值列表以外的都应该是真值。

1.15. || 和 && 操作符的返回值？

|| 和 && 首先会对第一个操作数执行条件判断，如果其不是布尔值就先强制转换为布尔类型，然后再执行条件判断。

• 对于 || 来说，如果条件判断结果为 true 就返回第一个操作数的值，如果为 false 就返回第二个操作数的值。

• && 则相反，如果条件判断结果为 true 就返回第二个操作数的值，如果为 false 就返回第一个操作数的值。

|| 和 && 返回它们其中一个操作数的值，而非条件判断的结果

1.16. Object.is() 与比较操作符 “===”、“==” 的区别？

• 使用双等号（==）进行相等判断时，如果两边的类型不一致，则会进行强制类型转化后再进行比较。

• 使用三等号（===）进行相等判断时，如果两边的类型不一致时，不会做强制类型准换，直接返回 false。

• 使用 Object.is 来进行相等判断时，一般情况下和三等号的判断相同，它处理了一些特殊的情况，比如 -0 和 +0 不再相等，两个 NaN 是相等的。

1.17. 什么是 JavaScript 中的包装类型？

在 JavaScript 中，基本类型是没有属性和方法的，但是为了便于操作基本类型的值，在调用基本类型的属性或方法时 JavaScript 会在后台隐式地将基本类型的值转换为对象。如：

const a = "abc"; a.length; // 3

在访问'abc'.length时，JavaScript 将'abc'在后台转换成String('abc')，然后再访问其length属性。

1.18 Js中隐式转换规则

在 if 语句、逻辑语句、数学运算逻辑、== 等情况下都可能出现隐式类型转换。

坑: 判断时, 尽量不要用 = = , 要用 = = = ( 两个等号判断, 如果类型不同, 默认会进行隐式类型转换再比较)

1.19 说说你对this的理解

this是一个在运行时才进行绑定的引用，在不同的情况下它可能会被绑定不同的对象。

1.20 如何判断 this 的指向

第一种是函数调用模式，当一个函数不是一个对象的属性时，直接作为函数来调用时，this 指向全局对象。

第二种是方法调用模式，如果一个函数作为一个对象的方法来调用时，this 指向这个对象。

第三种是构造器调用模式，如果一个函数用 new 调用时，函数执行前会新创建一个对象，this 指向这个新创建的对象。

第四种是 apply 、 call 和 bind 调用模式，这三个方法都可以显示的指定调用函数的 this 指向。其中 apply 方法接收两个参数：一个是 this 绑定的对象，一个是参数数组。call 方法接收的参数，第一个是 this 绑定的对象，后面的其余参数是传入函数执行的参数。也就是说，在使用 call() 方法时，传递给函数的参数必须逐个列举出来。bind 方法通过传入一个对象，返回一个 this 绑定了传入对象的新函数。这个函数的 this 指向除了使用 new 时会被改变，其他情况下都不会改变。

this绑定的优先级

new绑定优先级 > 显示绑定优先级 > 隐式绑定优先级 > 默认绑定优先级

1.21 Map和Object的区别

1.22 说说你对JSON的理解

JSON 是一种基于文本的轻量级的数据交换格式。它可以被任何的编程语言读取和作为数据格式来传递。

在项目开发中，使用 JSON 作为前后端数据交换的方式。在前端通过将一个符合 JSON 格式的数据结构序列化为 JSON 字符串，然后将它传递到后端，后端通过 JSON 格式的字符串解析后生成对应的数据结构，以此来实现前后端数据的一个传递。

因为 JSON 的语法是基于 js 的，因此很容易将 JSON 和 js 中的对象弄混，但是应该注意的是 JSON 和 js 中的对象不是一回事，JSON 中对象格式更加严格，比如说在 JSON 中属性值不能为函数，不能出现 NaN 这样的属性值等，因此大多数的 js 对象是不符合 JSON 对象的格式的。

在 js 中提供了两个函数来实现 js 数据结构和 JSON 格式的转换处理，

JSON.stringify 函数，通过传入一个符合 JSON 格式的数据结构，将其转换为一个 JSON 字符串。如果传入的数据结构不符合 JSON 格式，那么在序列化的时候会对这些值进行对应的特殊处理，使其符合规范。在前端向后端发送数据时，可以调用这个函数将数据对象转化为 JSON 格式的字符串。

JSON.parse() 函数，这个函数用来将 JSON 格式的字符串转换为一个 js 数据结构，如果传入的字符串不是标准的 JSON 格式的字符串的话，将会抛出错误。当从后端接收到 JSON 格式的字符串时，可以通过这个方法来将其解析为一个 js 数据结构，以此来进行数据的访问。

1.222 String和JSON.stringify的区别

console.log(String("abc")); // abc console.log(JSON.stringify("abc")); // "abc" console.log(String({ key: "value" })); // [object Object] console.log(JSON.stringify({ key: "value" })); // {"key":"value"} console.log(String([1, 2, 3])); // 1,2,3 console.log(JSON.stringify([1, 2, 3])); // [1,2,3] const obj = { title: "devpoint", toString() { return "obj"; }, }; console.log(String(obj)); // obj console.log(JSON.stringify(obj)); // {"title":"devpoint"}

当需要将一个数组和一个普通对象转换为字符串时，经常使用JSON.stringify。

如果需要对象的toString方法被重写，则需要使用String()。

在其他情况下，使用String()将变量转换为字符串。

1.23 什么是伪数组(类数组)

一个拥有 length 属性和若干索引属性的对象就可以被称为类数组对象，类数组对象和数组类似，但是不能调用数组的方法。

常见的类数组对象有 arguments 和 DOM 方法的返回结果，还有一个函数也可以被看作是类数组对象，因为它含有 length 属性值，代表可接收的参数个数。

1.24 类数组转换成数组的方法有哪些

常见的类数组转换为数组的方法有这样几种：

通过 call 调用数组的 slice 方法来实现转换

Array.prototype.slice.call(arrayLike);

通过 call 调用数组的 splice 方法来实现转换

Array.prototype.splice.call(arrayLike, 0);

通过 apply 调用数组的 concat 方法来实现转换

Array.prototype.concat.apply([], arrayLike);

通过 Array.from 方法来实现转换

Array.from(arrayLike);

1.25 Unicode、UTF-8、UTF-16、UTF-32的区别？

Unicode 是编码字符集（字符集），而UTF-8、UTF-16、UTF-32是字符集编码（编码规则）；

UTF-16 使用变长码元序列的编码方式，相较于定长码元序列的UTF-32算法更复杂，甚至比同样是变长码元序列的UTF-8也更为复杂，因为其引入了独特的代理对这样的代理机制；

UTF-8需要判断每个字节中的开头标志信息，所以如果某个字节在传送过程中出错了，就会导致后面的字节也会解析出错；而UTF-16不会判断开头标志，即使错也只会错一个字符，所以容错能力教强；

如果字符内容全部英文或英文与其他文字混合，但英文占绝大部分，那么用UTF-8就比UTF-16节省了很多空间；而如果字符内容全部是中文这样类似的字符或者混合字符中中文占绝大多数，那么UTF-16就占优势了，可以节省很多空间；

1.26 常见的位运算符有哪些？其计算规则是什么？

现代计算机中数据都是以二进制的形式存储的，即0、1两种状态，计算机对二进制数据进行的运算加减乘除等都是叫位运算，即将符号位共同参与运算的运算。

常见的位运算有以下几种：

1.27 为什么函数的 arguments 参数是类数组而不是数组？如何遍历类数组?

arguments是一个对象，它的属性是从 0 开始依次递增的数字，还有callee和length等属性，与数组相似；但是它却没有数组常见的方法属性，如forEach, reduce等，所以叫它们类数组。

要遍历类数组，有三个方法：

（1）将数组的方法应用到类数组上，这时候就可以使用call和apply方法，如：

function foo(){ Array.prototype.forEach.call(arguments, a => console.log(a)) }

（2）使用Array.from方法将类数组转化成数组：

function foo(){ const arrArgs = Array.from(arguments) arrArgs.forEach(a => console.log(a)) }

（3）使用展开运算符将类数组转化成数组

function foo(){ const arrArgs = [...arguments] arrArgs.forEach(a => console.log(a)) }

1.28 escape、encodeURI、encodeURIComponent 的区别

encodeURI 是对整个 URI 进行转义，将 URI 中的非法字符转换为合法字符，所以对于一些在 URI 中有特殊意义的字符不会进行转义。

encodeURIComponent 是对 URI 的组成部分进行转义，所以一些特殊字符也会得到转义。

escape 和 encodeURI 的作用相同，不过它们对于 unicode 编码为 0xff 之外字符的时候会有区别，escape 是直接在字符的 unicode 编码前加上 %u，而 encodeURI 首先会将字符转换为 UTF-8 的格式，再在每个字节前加上 %。

1.29 什么是尾调用，使用尾调用有什么好处？

尾调用指的是函数的最后一步调用另一个函数。代码执行是基于执行栈的，所以当在一个函数里调用另一个函数时，会保留当前的执行上下文，然后再新建另外一个执行上下文加入栈中。使用尾调用的话，因为已经是函数的最后一步，所以这时可以不必再保留当前的执行上下文，从而节省了内存，这就是尾调用优化。

但是 ES6 的尾调用优化只在严格模式下开启，正常模式是无效的。

1.30 use strict是什么? 它有什么用？

use strict 是一种 ECMAscript5 添加的（严格模式）运行模式，这种模式使得 Javascript 在更严格的条件下运行。设立严格模式的目的如下：

消除 Javascript 语法的不合理、不严谨之处，减少怪异行为;

消除代码运行的不安全之处，保证代码运行的安全；

提高编译器效率，增加运行速度；

为未来新版本的 Javascript 做好铺垫。

区别：

禁止使用 with 语句。

禁止 this 关键字指向全局对象。

对象不能有重名的属性。

1.31 如何判断一个对象是否属于某个类？

第一种方式，使用 instanceof 运算符来判断构造函数的 prototype 属性是否出现在对象的原型链中的任何位置。

第二种方式，通过对象的 constructor 属性来判断，对象的 constructor 属性指向该对象的构造函数，但是这种方式不是很安全，因为 constructor 属性可以被改写。

第三种方式，如果需要判断的是某个内置的引用类型的话，可以使用 Object.prototype.toString() 方法来打印对象的[[Class]] 属性来进行判断。

1.32 强类型语言和弱类型语言的区别

强类型语言：强类型语言也称为强类型定义语言，是一种总是强制类型定义的语言，要求变量的使用要严格符合定义，所有变量都必须先定义后使用。Java和C++等语言都是强制类型定义的，也就是说，一旦一个变量被指定了某个数据类型，如果不经过强制转换，那么它就永远是这个数据类型了。例如你有一个整数，如果不显式地进行转换，你不能将其视为一个字符串。

Schwach typisierte Sprache: Schwach typisierte Sprache wird auch als schwach typisierte Definitionssprache bezeichnet, was das Gegenteil einer stark typisierten Definition ist. Die JavaScript-Sprache ist eine schwach typisierte Sprache. Einfach ausgedrückt handelt es sich um eine Sprache, in der Variablentypen ignoriert werden können. Beispielsweise ist JavaScript schwach typisiert. In JavaScript können Sie die Zeichenfolge „12“ und die Ganzzahl 3 verketten, um die Zeichenfolge „123“ zu erhalten, und beim Hinzufügen wird eine erzwungene Typkonvertierung durchgeführt.

Vergleich der beiden: Stark typisierte Sprachen sind möglicherweise etwas schneller als schwach typisierte Sprachen, aber die Genauigkeit, die stark typisierte Sprachen mit sich bringen, kann effektiv dazu beitragen, viele Fehler zu vermeiden.

1.33 Der Unterschied zwischen interpretierten Sprachen und kompilierten Sprachen

(1) Interpretierte Sprachen verwenden einen speziellen Interpreter, um das Quellprogramm Zeile für Zeile in Maschinencode für eine bestimmte Plattform zu interpretieren und auszuführen sofort. Der Code wird vom Interpreter bei der Ausführung dynamisch übersetzt und Zeile für Zeile ausgeführt, anstatt vor der Ausführung übersetzt zu werden. Interpretierte Sprachen müssen nicht im Voraus kompiliert werden. Sie interpretieren den Quellcode direkt in Maschinencode und führen ihn sofort aus. Solange eine bestimmte Plattform einen entsprechenden Interpreter bereitstellt, kann das Programm ausgeführt werden. Seine Eigenschaften werden wie folgt zusammengefasst:

Jedes Mal, wenn eine interpretierte Sprache ausgeführt wird, muss der Quellcode in Maschinencode interpretiert und ausgeführt werden, was ineffizient ist.

Solange die Plattform den entsprechenden Interpreter bereitstellt, kann der Quellcode sein ausgeführt werden, sodass die Transplantation des Quellprogramms erleichtert werden kann ;

JavaScript, Python usw. sind interpretierte Sprachen.

(2) Kompilierte Sprachen verwenden einen speziellen Compiler, um Hochsprachen-Quellcode für eine bestimmte Plattform in Maschinencode zu kompilieren, der von der Hardware der Plattform ausgeführt werden kann, und ihn in eine ausführbare Datei zu verpacken, die von der Plattform erkannt werden kann . Format sexueller Prozeduren. Bevor ein in einer kompilierten Sprache geschriebenes Programm ausgeführt wird, ist ein spezieller Kompilierungsprozess erforderlich, um den Quellcode in eine Maschinensprachendatei zu kompilieren, z. B. eine Datei im EXE-Format. Bei der zukünftigen Ausführung können Sie das Kompilierungsergebnis direkt verwenden, z als direktes Ausführen des exe-Dokuments. Da sie nur einmal kompiliert werden muss und bei späterer Ausführung nicht kompiliert werden muss, weisen kompilierte Sprachen eine hohe Ausführungseffizienz auf. Seine Eigenschaften lassen sich wie folgt zusammenfassen:

Es wird gleichzeitig in plattformbezogene Maschinensprachendateien kompiliert, ist beim Ausführen von der Entwicklungsumgebung getrennt und weist eine hohe Betriebseffizienz auf.

Es bezieht sich auf eine bestimmte Plattform und kann dies im Allgemeinen nicht sein auf andere Plattformen übertragen;

C, C++ usw. gehören zur kompilierten Sprache.

Der Hauptunterschied zwischen den beiden besteht darin, dass das erstere Quellprogramm nach der Kompilierung auf der Plattform ausgeführt werden kann, während das letztere während des Betriebs kompiliert wird. Daher läuft Ersteres schnell und Letzteres bietet eine gute plattformübergreifende Leistung.

1.34 Der Unterschied zwischen for...in und for...of

for...of ist eine neue Traversal-Methode in ES6, die das Traversieren einer Datenstruktur (Array, Objekt usw.) ermöglicht. Enthält die Iteratorschnittstelle und gibt zurück. Der Unterschied zwischen dem Wert jedes Elements und for...in in ES3 ist wie folgt: for... von Durchläufen, um den Schlüsselwert des Objekts zu erhalten, während for... in den Schlüssel erhält Name des Objekts;

for...in durchläuft das gesamte Objekt. Die Prototypenkette hat eine sehr schlechte Leistung und wird nicht empfohlen, während for...of nur das aktuelle Objekt und nicht die Prototypenkette durchquert ;

Für die Array-Durchquerung gibt for...in alle aufzählbaren Eigenschaften im Array zurück (einschließlich der aufgezählten Attribute in der Prototypenkette), for...of gibt nur den Attributwert zurück, der dem Index des Arrays entspricht;

Zusammenfassung: Die for...in-Schleife dient hauptsächlich zum Durchlaufen von Objekten und ist nicht zum Durchlaufen von Arrays geeignet. Die for...of-Schleife kann zum Durchlaufen von Arrays, arrayähnlichen Objekten, Zeichenfolgen, Mengen und Karten verwendet werden und Generatorobjekte.

1.35 Der Unterschied zwischen Ajax, Axios und Fetch(1) AJAX Ajax ist „AsynchronousJavascriptAndXML“ (asynchrones JavaScript und XML), was sich auf eine Webentwicklungstechnologie zum Erstellen interaktiver Webanwendungen bezieht. Dabei handelt es sich um eine Technologie, die Teile einer Webseite aktualisieren kann, ohne die gesamte Webseite neu laden zu müssen. Ajax ermöglicht die asynchrone Aktualisierung von Webseiten, indem im Hintergrund eine kleine Datenmenge mit dem Server ausgetauscht wird. Das bedeutet, dass Teile einer Webseite aktualisiert werden können, ohne dass die gesamte Seite neu geladen werden muss. Herkömmliche Webseiten (die kein Ajax verwenden) müssen die gesamte Webseite neu laden, wenn der Inhalt aktualisiert werden muss. Seine Mängel sind wie folgt:

selbst ist auf die MVC-Programmierung ausgerichtet und entspricht nicht dem Trend der Front-End-MVVM
wird auf Basis von nativem XHR entwickelt
entspricht nicht dem Grundsatz der Interessenstrennung (Separation of Concerns).
Die Konfigurations- und Aufrufmethoden sind sehr verwirrend und das ereignisbasierte asynchrone Modell ist unfreundlich.
(2) Fetch fetch ist als Ersatz für AJAX bekannt. Es erschien in ES6 und verwendet das Promise-Objekt in ES6. Fetch basiert auf Versprechen. Die Codestruktur von Fetch ist viel einfacher als die von Ajax. Fetch ist keine weitere Kapselung von Ajax, sondern natives JS, das das XMLHttpRequest-Objekt nicht verwendet.

Vorteile von Fetch:

Die Syntax ist präziser und semantischer.
Basiert auf der Standard-Promise-Implementierung und unterstützt Async/Await.
Es ist auf niedrigerer Ebene und bietet umfangreiche APIs (Anfrage, Antwort).
Detachment XHR ist eine neue Implementierungsmethode in der ES-Spezifikation
Nachteile von Fetch:

• fetch meldet nur Fehler für Netzwerkanfragen. Wenn der Server 400- und 500-Fehlercodes zurückgibt, wird er nicht abgelehnt. Nur wenn Netzwerkfehler dazu führen, dass die Anfrage nicht abgeschlossen werden kann wird abgelehnt.

• fetch hat standardmäßig keine Cookies, Sie müssen Konfigurationselemente hinzufügen: fetch(url, {credentials: 'include'})

• fetch unterstützt keinen Abbruch, unterstützt keine Timeout-Steuerung, verwenden Sie setTimeout und Promise.reject-Implementierung Die Timeout-Kontrolle verhindert nicht, dass der Anforderungsprozess im Hintergrund weiterläuft, was zu einer Verschwendung von Datenverkehr führt. Fetch hat keine Möglichkeit, den Fortschritt der Anforderung nativ zu überwachen, XHR kann dies jedoch

  (3) Axios Axios ist ein Promise-basierter Kapselungs-HTTP-Client. Seine Eigenschaften sind wie folgt:

• Der Browser initiiert XMLHttpRequests-Anfragen.

• Anfragen und Retouren Konvertieren

• Anfrage abbrechen

• JSON-Daten automatisch konvertieren

• Der Client unterstützt die Abwehr von XSRF-Angriffen
• 1.36 Was sind die Traversierungsmethoden von Arrays

• 1.37 forEach Was ist der Unterschied zwischen der Map-Methode und der Map-Methode? Der Unterschied zwischen den beiden ist wie folgt: Die forEach()-Methode führt die aus Für jedes Element wird eine Funktion bereitgestellt, und die Operation an den Daten ändert den ursprünglichen Array-Wert. Die Methode

map() ändert nicht den Wert des ursprünglichen Arrays, sondern gibt einen neuen Array-Wert zurück im neuen Array sind die Werte des ursprünglichen Arrays nach dem Aufruf der Funktion;

1.38 Erzählen Sie mir von Ihrer Meinung zu Qian. Verständnis von Kopie und tiefer Kopie

Flache Kopie

Wenn es sich bei dem Attribut um einen Basistyp handelt, wird der Basistypwert kopiert. Wenn das Attribut ein Referenztyp ist, wird die Speicheradresse kopiert. Das heißt, die flache Kopie kopiert eine Ebene und der tiefe Referenztyp teilt die Speicheradresse. Gemeinsame flache Kopie: Object.assignObject.create

slice

concat()

Expand-Operator

deep copy

deep copy öffnet einen neuen Stapel. Die beiden Objekte sind gleich vervollständigt, entsprechen aber zwei Verschiedene Adressen. Das Ändern der Eigenschaften eines Objekts ändert nicht die Eigenschaften eines anderen Objekts: ( )

Handgeschriebene Schleifenrekursion

• 1.39 Nachteile von JSON.stringify Deep Copy

• Wenn in obj ein Zeitobjekt vorhanden ist, wird das Ergebnis von JSON.stringify und dann JSON.parse die Zeit sein sei nur eine Zeichenfolge Die Form, nicht die Form des Objekts

Wenn RegExp in obj vorhanden ist, wird es als leeres Objekt gedruckt

• Wenn das Objekt eine Funktion oder undefiniert enthält, wird es direkt verworfen

Wenn es in JSON ein Objekt gibt, das vom Konstruktor generiert wird, geht die Konstruktion des Objekts verloren
1.40 Kennen Sie Lodash? Welche gemeinsamen APIs gibt es?
Lodash ist eine konsistente, modulare und leistungsstarke JavaScript-Dienstprogrammbibliothek.

_.cloneDeep Deep Copy

_.reject entfernt ein Element basierend auf Bedingungen.

_.drop(array, [n=1] ) Funktion: Entfernen Sie die ersten n Elemente im Array und geben Sie dann die verbleibenden Teile zurück.

• 1.41 LHS- und RHS-Abfrage

• LHS (linke Seite ) und RHS (rechte Seite) sind zwei Möglichkeiten für die JS-Engine, Variablen während der Codeausführungsphase zu bedienen. Der Unterschied zwischen den beiden besteht darin, dass der Zweck der Variablenabfrage die Variablenzuweisung oder -abfrage ist.

LHS kann so verstanden werden, dass sich die Variable auf der linken Seite des Zuweisungsoperators (=) befindet, zum Beispiel a = 1. Der Zweck der Suche der aktuellen Engine nach Variable a ist die Variablenzuweisung. In diesem Fall ist es der Engine egal, was der ursprüngliche Wert der Variablen a ist, sie weist der Variablen a lediglich den Wert 1 zu.

• RHS kann als Variable auf der rechten Seite des Zuweisungsoperators (=) verstanden werden, zum Beispiel: console.log(a) Der Zweck der Suche der Engine nach Variable a besteht darin, sie abzufragen Wert, der der Variablen a entspricht. Dann können Sie ihn ausdrucken.

• 1.42 Inwiefern ist Includes besser als indexOf?

includes kann NaN erkennen, indexOf kann NaN nicht erkennen, include verwendet Number.isNaN intern, um NaN abzugleichen1.43 Was ist der Unterschied zwischen AMD und CMD?

方案一：重写toString()或valueOf()

let a = { i: 1, toString: function () { return a.i++; } } console.log(a == 1 && a == 2 && a == 3); // true

方案二：数组

数组的toString接口默认调用数组的join方法，重写join方法。定义a为数字，每次比较时就会调用 toString()方法，我们把数组的shift方法覆盖toString即可：

let a = [1,2,3]; a.toString = a.shift; console.log(a == 1 && a == 2 && a == 3); // true

当然把toString改为valueOf也是一样效果：

let a = [1,2,3]; a. valueOf = a.shift; console.log(a == 1 && a == 2 && a == 3); // true

方案三：使用Object.defineProperty()

Object.defineProperty()用于定义对象中的属性，接收三个参数：object对象、对象中的属性，属性描述符。属性描述符中get:访问该属性时自动调用。

var _a = 1; Object.defineProperty(this,'a',{ get:function(){ return _a++ } }) console.log(a===1 && a===2 && a===3)//true

1.45 JS中的 MUL 函数

MUL表示数的简单乘法。在这种技术中，将一个值作为参数传递给一个函数，而该函数将返回另一个函数，将第二个值传递给该函数，然后重复继续。例如:xyz可以表示为

const mul = x => y => z => x * y * z console.log(mul(1)(2)(3)) // 6

1.46 深度遍历广度遍历的区别？

对于算法来说 无非就是时间换空间 空间换时间

1、深度优先不需要记住所有的节点, 所以占用空间小, 而广度优先需要先记录所有的节点占用空间大

2、深度优先有回溯的操作(没有路走了需要回头)所以相对而言时间会长一点

3、深度优先采用的是堆栈的形式, 即先进后出

4、广度优先则采用的是队列的形式, 即先进先出

1.47 JS中的设计模式有哪些？

• 单例模式

保证一个类仅有一个实例，并提供一个访问它的全局访问点。实现的方法为先判断实例存在与否，如果存在则直接返回，如果不存在就创建了再返回，这就确保了一个类只有一个实例对象。

• 策略模式

定义一系列的算法，把他们一个个封装起来，并且使他们可以相互替换。

• 代理模式

为一个对象提供一个代用品或占位符，以便控制对它的访问。

• 中介者模式

通过一个中介者对象，其他所有的相关对象都通过该中介者对象来通信，而不是相互引用，当其中的一个对象发生改变时，只需要通知中介者对象即可。通过中介者模式可以解除对象与对象之间的紧耦合关系。

• 装饰者模式

在不改变对象自身的基础上，在程序运行期间给对象动态地添加方法。

1.48 forEach如何跳出循环？

forEach是不能通过break或者return来实现跳出循环的，为什么呢？实现过forEach的同学应该都知道，forEach的的回调函数形成了一个作用域，在里面使用return并不会跳出，只会被当做continue

可以利用try catch

　　function getItemById(arr, id) { var item = null; try { arr.forEach(function (curItem, i) { if (curItem.id == id) { item = curItem; throw Error(); } }) } catch (e) { } return item; }

1.49 JS中如何将页面重定向到另一个页面？

1、使用 location.href：window.location.href ="url"

2、使用 location.replace： window.location.replace("url");

1.50 移动端如何实现上拉加载，下拉刷新？

上拉加载

上拉加载的本质是页面触底，或者快要触底时的动作

判断页面触底我们需要先了解一下下面几个属性

scrollTop：滚动视窗的高度距离window顶部的距离，它会随着往上滚动而不断增加，初始值是0，它是一个变化的值

clientHeight:它是一个定值，表示屏幕可视区域的高度；

scrollHeight：页面不能滚动时也是存在的,此时scrollHeight等于clientHeight。scrollHeight表示body所有元素的总长度(包括body元素自身的padding)

综上我们得出一个触底公式：

scrollTop + clientHeight >= scrollHeight

下拉刷新

下拉刷新的本质是页面本身置于顶部时，用户下拉时需要触发的动作

关于下拉刷新的原生实现，主要分成三步：

监听原生touchstart事件，记录其初始位置的值，e.touches[0].pageY；

监听原生touchmove事件，记录并计算当前滑动的位置值与初始位置值的差值，大于0表示向下拉动，并借助CSS3的translateY属性使元素跟随手势向下滑动对应的差值，同时也应设置一个允许滑动的最大值；

监听原生touchend事件，若此时元素滑动达到最大值，则触发callback，同时将translateY重设为0，元素回到初始位置

1.51 JS 中的数组和函数在内存中是如何存储的？

Array-Speicher in JavaScript muss grob in zwei Situationen unterteilt werden:

Arrays mit demselben Datentyp weisen kontinuierlichen Speicherplatz zu.

Arrays mit nicht demselben Datentyp verwenden Hash-Mapping, um Speicherplatz zuzuweisen.

Warme Erinnerung: Ja Stellen Sie sich vor, dass der kontinuierliche Speicherplatz nur den Speicherort basierend auf dem Index (Zeiger) direkt berechnen muss. Wenn es sich um eine Hash-Map handelt, müssen Sie zuerst den Indexwert berechnen. Wenn dann ein Konflikt im Indexwert vorliegt, müssen Sie eine zweite Suche durchführen (Sie müssen wissen, wie der Hash gespeichert wird).

2. Abschluss und Geltungsbereich

2.1 Was ist Abschluss?

Offizielle Aussage: Ein Abschluss bezieht sich auf eine Funktion, die das Recht hat, auf Variablen im Gültigkeitsbereich einer anderen Funktion zuzugreifen.

MDN sagt: Der Abschluss ist eine besondere Art von Objekt. Es besteht aus zwei Teilen: der Funktion und der Umgebung, in der die Funktion erstellt wird. Die Umgebung besteht aus allen lokalen Variablen, die zum Zeitpunkt der Erstellung des Abschlusses im Gültigkeitsbereich waren.

Ausführliche Antwort

Wenn der Browser die Seite lädt, legt er den Code zur Ausführung im Stapelspeicher (ECStack) ab. Durch das Schieben der Funktion in den Stapel wird ein privater Kontext (EC) generiert Verwenden Sie Variablen (AO) im Inneren vor externen Eingriffen. Wenn ein Teil des Inhalts im aktuellen Ausführungskontext durch Inhalte außerhalb des Kontexts belegt wird, wird der aktuelle Kontext nicht vom Stapel freigegeben, sodass die Variablen und Variablenwerte in Es kann gespeichert werden, daher denke ich, dass der Abschluss eine Art Erhaltungs- und Schutzmechanismus für interne private Variablen ist.

2.2 Die Rolle von Abschlüssen

Abschlüsse haben zwei häufige Verwendungszwecke:

Die erste Verwendung von Abschlüssen besteht darin, uns den Zugriff auf Variablen innerhalb der Funktion von außerhalb der Funktion zu ermöglichen. Durch die Verwendung von Abschlüssen können Sie extern auf die Variablen innerhalb der Funktion zugreifen, indem Sie die Abschlussfunktion extern aufrufen. Mit dieser Methode können Sie private Variablen erstellen.

Eine weitere Verwendung des Abschlusses besteht darin, zuzulassen, dass das Variablenobjekt im beendeten Funktionskontext im Speicher verbleibt. Da die Abschlussfunktion einen Verweis auf das Variablenobjekt beibehält, wird das Variablenobjekt nicht recycelt.

2.3 Die Referenzszenarien von Abschlüssen in Projekten und die damit verbundenen Probleme

In tatsächlichen Projekten verpacken Sie den Inhalt der von Ihnen geschriebenen Module basierend auf Abschlüssen, damit Sie Ihren eigenen Code schützen können privat, um Konflikte mit globalen Variablen oder anderem Code zu verhindern. Dies wird durch die Verwendung eines Schutzmechanismus erreicht.

Es wird jedoch nicht empfohlen, zu viele Abschlüsse zu verwenden, da die Verwendung eines nicht freigegebenen Kontexts Stapelspeicherplatz beansprucht und eine übermäßige Verwendung zu Speicherverlusten führen kann.

Die Möglichkeit, das durch Schließungen verursachte Speicherverlustproblem zu lösen, besteht darin, die Schließungsfunktion nach der Verwendung manuell freizugeben. 2.4 Verwendungsszenarien von Schließungen

var compose = (...funcs) => { // funcs(数组)：记录的是所有的函数 // 这里其实也是利用了柯里化的思想，函数执行，生成一个闭包，预先把一些信息存储，供下级上下文使用 return (x) => { var len = funcs.length; // 如果没有函数执行，直接返回结果 if (len === 0) return x; if (len === 1) funcs[0](x); return funcs.reduceRight((res, func) => { return func(res); }, x); }; }; var resFn = compose(c, b, a, a); resFn(1);

//一般会这样实现 var test = (function () { var t = null; return function () { if (t) { return t; } t = new Date().getTime(); return t; } })(); // 用惰性函数实现 var test = function () { var t = new Date().getTime(); test = function () { return t; } return test(); } console.log(test()); console.log(test()); console.log(test());

/* let a = 8 function fn(a) { a = 9 } fn(a) console.log(a) // 8 */ let a = { age: 8 } function fn(a) { a.age = 9 } fn(a) console.log(a.age) // 9