前端大厂最新面试题-copy.docx
本文将对前端大厂最新面试题-copy.docx进行详细分析，总结相关知识点。
一、深拷贝和浅拷贝的区别
在 JavaScript 中，存在两大数据类型：基本类型和引用类型。基本类型数据保存在栈内存中，而引用类型数据保存在堆内存中。引用类型的变量是一个指向堆内存中实际对象的引用，存在栈中。
浅拷贝指的是创建新的数据，该数据有着原始数据属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值。如果属性是引用类型，拷贝的就是内存地址，即浅拷贝是拷贝一层，深层次的引用类型则共享内存地址。
二、浅拷贝的实现
JavaScript 中存在浅拷贝的现象有：
* Object.assign()
* Array.prototype.slice(), Array.prototype.concat()
* 使用拓展运算符实现的复制
例如，使用 Object.assign() 实现浅拷贝：
```
var obj = {
age: 18,
nature: ['smart', 'good'],
names: {
name1: 'fx',
name2: 'xka'
},
love: function () {
console.log('fx is a great girl')
}
}
var newObj = Object.assign({}, obj);
```
使用 slice() 实现浅拷贝：
```
const fxArr = ["One", "Two", "Three"]
const fxArrs = fxArr.slice(0)
fxArrs[1] = "love";
console.log(fxArr) // ["One", "Two", "Three"]
console.log(fxArrs) // ["One", "love", "Three"]
```
使用拓展运算符实现浅拷贝：
```
const fxArr = ["One", "Two", "Three"]
const fxArrs = [...fxArr]
fxArrs[1] = "love";
console.log(fxArr) // ["One", "Two", "Three"]
console.log(fxArrs) // ["One", "love", "Three"]
```
三、深拷贝
深拷贝开辟一个新的栈，两个对象属完成相同，但是对应两个不同的地址，修改一个对象的属性，不会改变另一个对象的属性。
常见的深拷贝方式有：
* _.cloneDeep()
* jQuery.extend()
* JSON.stringify()
例如，使用 _.cloneDeep() 实现深拷贝：
```
const _ = require('lodash');
const obj1 = {
a: 1,
b: { f: { g: 1 } },
c: [1, 2, 3]
};
const obj2 = _.cloneDeep(obj1);
console.log(obj1.b.f === obj2.b.f); // false
```
使用 jQuery.extend() 实现深拷贝：
```
const $ = require('jquery');
const obj1 = {
a: 1,
b: { f: { g: 1 } },
c: [1, 2, 3]
};
const obj2 = $.extend(true, {}, obj1);
console.log(obj1.b.f === obj2.b.f); // false
```
使用 JSON.stringify() 实现深拷贝：
```
const obj2 = JSON.parse(JSON.stringify(obj1));
```
但是这种方式存在弊端，会忽略 undefined、symbol 和函数。
深拷贝和浅拷贝是 JavaScript 中两个重要的概念，掌握它们可以帮助我们更好地理解和使用 JavaScript。
