“约见”面试官系列之常见面试题第十七篇之实现深拷贝（建议收藏）

建议最简单的第一种

1、通过 JSON 对象实现深拷贝

this.data = JSON.parse(JSON.stringify(this.vm.$store.state.security.menuArr))

2、通过jQuery的extend方法实现深拷贝

var array = [1,2,3,4]; var newArray = $.extend(true,[],array);

3、使用递归的方式实现深拷贝

//使用递归的方式实现数组、对象的深拷贝
function deepClone1(obj) {
//判断拷贝的要进行深拷贝的是数组还是对象，是数组的话进行数组拷贝，对象的话进行对象拷贝
var objClone = Array.isArray(obj) ? [] : {};
//进行深拷贝的不能为空，并且是对象或者是

if (obj && typeof obj === "object") {
for (key in obj) {
if (obj.hasOwnProperty(key)) {
if (obj[key] && typeof obj[key] === "object") {
objClone[key] = deepClone1(obj[key]);
} else {
objClone[key] = obj[key];
}
}
}
}
return objClone;
}

4、Object.assign()拷贝
当对象中只有一级属性，没有二级属性的时候，此方法为深拷贝，但是对象中有对象的时候，此方法，在二级属性以后就是浅拷贝。
5、lodash函数库实现深拷贝
lodash很热门的函数库，提供了 lodash.cloneDeep()实现深拷贝
---------------------

本面试题为前端常考面试题，后续有机会继续完善。我是歌谣，一个沉迷于故事的讲述者。

欢迎一起私信交流。

“睡服“面试官系列之各系列目录汇总（建议学习收藏）

“约见”面试官系列之常见面试题第十七篇之实现深拷贝（建议收藏）相关推荐

“约见”面试官系列之常见面试题第十一篇之canvas（建议收藏）
目录前言介绍小试牛刀应用案例动画 API介绍 Demo 游戏三要素 Demo 截图 API介绍 canvas.style.width 和 canvas.width 的区别 Demo 合成图 ...
“约见”面试官系列之常见面试题第二十七篇之vue-router的重要属性
export default new Router({mode: 'history', //路由模式,取值为history与hashbase: '/', //打包路径,默认为/,可以修改routes: ...
“约见”面试官系列之常见面试题第二十三篇之get和post区别（建议收藏）
POST和GET是HTTP协议中最常用的两种传参方式,这里小小总结一下两者的区别,欢迎补充~! 请求方式 GET POST 参数位置 url的query中一般在content中,query也可参数 ...
“约见”面试官系列之常见面试题第二十一篇之函数防抖和节流（建议收藏）
目录前言概念函数防抖(debounce) 函数节流(throttle) 常见应用场景函数防抖的应用场景函数节流的应用场景实现原理函数防抖(debounce) 函数节流(throttle) ...
“约见”面试官系列之常见面试题第二十篇之vuex得理解（建议收藏）
一.概念 vuex是一个专为vue.js应用程序开发的状态管理模式(它采用集中式存贮管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化). 二.五大核心属性核心属性为:sta ...
“约见”面试官系列之常见面试题第十三篇之css动画效果（建议收藏）
目录 CSS动画简介第一部分:CSS Transition 1.1 基本用法 1.2 transition-delay 1.3 transition-timing-function 1.4 tran ...
“约见”面试官系列之常见面试题第十篇值meta标签（建议收藏）
目录什么是meta标签? meta的作用 meta的必需属性和可选属性必需属性content 可选属性常用meta标签大总结 charset 百度禁止转码 SEO 优化部分 viewport 各 ...
“约见”面试官系列之常见面试题第八篇说说原型与原型链（建议收藏）
目录一.prototype 二.__proto__ 三.constructor 四.实例与原型五.原型链一.prototype 在JavaScript中,每个函数都有一个prototype属性, ...
“约见”面试官系列之常见面试题第七篇说说Vue的生命周期（建议收藏）
目录 Vue实例的生命周期全过程(图) 在beforeCreate和created钩子函数间的生命周期 created钩子函数和beforeMount间的生命周期 el选项的有无对生命周期过程的影响 ...

“约见”面试官系列之常见面试题第十七篇之实现深拷贝（建议收藏）

“约见”面试官系列之常见面试题第十七篇之实现深拷贝（建议收藏）相关推荐

最新文章

热门文章