JavaScript面试官常问基础题_js面试基础知识
在JavaScript面试中,面试官通常会问一些基础题目来考察应聘者的掌握程度。本文将介绍几个常见的JavaScript基础问题,并提供多种解题思路和代码示例。
1. 如何判断一个变量是否为数组
解决方案
在JavaScript中,有多种方法可以判断一个变量是否为数组。以下是几种常见的方法:
方法一:使用 Array.isArray()
Array.isArray()
是ES5引入的一个方法,用于判断一个变量是否为数组。
javascript
function isArray(obj) {
return Array.isArray(obj);
}</p>
<p>console.log(isArray([])); // true
console.log(isArray({})); // false
方法二:使用 instanceof
instanceof
操作符可以用来判断一个对象是否是某个构造函数的实例。
javascript
function isArray(obj) {
return obj instanceof Array;
}</p>
<p>console.log(isArray([])); // true
console.log(isArray({})); // false
方法三:使用 Object.prototype.toString.call
这种方法可以避免跨框架的问题,因为它直接调用 Object
的 toString
方法。
javascript
function isArray(obj) {
return Object.prototype.toString.call(obj) === '[object Array]';
}</p>
<p>console.log(isArray([])); // true
console.log(isArray({})); // false
2. 如何实现一个深拷贝
解决方案
深拷贝是指创建一个新对象,这个新对象拥有与原对象相同的数据,但不共享内存地址。以下是几种常见的实现方法:
方法一:使用 JSON.parse
和 JSON.stringify
这种方法简单但有一些限制,例如不能处理函数和循环引用。
javascript
function deepClone(obj) {
return JSON.parse(JSON.stringify(obj));
}</p>
<p>const obj = { a: 1, b: { c: 2 } };
const clonedObj = deepClone(obj);</p>
<p>console.log(clonedObj); // { a: 1, b: { c: 2 } }
console.log(clonedObj === obj); // false
console.log(clonedObj.b === obj.b); // false
方法二:递归实现
这种方法可以处理更复杂的情况,包括函数和循环引用。
javascript
function deepClone(obj, hash = new WeakMap()) {
if (obj === null) return null;
if (typeof obj !== 'object') return obj;
if (hash.has(obj)) return hash.get(obj);</p>
<p>let cloneObj = new obj.constructor();
hash.set(obj, cloneObj);</p>
<p>for (let key in obj) {
if (obj.hasOwnProperty(key)) {
cloneObj[key] = deepClone(obj[key], hash);
}
}</p>
<p>return cloneObj;
}</p>
<p>const obj = { a: 1, b: { c: 2 }, d: [1, 2, 3] };
const clonedObj = deepClone(obj);</p>
<p>console.log(clonedObj); // { a: 1, b: { c: 2 }, d: [1, 2, 3] }
console.log(clonedObj === obj); // false
console.log(clonedObj.b === obj.b); // false
console.log(clonedObj.d === obj.d); // false
3. 如何实现一个防抖函数
解决方案
防抖函数用于限制函数的执行频率,确保在一定时间间隔内只执行一次。以下是几种常见的实现方法:
方法一:基本实现
javascript
function debounce(func, wait) {
let timeout;
return function(...args) {
clearTimeout(timeout);
timeout = setTimeout(() => func.apply(this, args), wait);
};
}</p>
<p>const handleResize = debounce(() => {
console.log('窗口被调整了');
}, 300);</p>
<p>window.addEventListener('resize', handleResize);
方法二:带立即执行选项
javascript
function debounce(func, wait, immediate) {
let timeout;
return function(...args) {
const later = () => setTimeout(() => func.apply(this, args), wait);
if (immediate && !timeout) {
func.apply(this, args);
}
clearTimeout(timeout);
timeout = later();
};
}</p>
<p>const handleResize = debounce(() => {
console.log('窗口被调整了');
}, 300, true);</p>
<p>window.addEventListener('resize', handleResize);
通过以上几种方法,你可以更好地应对JavaScript面试中的基础问题。希望这些内容对你有所帮助!
文章来源网络,作者:运维,如若转载,请注明出处:https://shuyeidc.com/wp/68769.html<