这是我参与更文挑战的第29天，活动详情查看： 更文挑战
14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第一部分 1-100题)
14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第二部分 101-200题)
14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第三部分 201-300题)
14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第四部分 301-370题)
14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第五部分 371-424题)
为了方便阅览，我在必要位置都放了回顶部或者回对应问题的链接
201.如何获取任何对象的键列表？
您可以使用Object.keys()用于返回给定对象自己的属性名称的数组的方法，其顺序与我们使用普通循环获得的顺序相同。例如，您可以获取用户对象的键，
const user = {
name: 'Haiyong',
gender: 'male',
age: 40
};
console.log(Object.keys(user)); //['name', 'gender', 'age']
202.你如何用 prototype 创建一个对象？
Object.create() 方法用于创建具有指定原型对象和属性的新对象。即，它使用现有对象作为新创建对象的原型。它返回一个具有指定原型对象和属性的新对象。
const user = {
name: 'Haiyong',
printInfo: function () {
console.log(`My name is ${this.name}.`);
}
};
const admin = Object.create(user);
admin.name = "Nick"; //请记住，"name"是在"admin"而非"user"对象上设置的属性
admin.printInfo(); // My name is Nick
203.什么是WeakSet？
WeakSet 用于存储弱（弱引用）持有对象的集合。语法如下，
new WeakSet([iterable]);
让我们看下面的例子来解释它的行为，
var ws = new WeakSet();
var user = {};
ws.add(user);
ws.has(user); // true
ws.delete(user); // 从集合中删除user
ws.has(user); // false, user 已被删除
204.WeakSet 和 Set 有什么区别？
主要区别在于 Set 中对象的引用是强引用，而 WeakSet 中对象的引用是弱引用。即，如果没有其他引用 WeakSet 中的对象可以被垃圾回收。
其他区别是，
1.Sets 可以存储任何值而 WeakSets 只能存储对象的集合 2.WeakSet 没有与 Set 不同的 size 属性 3.WeakSet 没有 clear、keys、values、entries、forEach 等方法。 4.WeakSet 不可迭代。
205.列出 WeakSet 上可用的方法集合？
下面是 WeakSet 上可用的方法列表，
1.add(value)：将给定值附加到弱集的新对象 2.delete(value)：从 WeakSet 集合中删除值。 3.has(value)：如果 WeakSet 集合中存在该值，则返回 true，否则返回 false。 4.length()：它返回weakSetObject的长度让我们在一个例子中看看上述所有方法的功能，
var weakSetObject = new WeakSet();
var firstObject = {};
var secondObject = {};
// add(value)
weakSetObject.add(firstObject);
weakSetObject.add(secondObject);
console.log(weakSetObject.has(firstObject)); //true
console.log(weakSetObject.length()); //2
weakSetObject.delete(secondObject);
206.什么是 WeakMap？
WeakMap 对象是键/值对的集合，其中的键被弱引用。在这种情况下，键必须是对象，值可以是任意值。语法如下所示，
new WeakMap([iterable])
让我们看下面的例子来解释它的行为，
var ws = new WeakMap();
var user = {};
ws.set(user);
ws.has(user); // true
ws.delete(user); // 从 map 中删除用户
ws.has(user); // false, user 已被删除
207.WeakMap 和 Map 有什么区别？
主要区别在于 Map 中关键对象的引用是强引用，而 WeakMap 中关键对象的引用是弱引用。即，如果没有其他引用 WeakMap 中的键对象可以被垃圾收集。
其他区别是，
1.Maps 可以存储任何类型的键，而 WeakMaps 只能存储键对象的集合 2.与 Map 不同，WeakMap 没有 size 属性 3.WeakMap 没有 clear、keys、values、entries、forEach 等方法。 4.WeakMap 不可迭代。
208.列出 WeakMap 上可用的方法集合？
下面是 WeakMap 上可用的方法列表，
1.set(key, value)：设置 WeakMap 对象中键的值。返回 WeakMap 对象。 2.delete(key)：删除与键关联的任何值。 3.has(key)：返回一个布尔值，断言一个值是否与 WeakMap 对象中的键相关联。 4.get(key)：返回与键关联的值，如果没有则返回 undefined。让我们在一个例子中看看上述所有方法的功能，
var weakMapObject = new WeakMap();
var firstObject = {};
var secondObject = {};
// set(key, value)
weakMapObject.set(firstObject, 'Haiyong');
weakMapObject.set(secondObject, 100);
console.log(weakMapObject.has(firstObject)); //true
console.log(weakMapObject.get(firstObject)); // Haiyong
weakMapObject.delete(secondObject);
209.uneval 的目的是什么？
uneval() 是一个内置函数，用于创建对象源代码的字符串表示。它是一个顶级函数，不与任何对象相关联。让我们看下面的例子来了解更多关于它的功能，
var a = 1;
uneval(a); // 返回一个包含 1 的字符串
uneval(function user() {}); // returns "(function user(){})"
210.你如何 encode (编码)一个 URL？
encodeURI() 函数用于对除 (, / ? : @ & = + $ #) 字符外具有特殊字符的完整 URI 进行编码。
var uri = 'https://mozilla.org/?x=шеллы';
var encoded = encodeURI(uri);
console.log(encoded); // https://mozilla.org/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B
211.你如何 decode (解码)一个 URL？
decodeURI() 函数用于解码之前由 encodeURI() 创建的统一资源标识符 (URI)。
var uri = 'https://mozilla.org/?x=шеллы';
var encoded = encodeURI(uri);
console.log(encoded); // https://mozilla.org/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B
try {
console.log(decodeURI(encoded)); // "https://mozilla.org/?x=шеллы"
} catch(e) { // 捕获格式错误的 URI
console.error(e);
}
212.你如何打印网页的内容？
window 对象提供了一个 print() 方法，用于打印当前窗口的内容。它会打开一个打印对话框，让您在各种打印选项之间进行选择。让我们在一个例子中看看print方法的用法，
<input type="button" value="Print" onclick="window.print()" />
注意：在大多数浏览器中，它会在打印对话框打开时被阻止。
213.uneval 和 eval 有什么区别？
该uneval函数返回给定对象的来源；而该eval函数则相反，通过评估不同内存区域中的源代码。让我们看一个例子来澄清差异，
var msg = uneval(function greeting() { return 'Hello, Good morning'; });
var greeting = eval(msg);
greeting(); // returns "Hello, Good morning"
214.什么是 anonymous (匿名)函数？
匿名函数就是没有名字的函数！匿名函数通常分配给变量名称或用作回调函数。语法如下，
function (optionalParameters) {
//do something
}
const myFunction = function(){ //分配给变量的匿名函数
//do something
};
[1, 2, 3].map(function(element){ //匿名函数用作回调函数
//do something
});
让我们在一个例子中看看上面的匿名函数，
var x = function (a, b) {return a * b};
var z = x(5, 10);
console.log(z); // 50
215.局部变量和全局变量的优先顺序是什么？
局部变量优先于同名的全局变量。让我们在一个例子中看看这种行为。
var msg = "Good morning";
function greeting() {
msg = "Good Evening";
console.log(msg);
}
greeting();
216.什么是 javascript 访问器？
ECMAScript 5 通过 getter 和 setter 引入了 javascript 对象访问器或计算属性。Getters 使用get关键字，而 Setters 使用set关键字。
var user = {
firstName: "Hai",
lastName : "Yong",
language : "cn",
get lang() {
return this.language;
}
set lang(lang) {
this.language = lang;
}
};
console.log(user.lang); // getter 访问 lang as cn
user.lang = 'en';
console.log(user.lang); // setter 用于将 lang 设置为 en
217.你如何在对象构造函数上定义属性？
Object.defineProperty() 静态方法用于直接在对象上定义新属性，或修改对象上现有的属性，并返回该对象。让我们看一个例子来了解如何定义属性，
const newObject = {};
Object.defineProperty(newObject, 'newProperty', {
value: 100,
writable: false
});
console.log(newObject.newProperty); // 100
newObject.newProperty = 200; // 由于可写设置，它在严格模式下抛出错误
218.get 和defineProperty 有什么区别？
除非您使用类，否则两者都有相似的结果。如果您使用get该属性将在对象的原型上定义，而使用Object.defineProperty()该属性将在它应用到的实例上定义。
219.Getter 和 Setter 的优点是什么？
以下是 Getter 和 Setter 的好处列表，
1.它们提供更简单的语法 2.它们用于定义计算属性或 JS 中的访问器。 3.用于提供属性和方法之间的等价关系 4.他们可以提供更好的数据质量 5.对于使用封装的逻辑在幕后做事很有用。
220.我可以使用defineProperty方法添加 getter 和 setter 吗？
是的，您可以使用该Object.defineProperty()方法添加 Getter 和 Setter。例如，下面的计数器对象使用递增、递减、加减属性，
var obj = {counter : 0};
// Define getters
Object.defineProperty(obj, "increment", {
get : function () {this.counter++;}
});
Object.defineProperty(obj, "decrement", {
get : function () {this.counter--;}
});
// Define setters
Object.defineProperty(obj, "add", {
set : function (value) {this.counter += value;}
});
Object.defineProperty(obj, "subtract", {
set : function (value) {this.counter -= value;}
});
obj.add = 10;
obj.subtract = 5;
console.log(obj.increment); //6
console.log(obj.decrement); //5
221.switch-case 的目的是什么？
JavaScript 中的 switch case 语句用于决策目的。在某些情况下，使用 switch case 语句会比 if-else 语句更方便。语法如下，
switch (expression)
{
case value1:
statement1;
break;
case value2:
statement2;
break;
.
.
case valueN:
statementN;
break;
default:
statementDefault;
}
上面的多路分支语句提供了一种简单的方法，可以根据表达式的值将执行分派到代码的不同部分。
222.使用 swtich case 需要遵循什么规定？
以下是应注意的规定列表，
1.表达式可以是数字或字符串类型。 2.表达式不允许重复值。 3.默认语句是可选的。如果传递给 switch 的表达式与任何 case 值都不匹配，则将执行 default case 中的语句。 4.break 语句在 switch 中用于终止语句序列。 5.break 语句是可选的。但如果省略，执行将继续到下一个案例。
223.什么是原始数据类型？
原始数据类型是具有原始值（没有属性或方法）的数据。有 7 种原始数据类型。
1.string 2.number 3.boolean 4.null 5.undefined 6.bigint 7.symbol
224.访问对象属性的不同方式有哪些？
有 3 种可能的方法来访问对象的属性。
点符号：它使用点来访问属性
objectName.property
方括号表示法：它使用方括号进行属性访问
objectName["property"]
表达式符号：它使用方括号中的表达式
objectName[expression]
225.什么是函数参数规则？
JavaScript 函数遵循以下参数规则，
1.函数定义不指定参数的数据类型。 2.不要对传递的参数执行类型检查。 3.不要检查收到的参数数量。即，以下函数遵循上述规则，
function functionName(parameter1, parameter2, parameter3) {
console.log(parameter1); // 1
}
functionName(1);
226.什么是错误对象？
错误对象是一个内置的错误对象，它在发生错误时提供错误信息。它有两个属性：名称和消息。例如，以下函数记录错误详细信息，
try {
greeting("Welcome");
}
catch(err) {
console.log(err.name + "<br>" + err.message);
}
227.当你收到语法错误时
如果您尝试评估具有语法错误的代码，则会引发 SyntaxError。例如，下面缺少的函数参数引用会引发语法错误
try {
eval("greeting('welcome)"); // Missing ' will produce an error
}
catch(err) {
console.log(err.name);
}
228.错误对象有哪些不同的错误名称？
错误对象返回了 6 种不同类型的错误名称，
| 错误名称 | 说明 |
|---|---|
| EvalError | eval() 函数发生错误 |
| RangeError | 数字“超出范围”发生错误 |
| ReferenceError | 由于非法引用而导致的错误 |
| SyntaxError | 语法错误导致的错误 |
| TypeError | 类型错误导致的错误 |
| URIError | 由于 encodeURI() 导致的错误 |
229.错误处理中的各种语句是什么？
以下是错误处理中使用的语句列表，
1.try：该语句用于测试代码块是否有错误 2.catch：该语句用于处理错误 3.throw：此语句用于创建自定义错误。 4.finally：该语句用于在 try 和 catch 之后执行代码，而不管结果如何。
230.javascript中的两种类型的循环是什么？
1.进入Controlled Loops受控循环：在这种循环类型中，在进入循环体之前测试测试条件。例如，For 循环和 While 循环就属于这一类。
2.退出 Controlled Loops：在这种循环类型中，测试条件在循环体的末尾进行测试或评估。即，无论测试条件为真还是假，循环体都将至少执行一次。例如，do-while 循环就属于这一类。
231.什么是 nodejs？
Node.js 是一个基于 Chrome 的 JavaScript 运行时构建的服务器端平台，用于轻松构建快速且可扩展的网络应用程序。它是一个基于事件的、非阻塞的、异步的 I/O 运行时，使用谷歌的 V8 JavaScript 引擎和 libuv 库。
232.什么是 Intl 对象？
Intl 对象是 ECMAScript 国际化 API 的命名空间，它提供语言敏感的字符串比较、数字格式以及日期和时间格式。它提供对几个构造函数和语言敏感函数的访问。
233.你如何执行特定于语言的日期和时间格式化？
您可以使用Intl.DateTimeFormat对象，它是启用语言敏感日期和时间格式的对象的构造函数。让我们用一个例子来看看这个行为，
var date = new Date(Date.UTC(2019, 07, 07, 3, 0, 0));
console.log(new Intl.DateTimeFormat('en-GB').format(date)); // 07/08/2019
console.log(new Intl.DateTimeFormat('en-AU').format(date)); // 07/08/2019
234.什么是迭代器？
迭代器是一个对象，它在终止时定义一个序列和一个返回值。它使用一个next()方法实现迭代器协议，该方法返回一个具有两个属性的对象：（value序列中的下一个值）和done（如果序列中的最后一个值已被消耗，则为真）。
235.同步迭代是如何工作的？
ES6 中引入了同步迭代，它适用于以下组件集，
Iterable：它是一个可以通过其键为 Symbol.iterator 的方法迭代的对象。
迭代器：它是通过调用[Symbol.iterator]()可迭代对象返回的对象。这个迭代器对象将每个迭代的元素包装在一个对象中，并通过next()方法一一返回。
IteratorResult：next()方法返回的对象。该对象包含两个属性；该value属性包含一个迭代元素，该done属性确定该元素是否是最后一个元素。
让我们用下面的数组演示同步迭代，
const iterable = ['one', 'two', 'three'];
const iterator = iterable[Symbol.iterator]();
console.log(iterator.next()); // { value: 'one', done: false }
console.log(iterator.next()); // { value: 'two', done: false }
console.log(iterator.next()); // { value: 'three', done: false }
console.log(iterator.next()); // { value: 'undefined, done: true }
236.什么是事件循环？
事件循环是一个回调函数队列。当异步函数执行时，回调函数被推入队列。JavaScript 引擎在异步函数执行完代码之前不会开始处理事件循环。
==注意==：即使 JavaScript 是单线程的，它也允许 Node.js 执行非阻塞 I/O 操作。
237.什么是调用栈？
调用堆栈是 javascript 解释器的一种数据结构，用于跟踪程序中的函数调用。它有两个主要动作，
1.每当你调用一个函数来执行它时，你就是在将它压入堆栈。 2.每当执行完成时，函数就会从堆栈中弹出。
让我们举个例子，它是图表格式的状态表示
function hungry() {
eatFruits();
}
function eatFruits() {
return "I'm eating fruits";
}
// Invoke the `hungry` function
hungry();
上面的代码在调用堆栈中处理如下，
1.将hungry()函数添加到调用堆栈列表并执行代码。
2.将eatFruits()函数添加到调用堆栈列表并执行代码。
3.eatFruits()从我们的调用堆栈列表中删除该函数。
4.hungry()从调用堆栈列表中删除该函数，因为不再有项目。
238.什么是事件队列？
对消息或事件的发送与处理进行时间上的解耦。通俗地讲就是在队列中按先入先出的顺序存储一系列通知或请求。 发送通知时，将请求放入队列并返回。 处理请求的系统之后稍晚从队列中获取请求并处理。
239.什么是装饰器？
装饰器是一个表达式，其计算结果为函数，并将目标、名称和装饰器描述符作为参数。此外，它还可以选择返回一个装饰器描述符以安装在目标对象上。让我们在设计时为用户类定义管理装饰器，
function admin(isAdmin) {
return function(target) {
target.isAdmin = isAdmin;
}
}
@admin(true)
class User() {
}
console.log(User.isAdmin); //true
@admin(false)
class User() {
}
console.log(User.isAdmin); //false
240.Intl 对象的属性是什么？
以下是 Intl 对象上可用的属性列表，
1.Collator：这些是启用对语言敏感的字符串比较的对象。 2.DateTimeFormat：这些是启用对语言敏感的日期和时间格式的对象。 3.ListFormat：这些是启用语言敏感列表格式的对象。 4.NumberFormat：启用对语言敏感的数字格式的对象。 5.PluralRules：启用复数敏感格式和复数语言特定规则的对象。 6.RelativeTimeFormat：启用对语言敏感的相对时间格式的对象。
241.什么是一元运算符？
一元（+）运算符用于将变量转换为数字。如果变量无法转换，它仍然会变成数字，但值为 NaN。让我们在一个动作中看看这个行为。
var x = "100";
var y = + x;
console.log(typeof x, typeof y); // string, number
var a = "Hello";
var b = + a;
console.log(typeof a, typeof b, b); // string, number, NaN
242.如何对数组中的元素进行排序？
sort() 方法用于对数组元素进行原地排序并返回排序后的数组。示例用法如下，
var months = ["Aug", "Sep", "Jan", "June"];
months.sort();
console.log(months); // ["Aug", "Jan", "June", "Sep"]
243.排序数组时 compareFunction 的目的是什么？
compareFunction 用于定义排序顺序。如果省略，数组元素将转换为字符串，然后根据每个字符的 Unicode 代码点值进行排序。举个例子来看看compareFunction的用法，
let numbers = [1, 2, 5, 3, 4];
numbers.sort((a, b) => b - a);
console.log(numbers); // [5, 4, 3, 2, 1]
244.你如何反转数组？
您可以使用 reverse() 方法来反转数组中的元素。此方法对于按降序对数组进行排序很有用。让我们在一个例子中看看 reverse() 方法的用法，
let numbers = [1, 2, 5, 3, 4];
numbers.sort((a, b) => b - a);
numbers.reverse();
console.log(numbers); // [1, 2, 3, 4 ,5]
245.你如何在数组中找到最小值和最大值？
您可以对数组变量使用Math.min和Math.max方法来查找数组中的最小和最大元素。让我们创建两个函数来查找数组中的最小值和最大值，
var marks = [50, 20, 70, 60, 45, 30];
function findMin(arr) {
return Math.min.apply(null, arr);
}
function findMax(arr) {
return Math.max.apply(null, arr);
}
console.log(findMin(marks));
console.log(findMax(marks));
246.如何在没有math函数的情况下找到最小值和最大值？
您可以编写循环遍历数组的函数，将每个值与最小值或最大值进行比较，以找到最小值和最大值。让我们创建这些函数来查找最小值和最大值，
var marks = [50, 20, 70, 60, 45, 30];
function findMin(arr) {
var length = arr.length
var min = Infinity;
while (length--) {
if (arr[length] < min) {
min = arr[len];
}
}
return min;
}
function findMax(arr) {
var length = arr.length
var max = -Infinity;
while (len--) {
if (arr[length] > max) {
max = arr[length];
}
}
return max;
}
console.log(findMin(marks));
console.log(findMax(marks));
247.什么是空语句及其目的？
空语句是一个分号 (;)，表示不会执行任何语句，即使 JavaScript 语法需要一个。由于空语句没有动作，您可能认为它的用法很少，但是当您想创建具有空主体的循环时，空语句有时很有用。例如，您可以使用零值初始化一个数组，如下所示，
// Initialize an array a
for(int i=0; i < a.length; a[i++] = 0) ;
248.如何获取模块的元数据？
您可以使用import.meta作为元属性的对象，将特定于上下文的元数据暴露给 JavaScript 模块。它包含有关当前模块的信息，例如模块的 URL。在浏览器中，您可能会获得与 NodeJS 不同的元数据。
<script type="module" src="welcome-module.js"></script>
console.log(import.meta); // { url: "file:///home/user/welcome-module.js"
249.什么是逗号运算符？
逗号运算符用于从左到右评估其每个操作数并返回最后一个操作数的值。这与数组、对象和函数参数和参数中的逗号用法完全不同。例如，数字表达式的用法如下，
var x = 1;
x = (x++, x);
console.log(x); // 2
250.逗号运算符的优点是什么？
它通常用于在需要单个表达式的位置包含多个表达式。此逗号运算符的常见用法之一是在for循环中提供多个参数。例如，下面的 for 循环使用逗号运算符在单个位置使用多个表达式，
for (var a = 0, b =10; a <= 10; a++, b--)
您还可以在 return 语句中使用逗号运算符，它在返回之前处理。
function myFunction() {
var a = 1;
return (a += 10, a); // 11
}
251.什么是 typescript ？
TypeScript 是由 Microsoft 创建的 JavaScript 类型化超集，它添加了可选类型、类、async/await 和许多其他功能，并编译为纯 JavaScript。Angular 完全用 TypeScript 构建并用作主要语言。您可以将其全局安装为
npm install -g typescript
让我们看一个简单的 TypeScript 用法示例，
function greeting(name: string): string {
return "Hello, " + name;
}
let user = "Sudheer";
console.log(greeting(user));
问候方法只允许字符串类型作为参数。
252.javascript 和 typescript 有什么区别？
以下是 javascript 和 typescript 之间的差异列表
| 功能 | typescript | javascript |
|---|---|---|
| 语言范式 | 面向对象的编程语言 | 脚本语言 |
| 打字支持 | 支持静态类型 | 它具有动态类型 |
| 模块 | 支持 | 不支持 |
| 界面 | 它有接口概念 | 不支持接口 |
| 可选参数 | 函数支持可选参数 | 不支持函数的可选参数 |
253.typescript 相对于 javascript 的优势是什么？
以下是打字稿相对于 javascript 的一些优势，
1.TypeScript 只能在开发时发现编译时错误，并确保减少运行时错误。而 javascript 是一种解释性语言。 2.TypeScript 是强类型或支持静态类型，允许在编译时检查类型正确性。这在 javascript 中不可用。 3.TypeScript 编译器可以将 .ts 文件编译成 ES3、ES4 和 ES5，这与某些浏览器可能不支持的 JavaScript 的 ES6 特性不同。
254.什么是对象初始值设定项？
对象初始值设定项是描述对象初始化的表达式。此表达式的语法表示为以逗号分隔的零或多对属性名称和对象关联值的列表，用花括号 ({}) 括起来。这也称为字面表示法。它是创建对象的方法之一。
var initObject = {a: 'Haiyong', b: 50, c: {}};
console.log(initObject.a); // Haiyong
255.什么是构造方法？
构造函数方法是用于创建和初始化在类中创建的对象的特殊方法。如果未指定构造函数方法，则使用默认构造函数。构造函数的示例用法如下，
class Employee {
constructor() {
this.name = "Haiyong";
}
}
var employeeObject = new Employee();
console.log(employeeObject.name); // Haiyong
256.如果在一个类中多次编写构造函数会发生什么？
类中的“构造函数”是一种特殊的方法，在一个类中只能定义一次。即，如果您在一个类中多次编写构造函数方法，它将抛出SyntaxError错误。
class Employee {
constructor() {
this.name = "Haiyong";
}
constructor() { // Uncaught SyntaxError: A class may only have one constructor（未捕获的语法错误：一个类可能只有一个构造函数）
this.age = 30;
}
}
var employeeObject = new Employee();
console.log(employeeObject.name);
257.如何调用父类的构造函数？
您可以使用super关键字来调用父类的构造函数。请记住，super()必须在使用“this”引用之前调用。否则会导致引用错误。让我们使用它，
class Square extends Rectangle {
constructor(length) {
super(length, length);
this.name = 'Square';
}
get area() {
return this.width * this.height;
}
set area(value) {
this.area = value;
}
}
258.你如何获得一个对象的 prototype？
您可以使用该Object.getPrototypeOf(obj)方法返回指定对象的原型。即内部prototype属性的值。如果没有继承的属性，则null返回值。
const newPrototype = {};
const newObject = Object.create(newPrototype);
console.log(Object.getPrototypeOf(newObject) === newPrototype); // true
259.如果我为 getPrototype 方法传递字符串类型会发生什么？
在 ES5 中，如果 obj 参数不是对象，它将抛出 TypeError 异常。而在 ES2015 中，该参数将被强制转换为Object.
// ES5
Object.getPrototypeOf('CSDN'); // TypeError: "CSDN" is not an object
// ES2015
Object.getPrototypeOf('CSDN'); // String.prototype
260.如何将一个对象的 prototype 设置为另一个对象？
您可以使用将指定对象Object.setPrototypeOf()的原型（即内部Prototype属性）设置为另一个对象或null 的方法。例如，如果要将方形对象的原型设置为矩形对象，则如下所示，
Object.setPrototypeOf(Square.prototype, Rectangle.prototype);
Object.setPrototypeOf({}, null);
261.你如何检查一个对象是否可以扩展？
该Object.isExtensible()方法用于确定对象是否可扩展。即，它是否可以添加新属性。
const newObject = {};
console.log(Object.isExtensible(newObject)); //true
==注意==：默认情况下，所有对象都是可扩展的。即，可以添加或修改新属性。
262.如何防止对象扩展？
该Object.preventExtensions()方法用于防止向对象添加新属性。换句话说，它可以防止将来对对象进行扩展。让我们看看这个属性的用法，
const newObject = {};
Object.preventExtensions(newObject); // 不可扩展
try {
Object.defineProperty(newObject, 'newProperty', { // 添加新属性
value: 100
});
} catch (e) {
console.log(e); // 类型错误：无法定义属性 newProperty，对象不可扩展
}
263.使对象不可扩展的不同方法有哪些？
您可以通过 3 种方式将对象标记为不可扩展，
1.Object.preventExtensions 2.Object.seal 3.Object.freeze
var newObject = {};
Object.preventExtensions(newObject); // 防止对象不可扩展
Object.isExtensible(newObject); // false
var sealedObject = Object.seal({}); // 密封对象不可扩展
Object.isExtensible(sealedObject); // false
var frozenObject = Object.freeze({}); // 冻结的对象是不可扩展的
Object.isExtensible(frozenObject); // false
264.如何在一个对象上定义多个属性？
该Object.defineProperties()方法用于直接在对象上定义新属性或修改现有属性并返回该对象。让我们在一个空对象上定义多个属性，
const newObject = {};
Object.defineProperties(newObject, {
newProperty1: {
value: 'Haiyong',
writable: true
},
newProperty2: {}
});
265.JavaScript 中的 MEAN 是什么？
MEAN（MongoDB、Express、AngularJS 和 Node.js）堆栈是最流行的开源 JavaScript 软件技术堆栈，可用于构建动态 Web 应用程序，您可以在其中编写 Web 项目的服务器端和客户端两部分完全在 JavaScript 中。
266.什么是 javascript 中的混淆？
混淆是故意创建人类难以理解的混淆 javascript 代码（即源代码或机器代码）的行为。它类似于加密，但机器可以理解代码并执行它。 让我们在混淆之前看看下面的函数，
function greeting() {
console.log('Hello, welcome to JS world');
}
在代码混淆之后，它会出现如下，
eval(function(p,a,c,k,e,d){e=function(c){return c};if(!''.replace(/^/,String)
267.为什么需要混淆？
以下是混淆的几个原因，
1.代码大小将减少。所以服务器和客户端之间的数据传输会很快。 2.它对外界隐藏业务逻辑并保护代码不受他人影响 3.逆向工程难度很大 4.下载时间将减少
268.什么是Minification（缩小）？
缩小是删除所有不必要的字符（删除空格）的过程，变量将被重命名而不改变其功能。这也是一种混淆。
269.缩小有什么好处？
通常情况下，建议在流量大和资源密集需求的情况下使用最小化。它减少了文件大小，具有以下好处，
1.减少网页的加载时间 2.节省带宽使用量
270.混淆和加密有什么区别？
以下是混淆和加密之间的主要区别，
| 特色 | 混淆 | 加密 |
|---|---|---|
| 定义 | 以任何其他形式更改任何数据的形式 | 使用密钥将信息的形式更改为不可读的格式 |
| 解码的钥匙 | 无需任何密钥即可解码 | 它是必需的 |
| 目标数据格式 | 它将被转换为复杂的形式 | 转换成不可读的格式 |
271.常用的缩小工具有哪些？
有许多在线/离线工具可以缩小 javascript 文件，
- 谷歌的 Closure 编译器
- jsmin
- javascript-minifier.com
- Prettydiff.com
272.你如何使用 javascript 执行表单验证？
JavaScript 可用于执行 HTML 表单验证。比如表单域为空，函数需要通知，返回false，防止表单被提交。 让我们以 html 形式执行用户登录，
<form name="myForm" onsubmit="return validateForm()" method="post">
User name: <input type="text" name="uname">
<input type="submit" value="Submit">
</form>
用户登录验证如下，
function validateForm() {
var x = document.forms["myForm"]["uname"].value;
if (x == "") {
alert("The username shouldn't be empty");
return false;
}
}
273.如何在没有 javascript 的情况下执行表单验证？
您可以在不使用 javascript 的情况下自动执行 HTML 表单验证。通过应用required属性启用验证以防止在输入为空时提交表单。
<form method="post">
<input type="text" name="uname" required>
<input type="submit" value="Submit">
</form>
==注意==：自动表单验证在 Internet Explorer 9 或更早版本中不起作用。
274.可用于约束验证的 DOM 方法有哪些？
以下 DOM 方法可用于对无效输入进行约束验证，
1.checkValidity()：如果输入元素包含有效数据，则返回 true。 2.setCustomValidity()：用于设置输入元素的validationMessage 属性。让我们使用带有 DOM 验证的用户登录表单
function myFunction() {
var userName = document.getElementById("uname");
if (!userName.checkValidity()) {
document.getElementById("message").innerHTML = userName.validationMessage;
} else {
document.getElementById("message").innerHTML = "Entered a valid username";
}
}
275.什么是可用的约束验证 DOM 属性？
下面是一些可用的约束验证 DOM 属性的列表，
1.validity：它提供与输入元素有效性相关的布尔属性列表。 2.validationMessage：当有效性为假时显示消息。 3.willValidate：指示输入元素是否将被验证。
276.什么是有效性属性列表？
输入元素的有效性属性提供一组与数据有效性相关的属性。
1.customError：如果设置了自定义有效性消息，则返回 true。 2.patternMismatch：如果元素的值与其模式属性不匹配，则返回 true。 3.rangeOverflow：如果元素的值大于其 max 属性，则返回 true。 4.rangeUnderflow：如果元素的值小于其 min 属性，则返回 true。 5.stepMismatch：如果元素的值根据 step 属性无效，则返回 true。 6.tooLong：如果元素的值超过其 maxLength 属性，则返回 true。 7.typeMismatch：如果元素的值根据 type 属性无效，则返回 true。 8.valueMissing：如果具有必需属性的元素没有值，则返回 true。 9.valid：如果元素的值有效，则返回 true。
277.举例使用 rangeOverflow 属性？
如果元素的值大于其 max 属性，则 rangeOverflow 属性返回 true。例如，如果值大于 100，下面的表单提交会引发错误，
<input id="age" type="number" max="100">
<button onclick="myOverflowFunction()">OK</button>
function myOverflowFunction() {
if (document.getElementById("age").validity.rangeOverflow) {
alert("The mentioned age is not allowed");
}
}
278.javascript 中是否提供枚举功能？
不，javascript 本身不支持枚举。但是有不同种类的解决方案可以模拟它们，即使它们可能无法提供精确的等效项。例如，您可以在对象上使用冻结或密封，
var DaysEnum = Object.freeze({"monday":1, "tuesday":2, "wednesday":3, ...})
279.什么是枚举？
枚举是一种将变量限制为一组预定义常量中的一个值的类型。JavaScript 没有枚举，但 typescript 提供了内置的枚举支持。
enum Color {
RED, GREEN, BLUE
}
280.你如何列出一个对象的所有属性？
您可以使用该Object.getOwnPropertyNames()方法返回直接在给定对象中找到的所有属性的数组。让我们在一个例子中使用它，
const newObject = {
a: 1,
b: 2,
c: 3
};
console.log(Object.getOwnPropertyNames(newObject)); ["a", "b", "c"]
281.如何获取对象的属性描述符？
您可以使用Object.getOwnPropertyDescriptors()返回给定对象的所有自己的属性描述符的方法。此方法的示例用法如下，
const newObject = {
a: 1,
b: 2,
c: 3
};
const descriptorsObject = Object.getOwnPropertyDescriptors(newObject);
console.log(descriptorsObject.a.writable); //true
console.log(descriptorsObject.a.configurable); //true
console.log(descriptorsObject.a.enumerable); //true
console.log(descriptorsObject.a.value); // 1
282.属性描述符提供的属性是什么？
属性描述符是具有以下属性的记录
1.value：与属性关联的值 2.writable：确定与属性关联的值是否可以更改 3.configurable：如果可以更改此属性描述符的类型并且可以从相应的对象中删除该属性，则返回 true。 4.enumerable：确定在枚举对应对象上的属性时是否出现该属性。 5.set: 一个作为属性设置器的函数 6.get：作为属性的 getter 的函数
283.你如何扩展类？
该extends关键字在类声明/表达式中用于创建一个类，该类是另一个类的子类。它可用于子类化自定义类以及内置对象。语法如下，
class ChildClass extends ParentClass { ... }
让我们以 Polygon 父类的 Square 子类为例，
class Square extends Rectangle {
constructor(length) {
super(length, length);
this.name = 'Square';
}
get area() {
return this.width * this.height;
}
set area(value) {
this.area = value;
}
}
284.如何在不重新加载页面的情况下修改 url？
该window.location.url属性将有助于修改 url，但它会重新加载页面。HTML5 引入了 history.pushState() 和 history.replaceState() 方法，分别允许您添加和修改历史条目。例如，您可以使用 pushState 如下，
window.history.pushState('page2', 'Title', '/page2.html');
285.如何检查数组是否包含特定值？
该Array#includes()方法用于通过返回 true 或 false 来确定数组是否在其条目中包含特定值。让我们看一个在数组中查找元素（数字和字符串）的示例。
var numericArray = [1, 2, 3, 4];
console.log(numericArray.includes(3)); // true
var stringArray = ['green', 'yellow', 'blue'];
console.log(stringArray.includes('blue')); //true
286.你如何比较标量数组？
您可以使用 length 和数组的 every 方法来比较两个标量（直接使用 === 进行比较）数组。这些表达式的组合可以给出预期的结果，
const arrayFirst = [1,2,3,4,5];
const arraySecond = [1,2,3,4,5];
console.log(arrayFirst.length === arraySecond.length && arrayFirst.every((value, index) => value === arraySecond[index])); // true
如果你想比较数组而不考虑顺序，那么你应该先对它们进行排序，
const arrayFirst = [2,3,1,4,5];
const arraySecond = [1,2,3,4,5];
console.log(arrayFirst.length === arraySecond.length && arrayFirst.sort().every((value, index) => value === arraySecond[index])); //true
287.如何从获取参数中获取值？
该new URL()对象接受 url 字符串searchParams，该对象的属性可用于访问获取参数。请记住，您可能需要使用 polyfill 或window.location在旧浏览器（包括 IE）中访问 URL。
let urlString = "http://www.some-domain.com/about.html?x=1&y=2&z=3"; //window.location.href
let url = new URL(urlString);
let parameterZ = url.searchParams.get("z");
console.log(parameterZ); // 3
288.你如何用逗号作为千位分隔符打印数字？
您可以使用Number.prototype.toLocaleString()返回带有语言敏感表示的字符串的方法，例如千位分隔符、货币等。
function convertToThousandFormat(x){
return x.toLocaleString(); // 12,345.679
}
console.log(convertToThousandFormat(12345.6789));
289.java和javascript有什么区别？
两者都是完全不相关的编程语言，它们之间没有任何关系。Java 是静态类型的、编译的、在自己的 VM 上运行。而 Javascript 是在浏览器和 nodejs 环境中动态输入、解释和运行的。让我们看看表格格式的主要区别
| 特色 | java | JavaScript |
|---|---|---|
| 类型 | 它是一种强类型语言 | 它是一种动态类型语言 |
| 范式 | 面向对象编程 | 基于原型的编程 |
| 范围 | 块作用域 | 函数作用域 |
| 并发 | 基于线程 | 基于事件 |
| 内存 | 使用更多内存 | 使用更少的内存。因此它将用于网页 |
具体区别参考：haiyong.blog.csdn.net/article/det…
290.javascript是否支持命名空间？
JavaScript 默认不支持命名空间。因此，如果您创建任何元素（函数、方法、对象、变量），那么它就会变成全局并污染全局命名空间。让我们举个例子，定义两个没有任何命名空间的函数
function func1() {
console.log("这是第一个定义");
}
function func1() {
console.log("这是第二个定义");
}
func1(); // 这是第二个定义
它总是调用第二个函数定义。在这种情况下，namespace 将解决名称冲突问题。
291.你如何声明命名空间？
尽管 JavaScript 缺少命名空间，但我们可以使用 Objects 、 IIFE 来创建命名空间。
使用对象字面量表示法：让我们将变量和函数包装在充当命名空间的对象字面量中。之后，您可以使用对象表示法访问它们
var namespaceOne = {
function func1() {
console.log("This is a first definition");
}
}
var namespaceTwo = {
function func1() {
console.log("This is a second definition");
}
}
namespaceOne.func1(); // This is a first definition
namespaceTwo.func1(); // This is a second definition
使用 IIFE（立即调用函数表达式）： IIFE 的外一对括号为其内部的所有代码创建了一个局部作用域，并使匿名函数成为一个函数表达式。因此，您可以在两个不同的函数表达式中创建相同的函数来充当命名空间。
(function() {
function fun1(){
console.log("这是第一个定义");
} fun1();
}());
(function() {
function fun1(){
console.log("这是第二个定义");
} fun1();
}());
使用块和 let/const 声明：在 ECMAScript 6 中，您可以简单地使用块和 let 声明来将变量的范围限制为块。
{
let myFunction= function fun1(){
console.log("这是第一个定义");
}
myFunction();
}
//myFunction(): ReferenceError: myFunction 未定义。
{
let myFunction= function fun1(){
console.log("这是第二个定义");
}
myFunction();
}
//myFunction(): ReferenceError: myFunction 未定义。
292.如何从父页面调用 iframe 中的 javascript 代码？
最初需要使用document.getElementBy或访问 iFrame window.frames。在contentWindowiFrame 的该属性提供对 targetFunction 的访问权限之后
document.getElementById('targetFrame').contentWindow.targetFunction();
window.frames[0].frameElement.contentWindow.targetFunction(); // 以这种方式访问 iframe 可能不适用于最新版本的 chrome 和 firefox
293.如何从日期获取时区偏移量？
您可以使用getTimezoneOffset日期对象的方法。此方法返回从当前语言环境（主机系统设置）到 UTC 的时区差异（以分钟为单位）
var offset = new Date().getTimezoneOffset();
console.log(offset); // -480
294.如何动态加载 CSS 和 JS 文件？
您可以在 DOM 中创建 link 和 script 元素，并将它们作为 child 附加到 head 标记。让我们创建一个函数来添加脚本和样式资源，如下所示，
function loadAssets(filename, filetype) {
if (filetype == "css") { // External CSS file
var fileReference = document.createElement("link")
fileReference.setAttribute("rel", "stylesheet");
fileReference.setAttribute("type", "text/css");
fileReference.setAttribute("href", filename);
} else if (filetype == "js") { // External JavaScript file
var fileReference = document.createElement('script');
fileReference.setAttribute("type", "text/javascript");
fileReference.setAttribute("src", filename);
}
if (typeof fileReference != "undefined")
document.getElementsByTagName("head")[0].appendChild(fileReference)
}
295.在 DOM 中查找 HTML 元素的不同方法有哪些？
如果要访问 HTML 页面中的任何元素，则需要从访问文档对象开始。稍后您可以使用以下任何一种方法来查找 HTML 元素，
1.document.getElementById(id)：通过Id查找元素 2.document.getElementsByTagName(name)：通过标签名查找元素 3.document.getElementsByClassName(name)：通过类名查找元素
296.什么是jQuery？
jQuery 是一个流行的跨浏览器 JavaScript 库，它通过最小化浏览器之间的差异来提供文档对象模型 (DOM) 遍历、事件处理、动画和 AJAX 交互。它以其“少写，多做”的理念而广为人知。例如，您可以使用 jQuery 在页面加载时显示欢迎消息，如下所示，
$(document).ready(function(){ // 它选择文档并在页面加载时应用该功能
alert('Welcome to jQuery world');
});
==注意==：您可以从 jquery 的官方网站下载它，也可以从 CDN（如 google）安装它。
297.什么是 V8 JavaScript 引擎？
V8 是 Google Chrome 浏览器使用的开源高性能 JavaScript 引擎，用 C++ 编写。它也在 node.js 项目中使用。它实现了 ECMAScript 和 WebAssembly，并在 Windows 7 或更高版本、macOS 10.12+ 和使用 x64、IA-32、ARM 或 MIPS 处理器的 Linux 系统上运行。
==注意==：它可以独立运行，也可以嵌入到任何 C++ 应用程序中。
298.为什么我们称javascript为动态语言？
JavaScript 是一种松散类型或动态语言，因为 JavaScript 中的变量不直接与任何特定的值类型相关联，任何变量都可以分配/重新分配所有类型的值。
let age = 50; // age is a number now
age = 'old'; // age is a string now
age = true; // age is a boolean
299.什么是空运算符？
void运算符计算给定表达式，然后返回未定义的（即，不返回值）。语法如下，
void (expression)
void expression
让我们在没有任何重定向或重新加载的情况下显示一条消息
<a href="javascript:void(alert('Welcome to JS world'))">Click here to see a message</a>
==注意==：此运算符通常用于获取未定义的原始值，使用“void(0)”。
300.如何设置光标等待？
可以使用属性“cursor”将游标设置为在 JavaScript 中等待。让我们使用以下函数在页面加载时执行此行为。
function myFunction() {
window.document.body.style.cursor = "wait";
}
并且在页面加载时调用此函数
<body onload="myFunction()">
我已经写了很长一段时间的技术博客，这是我的一篇面试题文章。希望你们会喜欢！
更多相关文章及我的联系方式我放在这里：
github.com/wanghao221
gitee.com/haiyongcsdn…
如果你真的从这篇文章中学到了一些新东西，喜欢它，收藏它并与你的小伙伴分享。🤗最后，不要忘了❤或📑支持一下哦
