前端面试宝典

简介: 前端面试宝典

题目一


1:javasprite 的深浅拷贝,可以用代码简述一下区别吗?

2:你会采用什么方式来优化项目?


考点


1:Javasprite的深浅拷贝


答案


浅拷贝:Object.assign

深拷贝:可以通过 JSON.parse(JSON.stringify(object)) 来解决


let a = {
 age: 1
}
let b = Object.assign({}, a)
a.age = 2
console.log(b.age) // 1


一般情况下,浅拷贝可以解决大部分问题,但是如果当浅拷贝只解决了第一层的问题,但是接下来的值还是有对象的话,浅拷贝就不能运行出正确结果,这时候就需要深拷贝来解决问题。深拷贝可以运用JSON.parse(JSON.stringify(object)) 来实现


let a = {
    age: 1,
    jobs: {
        first: 'FE'
    }
}
let b = JSON.parse(JSON.stringify(a))
a.jobs.first = 'native'
console.log(b.jobs.first) // FE


但是深拷贝还是有一定的局限性的,比如:不能序列化函数,会忽略undefined,不能解决循环引用对象。


题目二


js的性能优化


考点


影响javasprite性能的因素


答案


影响js的性能的因素主要有:代码松散、缺乏组织,事件处理性质量差,依赖过多,迭代时间长。


我们可以从一下方面提高js的性能,进行优化:


减少 HTTP 请求数

减少 DNS 查询

使用 CDN

避免重定向

图片懒加载

减少 DOM 元素数量

减少 DOM 操作

使用外部 JavaScript 和 CSS

压缩 JavaScript、CSS、字体、图片等

优化 CSS Sprite

使用 iconfont多域名分发划分内容到不同域名

尽量减少 iframe 使用避免图片 src 为空

把样式表放在 link 中

把 JavaScript 放在页面底部


扩展


浅拷贝:如果原型对象的成员变量是值类型,将复制一份给克隆对象,也就是说在堆中拥有独立的空间;如果原型对象的成员变量是引用类型,则将引用对象的地址复制一份给克隆对象,也就是说原型对象和克隆对象的成员变量指向相同的内存地址。换句话说,在浅克隆中,当对象被复制时只复制它本身和其中包含的值类型的成员变量,而引用类型的成员对象并没有复制。


深拷贝:是一种完全拷贝,无论是值类型还是引用类型都会完完全全的拷贝一份,在内存中生成一个新的对象,简单点说就是拷贝对象和被拷贝对象没有任何关系,互不影响。

相关文章
|
4月前
|
存储 前端开发 JavaScript
前端面试题23-34
通过对 Promise 和 ECMAScript6 的深入理解,可以更好地应对现代 JavaScript 开发中的复杂异步操作和新特性,提升代码质量和开发效率。
39 2
|
2月前
|
缓存 前端开发 中间件
[go 面试] 前端请求到后端API的中间件流程解析
[go 面试] 前端请求到后端API的中间件流程解析
|
6天前
|
Web App开发 前端开发 Linux
「offer来了」浅谈前端面试中开发环境常考知识点
该文章归纳了前端开发环境中常见的面试知识点,特别是围绕Git的使用进行了详细介绍,包括Git的基本概念、常用命令以及在团队协作中的最佳实践,同时还涉及了Chrome调试工具和Linux命令行的基础操作。
「offer来了」浅谈前端面试中开发环境常考知识点
|
2月前
|
存储 XML 移动开发
前端大厂面试真题
前端大厂面试真题
|
2月前
|
存储 前端开发 JavaScript
44 个 React 前端面试问题
【8月更文挑战第18天】
37 2
|
2月前
|
存储 JavaScript 前端开发
2022年前端js面试题
2022年前端js面试题
29 0
|
2月前
|
存储 前端开发 JavaScript
44 个 React 前端面试问题
44 个 React 前端面试问题
|
2月前
|
存储 JavaScript 前端开发
|
2月前
|
Web App开发 存储 缓存
|
2月前
|
前端开发 容器
前端面试热门问题--浮动和清除浮动(CSS)
前端面试热门问题--浮动和清除浮动(CSS)
下一篇
无影云桌面