【JS】万字整理JavaScript相关基础技术面试题总结 - 前端面试必备 - 基础知识总结 - 秋招冲鸭

之前也总结过一些前端面试题，推荐可以一起看看

【网络】计算机网络常见面试题 - 前端面试必备 - 吐血整理

【CSS】面试题总结 - 基础知识总结 - 复习专用 - 前端面试必备 - 吐血整理

【Vue】面试题总结 - 基础知识总结 - 复习专用 - 组件相关 - Vue家族 - 源码相关

这次是关于JavaScript的面试题有题目也有答案，想深入了解，可以看我之前的一些笔记博文（狠详细）。当然，每题有相关博文的我都会放链接~

持续更新中…

1. 变量声明与类型

1.1 var let const 区别

1. var是ES5语法，let、const是ES6的语法
2. var有变量提升
3. var、let是变量，可修改；const是常量，不可修改
4. let、const 块级作用域；var函数作用域

【ES6】变量声明-var-let-const-区别与联系-总结

1.2 数据类型

值类型（7个）：Undefined、Null、Number、String、Boolean、Symbol(ES6)、BigInt(ES10)
引用类型：Object：Array、Function

【JS】JavaScript-ES5数据类型-基本数据类型-引用数据类型-类型之间的转换-数据类型的判断

1.3 值类型与引用类型的区别

值类型 存在栈内存中，变量拿到的就是它的值
引用类型 存在堆内存中，变量拿到的只是它的一个引用，是它的地址

【JS】JavaScript-对象-Object-内建对象-宿主对象-自定义对象-操作对象-基本数据类型与引用数据类型区别

1.4 typeof 能判断哪些类型

1. undefined、string、number、boolean、symbol、bigint【除了null的基本类型】
2. function 【函数】
3. object (typeof null === ‘object’) 【所有引用类型只能到object这里】

1.5 判断数据类型的方式

1. typeof 【除了null的基本类型 + function】
2. instanceof 【引用类型】【从子类到父类直到object】【顺着原型链】
3. toString() 【任意类型】
4. Array.isArray() 【数组】

1.6 === 与 ==

=== 严格的比较是否相等

== 会进行类型转换，再进行比较

以下都是成立的

100 == '100'
0 == ''
0 == false
fase == ''
null == undefined

有一个情况可以用下 ==

if(a == null) {
   }
// 等价于
if(a === null || a === undefined)()

1.7 truly变量与falsely变量

truly变量：!!a === true 的变量
falsely变量：!!b === false 的变量

以下是falsey变量，除了这六种情况，其余都是truely变量

!!0 === false
!!NaN === false
!!'' === false
!!null === false
!!undefined === false
!!false === false

1.8 强制类型转换和隐式类型转换

强制：parseInt、parseFloat、toString
隐式：if、逻辑运算、==、+拼接字符串

一定要看这个，狠详细
【JS】JavaScript-ES5数据类型-基本数据类型-引用数据类型-类型之间的转换-数据类型的判断

1.9 语句与表达式

表达式：一个表达式会产生一个值，可以放在任何一个需要值的地方

a
a+b
demo(1)
x===y? 'a': 'b'

语句

if(){
   }
for(){
   }

2. 数组字符串相关

2.1 手写深拷贝

function deepClone(obj){
   
	if (typeof obj !== 'object' || obj === null){
   
		return obj
	}
	let result = Array.isArray(obj) ? []: {
   }
	for (let key in obj) {
   
		if(obj.hasOwnProperty(key)) {
   
			result[key] = deepClone(obj[key])
		}
	}
	return result
}

【JS】自定义JS工具函数库-自定义对象方法-new-instanceof-mergeObject-实现数组与对象的深拷贝与浅拷贝-封装字符串相关函数

2.2 手写深度比较

// 判断是否是对象或数组
function isObject(obj) {
   
  return typeof obj === object && obj !== null;
}

// 深度比较
function isEqual(obj1, obj2) {
   
  if (!isObject(obj1) || !isObject(obj2)) {
   
    // 值类型，直接判断【一般不会传函数，不考虑函数】
    return obj1 === obj2;
  }
  if (obj1 === obj2) {
   
    return true;
  }
  // 两个都是对象或数组，而且不相等
  // 1. 先判断键的个数是否相等，不相等一定返回false
  const obj1Keys = Object.keys(obj1);
  const obj2Keys = Objext.keys(obj2);
  if (obj1Keys.length !== obj2Keys.length) {
   
    return false;
  }
  // 2. 以obj1为基准，和obj2依次递归比较
  for (let key in obj1) {
   
    // 递归比较
    const res = isEqual(obj1[key], obj2[key]);
    if (!res) {
   
      return false;
    }
  }
  // 3. 全相等
  return true;
}

2.3 数组的API有哪些是纯函数

纯函数：①不改变原数组(没有副作用) ②返回一个新数组
concat、map、filter、slice

非纯函数：push、pop、shift、unshift、forEach、some、every、reduce

【JS】你不得不知道的JavaScript数组相关知识【全面总结】复习专用

2.4 split()和join()的区别

split() 是字符串的方法
join() 是数组的方法

'1-2-3'.split('-') // [1,2,3]
[1,2,3].join('-') // 1-2-3

2.5 数组slice与splice区别

slice 切片
splice 剪接

【JS】JavaScript数组-操作方法-concat-数组强制打平-slice-splice方法使用

2.6 手写字符串 trim

String.prototype.trim = function() {
   
	return this.replace(/^\s+/, '').replace(/\s+$/, '')
}

3. 函数相关

3.1 函数声明与函数表达式

函数声明式

function fn(a, b) {
   
  return a + b;
}

函数表达式

let fun = function(a, b){
   
  return a + b;
}

3.2 什么是JSON

• JSON是一种数据格式，本质是一段字符串
• JSON格式与JS对象结构一致，对JS语言更友好
• window.JSON是一个全局对象，常用的两个方法 JSON.stringify 和JSON.parse

3.3 将URL参数解析成JS对象

传统方法，分析search

function queryToObj() {
   
	const res = {