Javascript面试通
js中有哪些基本数据类型
- String
- boolean
- number
- undefined
- Object
- Symbol
- nulll
let、var、const之间的区别
let和var的区别主要在于作用域
let是块级作用域，var是函数作用域
这里要先提一下变量提升
console.log(a); //undefined 这里变量还未声明就已经存在了
var a = 10;
变量提升是源于引擎的编译顺序，这里简单说一下，其实var声明变量执行循序是这样的
var a; //先创建变量空间
console.log(a); //继续执行下面的语句
a = 10; // 再给a赋值
至于如何是这样这里不过多解释，这就是变量提升产生的原因
| 区别 | let | var |
|---|---|---|
| 是否能重复声明 | 否 | 是 |
| 是否能变量提升 | 否 | 是 |
| 作用域 | 块作用域 | 函数作用域 |
作用域在这里特别演示一下
var的作用域 {} 并不能限制
{
let c = 3;
var d = 4;
}
console.log(c); //Uncaught ReferenceError: c is not defined
console.log(d); // 4
const和let的区别
| 区别 | let | const |
|---|---|---|
| 声明必须赋值 | 声明可以不赋值 | 声明时必须赋值否则报错 |
| 是否可以重复赋值 | 可以重复赋值 | 不可能重复赋值，但是引用类型可以改变内部的 |
下面来看一个列子
const obj = {}
obj.test = '123'; //这里const声明可以改变里面的属性
console.log(obj); //{test:123}
const arr = []; //数组也可以添加元素
arr.push('test')
console.log(arr);// array(1)
obj = {}; //但是这里赋值是改变引用的地址 所以报错不可重复赋值
arr= [''] // 报错 这里也是改变了引用地址
call、bind、apply的区别
call用法: function call(thisArg,arg1,arg2,.....)
apply用法：function.apply(thisArg, [argsArray])
call用法: function.bind(thisArg[, arg1[, arg2[, ...]]])
三者相同点：call和apply两者都是用来改变this的指向
不同点： call与apply区别主要在于参数,call接收的参数是参数列表而apply参数是参数数组，
bind与call和apply最主要的区别是bind会返回一个新绑定this的函数
深拷贝和浅拷贝
深浅拷贝可以说在很多面试过程中都会提问的一个问题！
深浅拷贝的问题主要出现在基本类型和引用类型的区别之上
基本类型：基本类型是指变量所指的内存区域存放的是值
引用类型：变量所指的内存空间是地址
基本与引用的区别就是变量指向的内存空间不同。
例如以下代码
var person = {
name: '张三',
age: 18,
};
var lisi = person;
lisi.name = '李四';
console.log(person.name); // 李四
console.log(lisi.name);//李四
其实上述代码在变量的指向如图所示
可以看出person和lisi都是指向同一个块内存区域
所以改变lisi也会影响person的值，这就是深浅拷贝最明显的区别, =也是浅拷贝的一种，但是深浅拷贝只对引用类型有区别，如果变量为基本类型则无深浅拷贝之说。这里不过多解释，因为基本类型都是重新指向新的内存区域
let a = 1;
let b = a;
b = 3;
console.log(a); //1
console.log(b);//3
到这里大家应该知道深浅拷贝的具体区别了。
接下来解释js中深浅拷贝的方法
JSON.stringify和JSON.parse
var person = {
name: '张三',
age: 18,
};
var lisi = JSON.parse(JSON.stringify(person));
lisi.name = '李四';
console.log(person.name); // 张三
console.log(lisi.name);//李四
方法的局限:
1.不能复制function、正则、Symbol
var person = {
name: '张三',
age: 18,
syb: Symbol('aa'),
reg: /aasd/,
getInfo: () => {
return name + age;
}
};
var lisi = JSON.parse(JSON.stringify(person));
console.log(lisi);
递归深拷贝
var person = {
name: '张三',
age: 18,
syb: Symbol('aa'),
date: new Date(),
reg: /正则/ig,
getInfo: () => {
return name + age;
}
};
function isObj(obj) {
return (typeof obj === 'objct' || typeof obj === 'function' && obj !== null)
}
function deepCopy(obj) {
let tempObj = Array.isArray(obj) ? [] : {}
for (let key in obj) {
tempObj[key] = isObj(obj[key]) ? deepCopy(obj[key]) : obj[key];
}
return obj;
}
let lisi = deepCopy(person);
console.log(lisi);
递归拷贝的效果最好，基本没有局限性.
浅拷贝的方法:
Object.assingb()
{..obj}
事件冒泡和事件捕获
n obj;
}
let lisi = deepCopy(person);
console.log(lisi);
[外链图片转存中...(img-61gKgUba-1616207494245)]
递归拷贝的效果最好，基本没有局限性.
`浅拷贝的方法`:
- Object.assingb()
- {..obj}
## 事件冒泡和事件捕获
