前端面试宝典

简介: 前端面试宝典

题目一


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 放在页面底部


扩展


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


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

相关文章
|
7天前
|
前端开发 JavaScript Java
2024高频前端面试题合集(一)
JavaScript Bridge 是一种在 JavaScript 和其他语言(如 Java、Objective-C 等)间建立通信的技术,常用于混合应用开发,允许调用原生功能、获取数据、事件通知及优化性能。SSR(服务器端渲染)的单机 QPS 取决于服务器性能、应用复杂度、网络条件等因素。Egg.js 是基于 Node.js 的企业级框架,通过目录结构约定、启动流程、插件机制和核心组件来初始化应用。前端错误捕获可通过 try-catch、window.onerror、Promise.catch 和 unhandledrejection 事件等方式实现。
|
10天前
|
缓存 JavaScript 前端开发
2024 前端高频面试题之 Vue 篇
2024 前端高频面试题之 Vue 篇
30 8
|
10天前
|
JavaScript 前端开发
前端面试02(JS)
本文是前端面试系列的第二篇,主要涵盖了JavaScript的基础知识,包括JS的组成(ECMAScript、DOM、BOM)、内置对象(如String、Array、Math、Date等)、数组操作方法、数据类型检测方法(typeof、instanceof、constructor、Object.prototype.toString.call)、闭包的概念及其特点、前端内存泄漏的原因和类型、事件委托的优势、基本数据类型与引用数据类型的差异、原型链的工作原理以及JS实现继承的多种方式(原型链、构造函数、组合继承等)。文章结尾鼓励读者点赞和支持作者。
9 1
|
10天前
|
前端开发 Java
前端面试题01(css)
前端面试题01聚焦CSS,涵盖选择器优先级、隐藏元素方法、px与rem差异、重绘与重排解释、元素居中技巧及可继承属性。还探讨了CSS预处理器SASS和LESS的特性。文章提供实例代码展示居中布局的多种实现方式。鼓励读者点赞和支持。
14 0
|
17天前
|
存储 缓存 前端开发
100道 IT名企前端面试真题,Web前端阿里等大厂面试题汇总
100道 IT名企前端面试真题,Web前端阿里等大厂面试题汇总
|
17天前
|
移动开发 前端开发 JavaScript
【前端面试】前端面试题300道~~熬夜吐血整理,2024年最新大厂面试经验分享稿
【前端面试】前端面试题300道~~熬夜吐血整理,2024年最新大厂面试经验分享稿
|
17天前
|
前端开发 JavaScript
【前端面试】this的指向_不爱吃糖的程序媛夏天,web前端面试项目中的问题包括
【前端面试】this的指向_不爱吃糖的程序媛夏天,web前端面试项目中的问题包括
|
17天前
|
前端开发 JavaScript 中间件
Vue3整合VxeTable,2024大厂前端面试
Vue3整合VxeTable,2024大厂前端面试
|
17天前
|
前端开发 JavaScript
JavaScript新科技:PostCSS的安装和使用,2024年最新2024网易Web前端高级面试题总结
JavaScript新科技:PostCSS的安装和使用,2024年最新2024网易Web前端高级面试题总结
|
17天前
|
移动开发 前端开发 JavaScript
10款精美的web前端源码的特效,2024年最新面试题+笔记+项目实战
10款精美的web前端源码的特效,2024年最新面试题+笔记+项目实战