14万字 | 400 多道 JavaScript 面试题 🎓 有答案 🌠(第三部分 201-300题)

2,497 阅读53分钟

这是我参与更文挑战的第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题)

为了方便阅览,我在必要位置都放了回顶部或者回对应问题的链接

在这里插入图片描述

编号问题
1在 JavaScript 中创建对象的可行方法有哪些?
2什么是原型链?
3call、apply、bind有什么区别?
4 什么是 JSON 及其常见操作?
5 数组slice()方法的目的是什么?
6 数组splice()方法的目的是什么?
7 slice()和splice()有什么区别?
8 你如何比较 Object 和 Map
9== 和 === 运算符有什么区别?
10什么是 lambda 或 箭头函数?
11 什么是头等函数?
12 什么是一阶函数?
13 什么是高阶函数?
14 什么是一元函数?
15 什么是柯里化函数?
16 什么是纯函数?
17let 关键字的用途是什么?
18let 和 var 有什么区别?
19为什么选择 let 这个名字作为关键字?
20你如何在没有错误的情况下重新声明 switch 块中的变量?
21什么是暂时性死区?
22什么是IIFE(立即执行函数表达式)?
23使用模块有什么好处?
24什么是memoization(记忆)?
25什么是Hoisting(变量提升)?
26ES6 中的类是什么?
27什么是closures(闭包)?
28什么是modules(模块)?
29为什么需要模块?
30javascript中的作用域是什么?
31什么是Service Worker?
32如何使用 Service Worker 操作 DOM?
33你如何在 Service Worker 重新启动时重用信息?
34什么是 IndexedDB?
35什么是 web storage?
36什么是 post message?
37什么是 Cookie ?
38为什么需要 Cookie ?
39cookie 中有哪些选项 ?
40你如何删除cookie ?
41cookie、本地存储和会话存储有什么区别 ?
42localStorage 和 sessionStorage 的主要区别是什么?
43你如何访问web 存储?
44会话存储有哪些可用的方法?
45什么是存储事件及其事件处理程序?
46为什么需要web 存储?
47你如何检查 Web 存储浏览器支持?
48你如何检查web workers浏览器支持?
49举个 web worker 的例子
50web worker 对 DOM 的限制是什么?
51什么是promise?
52为什么需要promise?
53promise的三种状态是什么?
54 什么是回调函数?
55为什么我们需要回调?
56什么是回调地狱?
57什么是服务器发送事件?
58你如何接收服务器发送的事件通知?
59你如何检查浏览器对服务器发送事件的支持?
60服务器发送的事件有哪些可用的事件?
61promise的主要规则是什么?
62回调中的回调是什么?
63什么是promise chaining?
64什么是 promise.all?
65promise中race方法的目的是什么?
66什么是javascript中的严格模式?
67为什么需要严格模式?
68你如何声明严格模式?
69双感叹号的目的是什么?
70删除运算符的目的是什么?
71什么是typeof运算符?
72什么是未定义属性?
73什么是空值?
74null 和 undefined 有什么区别?
75什么是eval?
76Window和Document有什么区别?
77你如何在 javascript 中访问历史记录?
78你如何检测大写锁定键是否打开?
79什么是isNaN?
80未声明变量和未定义变量有什么区别?
81什么是全局变量?
82全局变量有什么问题?
83什么是 NaN 属性?
84isFinite 函数的目的是什么?
85什么是event flow(事件流)?
86什么是event bubbling(事件冒泡)?
87什么是event capturing(事件捕获)?
88你如何使用 JavaScript 提交表单?
89你如何找到操作系统详细信息?
90document load 和 DOMContentLoaded 事件有什么区别?
91Native 、Host 和User objects之间有什么区别?
92用于调试 JavaScript 代码的工具或技术有哪些?
93promises相对于回调的优缺点是什么?
94attribute 和 property有什么区别?
95什么是 same-origin policy(同源策略)?
96void 0的目的是什么?
97JavaScript 是编译型语言还是解释型语言?
98JavaScript 是区分大小写的语言吗?
99Java 和 JavaScript 之间有什么关系吗?
100什么是event?
101谁创造了 JavaScript ?
102preventDefault 方法有什么用?
103stopPropagation方法有什么用?
104return false 涉及哪些步骤?
105什么是BOM(浏览器对象模型)?
106setTimeout有什么用?
107setInterval有什么用?
108为什么 JavaScript 被视为单线程?
109什么是event delegation(事件委托)?
110什么是 ECMAScript?
111什么是 JSON?
112JSON的语法规则是什么?
113JSON 字符串化的目的是什么?
114你如何解析 JSON 字符串?
115为什么需要 JSON?
116什么是 PWA?
117clearTimeout 方法的目的是什么?
118clearInterval 方法的目的是什么?
119你如何在javascript中重定向新页面?
120你如何检查一个字符串是否包含一个子字符串?
121你如何在 javascript 中验证电子邮件?
122你如何使用 javascript 获取当前 url?
123location对象的各种url属性是什么?
124如何在javascript中获取查询字符串值?
125如何检查对象中是否存在键?
126你如何循环或枚举 javascript 对象?
127你如何测试一个空对象?
128什么是参数对象?
129你如何使字符串的第一个字母大写?
130for循环的优缺点是什么?
131你如何在javascript中显示当前日期?
132你如何比较两个日期对象?
133你如何检查一个字符串是否以另一个字符串开头?
134你如何在javascript中修剪字符串?
135你如何在javascript中添加一个键值对?
136‘!–’ 符号是否表示一个特殊运算符?
137 你如何为变量分配默认值?
138你如何定义多行字符串?
139什么是app shell model?
140我们可以为函数定义属性吗?
141找到函数期望的参数数量的方法是什么?
142什么是 polyfill?
143什么是 break 和 continue 语句?
144什么是js标签?
145将声明放在首位有什么好处?
146 初始化变量有什么好处?
147创建新对象的建议是什么?
148你如何定义 JSON 数组?
149你如何生成随机整数?
150你能写一个随机整数函数来打印范围内的整数吗?
151什么是tree shaking(摇树)?
152tree shaking(摇树)需要什么?
153是否推荐使用 eval?
154什么是正则表达式?
155正则表达式中可用的字符串方法有哪些?
156正则表达式中的修饰符是什么?
157什么是正则表达式模式?
158什么是 RegExp 对象?
159如何在字符串中搜索模式?
160exec方法的目的是什么?
161如何更改 HTML 元素的样式?
1621+2+'3' 的结果是什么?
163什么是调试器语句?
164 调试中断点的目的是什么?
165我可以使用保留字作为标识符吗?
166你如何检测移动浏览器?
167如何在没有正则表达式的情况下检测移动浏览器?
168你如何使用JS获取图像的宽度和高度?
169如何进行同步 HTTP 请求?
170 如何进行异步 HTTP 请求?
171你如何在javascript中将日期转换为另一个时区?
172用于获取窗口大小的属性是什么?
173什么是javascript中的条件运算符?
174你能在条件运算符上应用chaining吗?
175页面加载后执行javascript的方式有哪些?
176proto 和 prototype有什么区别?
177举个例子你真的需要分号
178什么是freeze 方法?
179freeze 方法的目的是什么?
180为什么我需要使用freeze 方法?
181你如何检测浏览器语言首选项?
182如何使用javascript将字符串转换为标题大小写?
183你如何检测页面中禁用的javascript?
184javascript支持的各种运算符有哪些?
185 什么是rest 参数?
186如果不使用 rest 参数作为最后一个参数会发生什么?
187什么是 JavaScript 中可用的按位运算符?
188什么是spread operator(展开运算符)?
189你如何确定对象是否被冻结?
190你如何确定两个值相同或不使用对象?
191使用Object 的 is方法的目的是什么?
192如何将属性从一个对象复制到另一个对象?
193赋值方法有哪些应用?
194什么是Proxy(代理)对象?
195seal 方法的目的是什么?
196seal 方法的应用有哪些?
197freeze 和 seal 方法有什么区别?
198如何判断物体是否 seal?
199如何获得可枚举的键值对?
200Object.values 和 Object.entries 方法的主要区别是什么?
201如何获取任何对象的键列表?
202你如何用 prototype 创建一个对象?
203什么是WeakSet?
204WeakSet 和 Set 有什么区别?
205列出 WeakSet 上可用的方法集合?
206什么是 WeakMap?
207WeakMap 和 Map 有什么区别?
208列出 WeakMap 上可用的方法集合?
209uneval 的目的是什么?
210你如何 encode (编码)一个 URL?
211你如何 decode (解码)一个 URL?
212你如何打印网页的内容?
213uneval 和 eval 有什么区别?
214什么是 anonymous (匿名)函数?
215局部变量和全局变量的优先顺序是什么?
216什么是 javascript 访问器?
217你如何在对象构造函数上定义属性?
218 get 和defineProperty 有什么区别?
219Getter 和 Setter 的优点是什么?
220我可以使用defineProperty方法添加 getter 和 setter 吗?
221switch-case 的目的是什么?
222使用 swtich case 需要遵循什么约定?
223什么是原始数据类型?
224访问对象属性的不同方式有哪些?
225什么是函数参数规则?
226什么是错误对象?
227当你收到语法错误时
228错误对象有哪些不同的错误名称?
229错误处理中的各种语句是什么?
230javascript中的两种类型的循环是什么?
231什么是 nodejs?
232什么是 Intl 对象?
233你如何执行特定于语言的日期和时间格式化?
234什么是迭代器?
235同步迭代是如何工作的?
236什么是事件循环?
237什么是调用栈?
238什么是事件队列?
239什么是装饰器?
240Intl 对象的属性是什么?
241什么是一元运算符?
242如何对数组中的元素进行排序?
243排序数组时 compareFunction 的目的是什么?
244你如何反转数组?
245你如何在数组中找到最小值和最大值?
246如何在没有math函数的情况下找到最小值和最大值?
247什么是空语句及其目的?
248如何获取模块的元数据?
249什么是逗号运算符?
250逗号运算符的优点是什么?
251什么是 typescript ?
252javascript 和 typescript 有什么区别?
253typescript 相对于 javascript 的优势是什么?
254什么是对象初始值设定项?
255什么是构造方法?
256如果在一个类中多次编写构造函数会发生什么?
257如何调用父类的构造函数?
258你如何获得一个对象的原型?
259如果我为 getPrototype 方法传递字符串类型会发生什么?
260如何将一个对象的原型设置为另一个对象?
261你如何检查一个对象是否可以扩展?
262如何防止对象扩展?
263使对象不可扩展的不同方法有哪些?
264如何在一个对象上定义多个属性?
265JavaScript 中的 MEAN 是什么?
266什么是 javascript 中的混淆?
267为什么需要混淆?
268什么是Minification(缩小)?
269缩小有什么好处?
270混淆和加密有什么区别?
271常用的缩小工具有哪些?
272你如何使用 javascript 执行表单验证?
273如何在没有 javascript 的情况下执行表单验证?
274可用于约束验证的 DOM 方法有哪些?
275什么是可用的约束验证 DOM 属性?
276什么是有效性属性列表?
277举例使用 rangeOverflow 属性?
278javascript 中是否提供枚举功能?
279什么是枚举?
280你如何列出一个对象的所有属性?
281如何获取对象的属性描述符?
282属性描述符提供的属性是什么?
283你如何扩展类?
284如何在不重新加载页面的情况下修改 url?
285如何检查数组是否包含特定值?
286你如何比较标量数组?
287 如何从获取参数中获取值?
288你如何用逗号作为千位分隔符打印数字?
289java和javascript有什么区别?
290javascript是否支持命名空间?
291你如何声明命名空间?
292如何从父页面调用 iframe 中的 javascript 代码?
293如何从日期获取时区偏移量?
294如何动态加载 CSS 和 JS 文件?
295在 DOM 中查找 HTML 元素的不同方法有哪些?
296什么是jQuery?
297什么是 V8 JavaScript 引擎?
298为什么我们称javascript为动态语言?
299什么是空运算符?
300如何设置光标等待?
301你如何创建一个无限循环?
302为什么需要避免 with 语句?
303以下 for 循环的输出是什么?
304列出 ES6 的一些特性?
305什么是 ES6?
306我可以重新声明 let 和 const 变量吗?
307是 const 变量使值不可变吗?
308什么是默认参数?
309什么是模板字面量?
310如何在模板文字中编写多行字符串?
311什么是嵌套模板?
312什么是标记模板?
313 什么是原始字符串?
314什么是解构赋值?
315解构赋值中的默认值是什么?
316你如何在解构赋值中交换变量?
317什么是增强的对象字面量?
318什么是动态导入?
319动态导入的用例是什么?
320什么是typed arrays (类型数组)?
321模块加载器的优点是什么?
322什么是 collation?
323什么是...of 语句?
324下面展开运算符数组的输出是什么?
325PostMessage 安全吗?
326postmessage目标源作为通配符有什么问题?
327你如何避免收到来自攻击者的 postMessages?
328我可以完全避免使用 postMessages 吗?
329postMessages 是否同步?
330Javascript 是什么范式?
331内部和外部 javascript有什么区别?
332JavaScript 是否比服务器端脚本更快?
333你如何获得复选框的状态?
334双波浪号运算符的目的是什么?
335你如何将字符转换为 ASCII 码?
336什么是数组缓冲区?
337下面的字符串表达式的输出是什么?
338Error对象的目的是什么?
339EvalError 对象的目的是什么?
340从非严格模式到严格模式抛出的案例错误列表是什么?
341是否所有对象都有prototypes(原型)?
342参数和实参有什么区别?
343数组中 some 方法的目的是什么?
344你如何组合两个或多个数组?
345浅拷贝和深拷贝有什么区别?
346你如何创建一个字符串的特定数量的副本?
347你如何根据正则表达式返回所有匹配的字符串?
348你如何在开头或结尾修剪字符串?
349下面带有一元运算符的控制台语句的输出是什么?
350javascript 是否使用 mixins?
351什么是 thunk 函数?
352什么是异步 thunk?
353以下函数调用的输出是什么?
354如何从字符串中删除所有换行符?
355回流和重绘有什么区别?
356否定数组会发生什么?
357如果我们添加两个数组会发生什么?
358在假值上添加加法运算符的输出是什么?
359如何使用特殊字符创建自字符串?
360如何从数组中删除虚假值?
361你如何获得数组的唯一值?
362什么是解构别名?
363如何在不使用 map 方法的情况下映射数组值?
364你如何清空一个数组?
365你如何将数字四舍五入到某些小数?
366将数组转换为对象的最简单方法是什么?
367你如何用一些数据创建一个数组?
368控制台对象的占位符是什么?
369是否可以将 CSS 添加到控制台消息?
370控制台对象的dir方法的目的是什么?
371是否可以在控制台中调试 HTML 元素?
372如何使用控制台对象以表格格式显示数据?
373你如何验证参数是否为数字?
374你如何创建复制到剪贴板按钮?
375获取时间戳的快捷方式是什么?
376你如何展平多维数组?
377什么是最简单的多条件检查?
378你如何捕获浏览器后退按钮?
379如何禁用网页中的右键单击?
380什么是包装对象?
381什么是 AJAX?
382处理异步代码的不同方式有哪些?
383如何取消提取请求?
384什么是网络语音API?
385什么是最小超时限制?
386你如何在现代浏览器中实现零超时?
387事件循环中的任务是什么?
388什么是微任务?
389什么是不同的事件循环?
390queueMicrotask 的目的是什么?
391你如何在 typescript 文件中使用 javascript 库?
392promises 和 observables 有什么区别?
393什么是堆?
394什么是事件表?
395什么是微任务队列?
396shim 和 polyfill 有什么区别?
397你如何检测原始或非原始值类型?
398什么是Babel ?
399Node.js 是完全单线程的吗?
400可观察对象的常见用例是什么?
401什么是 RxJS?
402函数构造函数和函数声明有什么区别?
403什么是短路状态?
404调整数组大小的最简单方法是什么?
405什么是可观察的?
406函数声明和类声明有什么区别?
407什么是异步函数?
408你如何防止 promises swallowing errors?
409什么是 deno ?
410你如何在javascript中使对象可迭代?
411什么是正确的尾调用?
412你如何检查一个对象是否是一个承诺?
413如何检测函数是否被调用为构造函数?
414arguments 对象和rest 参数之间有什么区别?
415扩展运算符和rest 参数之间有什么区别?
416有哪些不同种类的 generators(生成器)?
417什么是内置可迭代对象?
418for...of 和 for...in 语句之间有什么区别?
419如何定义实例和非实例属性?
420isNaN 和 Number.isNaN 有什么区别?
421如何在没有任何额外括号的情况下调用 IIFE?
422可以在 switch case 中使用表达式吗?
423忽略承诺错误的最简单方法是什么?
424如何使用 CSS 设置控制台输出的样式?

201.如何获取任何对象的键列表?

您可以使用Object.keys()用于返回给定对象自己的属性名称的数组的方法,其顺序与我们使用普通循环获得的顺序相同。例如,您可以获取用户对象的键,

 const user = {
   name: 'Haiyong',
   gender: 'male',
   age: 40
 };

 console.log(Object.keys(user)); //['name', 'gender', 'age']

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


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 已被删除

返回顶部 回到第100题 回到第200题


204.WeakSet 和 Set 有什么区别?

主要区别在于 Set 中对象的引用是强引用,而 WeakSet 中对象的引用是弱引用。即,如果没有其他引用 Wea​​kSet 中的对象可以被垃圾回收。

其他区别是,

1.Sets 可以存储任何值而 WeakSets 只能存储对象的集合 2.WeakSet 没有与 Set 不同的 size 属性 3.WeakSet 没有 clear、keys、values、entries、forEach 等方法。 4.WeakSet 不可迭代。

返回顶部 回到第100题 回到第200题


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);

返回顶部 回到第100题 回到第200题


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 已被删除

返回顶部 回到第100题 回到第200题


207.WeakMap 和 Map 有什么区别?

主要区别在于 Map 中关键对象的引用是强引用,而 WeakMap 中关键对象的引用是弱引用。即,如果没有其他引用 Wea​​kMap 中的键对象可以被垃圾收集。

其他区别是,

1.Maps 可以存储任何类型的键,而 WeakMaps 只能存储键对象的集合 2.与 Map 不同,WeakMap 没有 size 属性 3.WeakMap 没有 clear、keys、values、entries、forEach 等方法。 4.WeakMap 不可迭代。

返回顶部 回到第100题 回到第200题


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);

返回顶部 回到第100题 回到第200题


209.uneval 的目的是什么?

uneval() 是一个内置函数,用于创建对象源代码的字符串表示。它是一个顶级函数,不与任何对象相关联。让我们看下面的例子来了解更多关于它的功能,

 var a = 1;
 uneval(a); // 返回一个包含 1 的字符串
 uneval(function user() {}); // returns "(function user(){})"

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


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);
 }

返回顶部 回到第100题 回到第200题


212.你如何打印网页的内容?

window 对象提供了一个 print() 方法,用于打印当前窗口的内容。它会打开一个打印对话框,让您在各种打印选项之间进行选择。让我们在一个例子中看看print方法的用法,

<input type="button" value="Print" onclick="window.print()" />

注意:在大多数浏览器中,它会在打印对话框打开时被阻止。

返回顶部 回到第100题 回到第200题


213.uneval 和 eval 有什么区别?

该uneval函数返回给定对象的来源;而该eval函数则相反,通过评估不同内存区域中的源代码。让我们看一个例子来澄清差异,

 var msg = uneval(function greeting() { return 'Hello, Good morning'; });
 var greeting = eval(msg);
 greeting(); // returns "Hello, Good morning"

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


215.局部变量和全局变量的优先顺序是什么?

局部变量优先于同名的全局变量。让我们在一个例子中看看这种行为。

 var msg = "Good morning";
 function greeting() {
    msg = "Good Evening";
    console.log(msg);
 }
 greeting();

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


217.你如何在对象构造函数上定义属性?

Object.defineProperty() 静态方法用于直接在对象上定义新属性,或修改对象上现有的属性,并返回该对象。让我们看一个例子来了解如何定义属性,

 const newObject = {};

 Object.defineProperty(newObject, 'newProperty', {
   value: 100,
   writable: false
 });

 console.log(newObject.newProperty); // 100

 newObject.newProperty = 200; // 由于可写设置,它在严格模式下抛出错误

返回顶部 回到第100题 回到第200题


218.get 和defineProperty 有什么区别?

除非您使用类,否则两者都有相似的结果。如果您使用get该属性将在对象的原型上定义,而使用Object.defineProperty()该属性将在它应用到的实例上定义。

返回顶部 回到第100题 回到第200题


219.Getter 和 Setter 的优点是什么?

以下是 Getter 和 Setter 的好处列表,

1.它们提供更简单的语法 2.它们用于定义计算属性或 JS 中的访问器。 3.用于提供属性和方法之间的等价关系 4.他们可以提供更好的数据质量 5.对于使用封装的逻辑在幕后做事很有用。

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


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;
 }

上面的多路分支语句提供了一种简单的方法,可以根据表达式的值将执行分派到代码的不同部分。

返回顶部 回到第100题 回到第200题


222.使用 swtich case 需要遵循什么规定?

以下是应注意的规定列表,

1.表达式可以是数字或字符串类型。 2.表达式不允许重复值。 3.默认语句是可选的。如果传递给 switch 的表达式与任何 case 值都不匹配,则将执行 default case 中的语句。 4.break 语句在 switch 中用于终止语句序列。 5.break 语句是可选的。但如果省略,执行将继续到下一个案例。

返回顶部 回到第100题 回到第200题


223.什么是原始数据类型?

原始数据类型是具有原始值(没有属性或方法)的数据。有 7 种原始数据类型。

1.string 2.number 3.boolean 4.null 5.undefined 6.bigint 7.symbol

返回顶部 回到第100题 回到第200题


224.访问对象属性的不同方式有哪些?

有 3 种可能的方法来访问对象的属性。

点符号:它使用点来访问属性

 objectName.property

方括号表示法:它使用方括号进行属性访问

 objectName["property"]

表达式符号:它使用方括号中的表达式

 objectName[expression]

返回顶部 回到第100题 回到第200题


225.什么是函数参数规则?

JavaScript 函数遵循以下参数规则,

1.函数定义不指定参数的数据类型。 2.不要对传递的参数执行类型检查。 3.不要检查收到的参数数量。即,以下函数遵循上述规则,

 function functionName(parameter1, parameter2, parameter3) {
   console.log(parameter1); // 1
 }
 functionName(1);

返回顶部 回到第100题 回到第200题


226.什么是错误对象?

错误对象是一个内置的错误对象,它在发生错误时提供错误信息。它有两个属性:名称和消息。例如,以下函数记录错误详细信息,

 try {
   greeting("Welcome");
 }
 catch(err) {
   console.log(err.name + "<br>" + err.message);
 }

返回顶部 回到第100题 回到第200题


227.当你收到语法错误时

如果您尝试评估具有语法错误的代码,则会引发 SyntaxError。例如,下面缺少的函数参数引用会引发语法错误

 try {
   eval("greeting('welcome)");   // Missing ' will produce an error
 }
 catch(err) {
   console.log(err.name);
 }

返回顶部 回到第100题 回到第200题


228.错误对象有哪些不同的错误名称?

错误对象返回了 6 种不同类型的错误名称,

错误名称说明
EvalErroreval() 函数发生错误
RangeError数字“超出范围”发生错误
ReferenceError由于非法引用而导致的错误
SyntaxError语法错误导致的错误
TypeError类型错误导致的错误
URIError由于 encodeURI() 导致的错误

229.错误处理中的各种语句是什么?

以下是错误处理中使用的语句列表,

1.try:该语句用于测试代码块是否有错误 2.catch:该语句用于处理错误 3.throw:此语句用于创建自定义错误。 4.finally:该语句用于在 try 和 catch 之后执行代码,而不管结果如何。

返回顶部 回到第100题 回到第200题


230.javascript中的两种类型的循环是什么?

1.进入Controlled Loops受控循环:在这种循环类型中,在进入循环体之前测试测试条件。例如,For 循环和 While 循环就属于这一类。

2.退出 Controlled Loops:在这种循环类型中,测试条件在循环体的末尾进行测试或评估。即,无论测试条件为真还是假,循环体都将至少执行一次。例如,do-while 循环就属于这一类。

返回顶部 回到第100题 回到第200题


231.什么是 nodejs?

Node.js 是一个基于 Chrome 的 JavaScript 运行时构建的服务器端平台,用于轻松构建快速且可扩展的网络应用程序。它是一个基于事件的、非阻塞的、异步的 I/O 运行时,使用谷歌的 V8 JavaScript 引擎和 libuv 库。

返回顶部 回到第100题 回到第200题


232.什么是 Intl 对象?

Intl 对象是 ECMAScript 国际化 API 的命名空间,它提供语言敏感的字符串比较、数字格式以及日期和时间格式。它提供对几个构造函数和语言敏感函数的访问。

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


234.什么是迭代器?

迭代器是一个对象,它在终止时定义一个序列和一个返回值。它使用一个next()方法实现迭代器协议,该方法返回一个具有两个属性的对象:(value序列中的下一个值)和done(如果序列中的最后一个值已被消耗,则为真)。

返回顶部 回到第100题 回到第200题


235.同步迭代是如何工作的?

ES6 中引入了同步迭代,它适用于以下组件集,

Iterable:它是一个可以通过其键为 Symbol.iterator 的方法迭代的对象。 迭代器:它是通过调用[Symbol.iterator]()可迭代对象返回的对象。这个迭代器对象将每个迭代的元素包装在一个对象中,并通过next()方法一一返回。 IteratorResultnext()方法返回的对象。该对象包含两个属性;该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 }

返回顶部 回到第100题 回到第200题


236.什么是事件循环?

事件循环是一个回调函数队列。当异步函数执行时,回调函数被推入队列。JavaScript 引擎在异步函数执行完代码之前不会开始处理事件循环。

==注意==:即使 JavaScript 是单线程的,它也允许 Node.js 执行非阻塞 I/O 操作。

返回顶部 回到第100题 回到第200题


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()从调用堆栈列表中删除该函数,因为不再有项目。

返回顶部 回到第100题 回到第200题


238.什么是事件队列?

对消息或事件的发送与处理进行时间上的解耦。通俗地讲就是在队列中按先入先出的顺序存储一系列通知或请求。 发送通知时,将请求放入队列并返回。 处理请求的系统之后稍晚从队列中获取请求并处理。

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


240.Intl 对象的属性是什么?

以下是 Intl 对象上可用的属性列表,

1.Collat​​or:这些是启用对语言敏感的字符串比较的对象。 2.DateTimeFormat:这些是启用对语言敏感的日期和时间格式的对象。 3.ListFormat:这些是启用语言敏感列表格式的对象。 4.NumberFormat:启用对语言敏感的数字格式的对象。 5.PluralRules:启用复数敏感格式和复数语言特定规则的对象。 6.RelativeTimeFormat:启用对语言敏感的相对时间格式的对象。

返回顶部 回到第100题 回到第200题


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

返回顶部 回到第100题 回到第200题


242.如何对数组中的元素进行排序?

sort() 方法用于对数组元素进行原地排序并返回排序后的数组。示例用法如下,

 var months = ["Aug", "Sep", "Jan", "June"];
 months.sort();
 console.log(months); //  ["Aug", "Jan", "June", "Sep"]
 

返回顶部 回到第100题 回到第200题


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]

返回顶部 回到第100题 回到第200题


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]

返回顶部 回到第100题 回到第200题


245.你如何在数组中找到最小值和最大值?

您可以对数组变量使用Math.minMath.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));

返回顶部 回到第100题 回到第200题


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));

返回顶部 回到第100题 回到第200题


247.什么是空语句及其目的?

空语句是一个分号 (;),表示不会执行任何语句,即使 JavaScript 语法需要一个。由于空语句没有动作,您可能认为它的用法很少,但是当您想创建具有空主体的循环时,空语句有时很有用。例如,您可以使用零值初始化一个数组,如下所示,

 // Initialize an array a
 for(int i=0; i < a.length; a[i++] = 0) ;

返回顶部 回到第100题 回到第200题


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"

返回顶部 回到第100题 回到第200题


249.什么是逗号运算符?

逗号运算符用于从左到右评估其每个操作数并返回最后一个操作数的值。这与数组、对象和函数参数和参数中的逗号用法完全不同。例如,数字表达式的用法如下,

 var x = 1;
 x = (x++, x);

 console.log(x); // 2

返回顶部 回到第100题 回到第200题


250.逗号运算符的优点是什么?

它通常用于在需要单个表达式的位置包含多个表达式。此逗号运算符的常见用法之一是在for循环中提供多个参数。例如,下面的 for 循环使用逗号运算符在单个位置使用多个表达式,

 for (var a = 0, b =10; a <= 10; a++, b--)

您还可以在 return 语句中使用逗号运算符,它在返回之前处理。

 function myFunction() {
    var a = 1;
    return (a += 10, a); // 11
 }

返回顶部 回到第250题


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));

问候方法只允许字符串类型作为参数。

返回顶部 回到第250题


252.javascript 和 typescript 有什么区别?

以下是 javascript 和 typescript 之间的差异列表

功能typescriptjavascript
语言范式面向对象的编程语言脚本语言
打字支持支持静态类型它具有动态类型
模块支持不支持
界面它有接口概念不支持接口
可选参数函数支持可选参数不支持函数的可选参数

返回顶部 回到第250题


253.typescript 相对于 javascript 的优势是什么?

以下是打字稿相对于 javascript 的一些优势,

1.TypeScript 只能在开发时发现编译时错误,并确保减少运行时错误。而 javascript 是一种解释性语言。 2.TypeScript 是强类型或支持静态类型,允许在编译时检查类型正确性。这在 javascript 中不可用。 3.TypeScript 编译器可以将 .ts 文件编译成 ES3、ES4 和 ES5,这与某些浏览器可能不支持的 JavaScript 的 ES6 特性不同。

返回顶部 回到第250题


254.什么是对象初始值设定项?

对象初始值设定项是描述对象初始化的表达式。此表达式的语法表示为以逗号分隔的零或多对属性名称和对象关联值的列表,用花括号 ({}) 括起来。这也称为字面表示法。它是创建对象的方法之一。

 var initObject = {a: 'Haiyong', b: 50, c: {}};

 console.log(initObject.a); // Haiyong

返回顶部 回到第250题


255.什么是构造方法?

构造函数方法是用于创建和初始化在类中创建的对象的特殊方法。如果未指定构造函数方法,则使用默认构造函数。构造函数的示例用法如下,

 class Employee {
   constructor() {
     this.name = "Haiyong";
   }
 }

 var employeeObject = new Employee();

 console.log(employeeObject.name); // Haiyong

返回顶部 回到第250题


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);

返回顶部 回到第250题


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;
   }
 }

返回顶部 回到第250题


258.你如何获得一个对象的 prototype?

您可以使用该Object.getPrototypeOf(obj)方法返回指定对象的原型。即内部prototype属性的值。如果没有继承的属性,则null返回值。

 const newPrototype = {};
 const newObject = Object.create(newPrototype);

 console.log(Object.getPrototypeOf(newObject) === newPrototype); // true

返回顶部 回到第250题


259.如果我为 getPrototype 方法传递字符串类型会发生什么?

在 ES5 中,如果 obj 参数不是对象,它将抛出 TypeError 异常。而在 ES2015 中,该参数将被强制转换为Object.

 // ES5
 Object.getPrototypeOf('CSDN'); // TypeError: "CSDN" is not an object
 // ES2015
 Object.getPrototypeOf('CSDN'); // String.prototype

返回顶部 回到第250题


260.如何将一个对象的 prototype 设置为另一个对象?

您可以使用将指定对象Object.setPrototypeOf()的原型(即内部Prototype属性)设置为另一个对象或null 的方法。例如,如果要将方形对象的原型设置为矩形对象,则如下所示,

 Object.setPrototypeOf(Square.prototype, Rectangle.prototype);
 Object.setPrototypeOf({}, null);

返回顶部 回到第250题


261.你如何检查一个对象是否可以扩展?

该Object.isExtensible()方法用于确定对象是否可扩展。即,它是否可以添加新属性。

 const newObject = {};
 console.log(Object.isExtensible(newObject)); //true

==注意==:默认情况下,所有对象都是可扩展的。即,可以添加或修改新属性。

返回顶部 回到第250题


262.如何防止对象扩展?

该Object.preventExtensions()方法用于防止向对象添加新属性。换句话说,它可以防止将来对对象进行扩展。让我们看看这个属性的用法,

 const newObject = {};
 Object.preventExtensions(newObject); // 不可扩展

 try {
   Object.defineProperty(newObject, 'newProperty', { // 添加新属性
     value: 100
   });
 } catch (e) {
   console.log(e); // 类型错误:无法定义属性 newProperty,对象不可扩展
 }

返回顶部 回到第250题


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

返回顶部 回到第250题


264.如何在一个对象上定义多个属性?

该Object.defineProperties()方法用于直接在对象上定义新属性或修改现有属性并返回该对象。让我们在一个空对象上定义多个属性,

 const newObject = {};

 Object.defineProperties(newObject, {
   newProperty1: {
     value: 'Haiyong',
     writable: true
   },
   newProperty2: {}
 });

返回顶部 回到第250题


265.JavaScript 中的 MEAN 是什么?

MEAN(MongoDB、Express、AngularJS 和 Node.js)堆栈是最流行的开源 JavaScript 软件技术堆栈,可用于构建动态 Web 应用程序,您可以在其中编写 Web 项目的服务器端和客户端两部分完全在 JavaScript 中。

返回顶部 回到第250题


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)

返回顶部 回到第250题


267.为什么需要混淆?

以下是混淆的几个原因,

1.代码大小将减少。所以服务器和客户端之间的数据传输会很快。 2.它对外界隐藏业务逻辑并保护代码不受他人影响 3.逆向工程难度很大 4.下载时间将减少

返回顶部 回到第250题


268.什么是Minification(缩小)?

缩小是删除所有不必要的字符(删除空格)的过程,变量将被重命名而不改变其功能。这也是一种混淆。

返回顶部 回到第250题


269.缩小有什么好处?

通常情况下,建议在流量大和资源密集需求的情况下使用最小化。它减少了文件大小,具有以下好处,

1.减少网页的加载时间 2.节省带宽使用量

返回顶部 回到第250题


270.混淆和加密有什么区别?

以下是混淆和加密之间的主要区别,

特色混淆加密
定义以任何其他形式更改任何数据的形式使用密钥将信息的形式更改为不可读的格式
解码的钥匙无需任何密钥即可解码它是必需的
目标数据格式它将被转换为复杂的形式转换成不可读的格式

返回顶部 回到第250题


271.常用的缩小工具有哪些?

有许多在线/离线工具可以缩小 javascript 文件,

  • 谷歌的 Closure 编译器
  • jsmin
  • javascript-minifier.com
  • Prettydiff.com

返回顶部 回到第250题


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;
   }
 }

返回顶部 回到第250题


273.如何在没有 javascript 的情况下执行表单验证?

您可以在不使用 javascript 的情况下自动执行 HTML 表单验证。通过应用required属性启用验证以防止在输入为空时提交表单。

 <form method="post">
   <input type="text" name="uname" required>
   <input type="submit" value="Submit">
 </form>

==注意==:自动表单验证在 Internet Explorer 9 或更早版本中不起作用。

返回顶部 回到第250题


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";
   }
 }

返回顶部 回到第250题


275.什么是可用的约束验证 DOM 属性?

下面是一些可用的约束验证 DOM 属性的列表,

1.validity:它提供与输入元素有效性相关的布尔属性列表。 2.validationMessage:当有效性为假时显示消息。 3.willValidate:指示输入元素是否将被验证。

返回顶部 回到第250题


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。

返回顶部 回到第250题


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");
   }
 }

返回顶部 回到第250题


278.javascript 中是否提供枚举功能?

不,javascript 本身不支持枚举。但是有不同种类的解决方案可以模拟它们,即使它们可能无法提供精确的等效项。例如,您可以在对象上使用冻结或密封,

 var DaysEnum = Object.freeze({"monday":1, "tuesday":2, "wednesday":3, ...})

返回顶部 回到第250题


279.什么是枚举?

枚举是一种将变量限制为一组预定义常量中的一个值的类型。JavaScript 没有枚举,但 typescript 提供了内置的枚举支持。

 enum Color {
  RED, GREEN, BLUE
 }

返回顶部 回到第250题


280.你如何列出一个对象的所有属性?

您可以使用该Object.getOwnPropertyNames()方法返回直接在给定对象中找到的所有属性的数组。让我们在一个例子中使用它,

 const newObject = {
   a: 1,
   b: 2,
   c: 3
 };

 console.log(Object.getOwnPropertyNames(newObject));  ["a", "b", "c"]

返回顶部 回到第250题


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

返回顶部 回到第250题


282.属性描述符提供的属性是什么?

属性描述符是具有以下属性的记录

1.value:与属性关联的值 2.writable:确定与属性关联的值是否可以更改 3.configurable:如果可以更改此属性描述符的类型并且可以从相应的对象中删除该属性,则返回 true。 4.enumerable:确定在枚举对应对象上的属性时是否出现该属性。 5.set: 一个作为属性设置器的函数 6.get:作为属性的 getter 的函数

返回顶部 回到第250题


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;
    }
  }

返回顶部 回到第250题


284.如何在不重新加载页面的情况下修改 url?

window.location.url属性将有助于修改 url,但它会重新加载页面。HTML5 引入了 history.pushState()history.replaceState() 方法,分别允许您添加和修改历史条目。例如,您可以使用 pushState 如下,

 window.history.pushState('page2', 'Title', '/page2.html');

返回顶部 回到第250题


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

返回顶部 回到第250题


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

返回顶部 回到第250题


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

返回顶部 回到第250题


288.你如何用逗号作为千位分隔符打印数字?

您可以使用Number.prototype.toLocaleString()返回带有语言敏感表示的字符串的方法,例如千位分隔符、货币等。

function convertToThousandFormat(x){
return x.toLocaleString(); // 12,345.679
}

console.log(convertToThousandFormat(12345.6789));

返回顶部 回到第250题


289.java和javascript有什么区别?

两者都是完全不相关的编程语言,它们之间没有任何关系。Java 是静态类型的、编译的、在自己的 VM 上运行。而 Javascript 是在浏览器和 nodejs 环境中动态输入、解释和运行的。让我们看看表格格式的主要区别

特色javaJavaScript
类型它是一种强类型语言它是一种动态类型语言
范式面向对象编程基于原型的编程
范围块作用域函数作用域
并发基于线程基于事件
内存使用更多内存使用更少的内存。因此它将用于网页

具体区别参考:haiyong.blog.csdn.net/article/det…

返回顶部 回到第250题


290.javascript是否支持命名空间?

JavaScript 默认不支持命名空间。因此,如果您创建任何元素(函数、方法、对象、变量),那么它就会变成全局并污染全局命名空间。让我们举个例子,定义两个没有任何命名空间的函数

function func1() {
console.log("这是第一个定义");

}
function func1() {
console.log("这是第二个定义");
}
func1(); // 这是第二个定义

它总是调用第二个函数定义。在这种情况下,namespace 将解决名称冲突问题。

返回顶部 回到第250题


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 未定义。

返回顶部 回到第250题


292.如何从父页面调用 iframe 中的 javascript 代码?

最初需要使用document.getElementBy或访问 iFrame window.frames。在contentWindowiFrame 的该属性提供对 targetFunction 的访问权限之后

document.getElementById('targetFrame').contentWindow.targetFunction();
window.frames[0].frameElement.contentWindow.targetFunction(); // 以这种方式访问​​ iframe 可能不适用于最新版本的 chrome 和 firefox

返回顶部 回到第250题


293.如何从日期获取时区偏移量?

您可以使用getTimezoneOffset日期对象的方法。此方法返回从当前语言环境(主机系统设置)到 UTC 的时区差异(以分钟为单位)

var offset = new Date().getTimezoneOffset();
console.log(offset); // -480

返回顶部 回到第250题


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)
}

返回顶部 回到第250题


295.在 DOM 中查找 HTML 元素的不同方法有哪些?

如果要访问 HTML 页面中的任何元素,则需要从访问文档对象开始。稍后您可以使用以下任何一种方法来查找 HTML 元素,

1.document.getElementById(id):通过Id查找元素 2.document.getElementsByTagName(name):通过标签名查找元素 3.document.getElementsByClassName(name):通过类名查找元素

返回顶部 回到第250题


296.什么是jQuery?

jQuery 是一个流行的跨浏览器 JavaScript 库,它通过最小化浏览器之间的差异来提供文档对象模型 (DOM) 遍历、事件处理、动画和 AJAX 交互。它以其“少写,多做”的理念而广为人知。例如,您可以使用 jQuery 在页面加载时显示欢迎消息,如下所示,

$(document).ready(function(){ // 它选择文档并在页面加载时应用该功能
alert('Welcome to jQuery world');
});

==注意==:您可以从 jquery 的官方网站下载它,也可以从 CDN(如 google)安装它。

⬆ 返回顶部 回到第250题


297.什么是 V8 JavaScript 引擎?

V8 是 Google Chrome 浏览器使用的开源高性能 JavaScript 引擎,用 C++ 编写。它也在 node.js 项目中使用。它实现了 ECMAScript 和 WebAssembly,并在 Windows 7 或更高版本、macOS 10.12+ 和使用 x64、IA-32、ARM 或 MIPS 处理器的 Linux 系统上运行。

==注意==:它可以独立运行,也可以嵌入到任何 C++ 应用程序中。

⬆ 返回顶部 回到第250题


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

⬆ 返回顶部 回到第250题


299.什么是空运算符?

void运算符计算给定表达式,然后返回未定义的(即,不返回值)。语法如下,

void (expression)
void expression

让我们在没有任何重定向或重新加载的情况下显示一条消息

<a href="javascript:void(alert('Welcome to JS world'))">Click here to see a message</a>

==注意==:此运算符通常用于获取未定义的原始值,使用“void(0)”。

返回顶部 回到第250题


300.如何设置光标等待?

可以使用属性“cursor”将游标设置为在 JavaScript 中等待。让我们使用以下函数在页面加载时执行此行为。

function myFunction() {
window.document.body.style.cursor = "wait";
}

并且在页面加载时调用此函数

<body onload="myFunction()">

⬆ 返回顶部 回到第300题


我已经写了很长一段时间的技术博客,这是我的一篇面试题文章。希望你们会喜欢!

更多相关文章及我的联系方式我放在这里:

github.com/wanghao221
gitee.com/haiyongcsdn…

如果你真的从这篇文章中学到了一些新东西,喜欢它,收藏它并与你的小伙伴分享。🤗最后,不要忘了❤或📑支持一下哦