IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> DAY2刷面试题 -> 正文阅读

[JavaScript知识库]DAY2刷面试题

只是我自己刷的哦!不是真的面试问到的,是在为面试做准备!

箭头函数和普通函数有什么区别?

箭头函数是匿名函数,不能作为构造函数,不能使用new。
箭头函数不绑定arguments,取而代之用rest参数解决。
箭头函数不绑定this,会捕获其所在的上下文的this值,作为自己的this值。
箭头函数通过call()或apply()方法调用一个函数时,只传入了一个参数,对this没有影响。
箭头函数没有原型属性。
箭头函数不能当做Generator函数,不使用yield关键字。

new操作具体做了什么?

创建一个空的对象
将this指向这个对象
通过this,为这个对象添加属性
通过this,将__proto__属性指向构造函数的原型对象

call、apply、bind区别?

call()、apply()和bind()都是用来改变函数执行时的上下文的,可以借助他们实现继承。
call()和apply()唯一的区别就是参数不一样,call()是apply()的语法糖。
bind()是返回一个新的函数,供以后调用,而apply()和call()是立即调用。

JS判断变量是不是数组的方法?

1、instanceof

var arr=[];
arr instanceof Array

2、原型prototype+toString+call()

var arr=[];
Object.prototype.toString.call(arr)

3、原型protitype+isPrototypeOf()

var arr=[];
Array.prototypr.isPrototypeOf(arr)

4、构造函数constructor

var arr=[];
console.log(arr.constructor.toString())

5、数组方法isArry()

var arr=[];
Array.isArray(arr)

Vue双向绑定

数据劫持:vue.js是采用数据劫持结合发布者-订阅者模式,通过Object.definePrototy()来劫持各个属性的setter、getter,在数据变动时发布消息给订阅者,触发相应的监听回调。

MVVM

MVVM为: Model、View、ViewModel
Model代表数据模型,例View返回的data对象
View代表UI组件
VM是View和Model的桥梁,主要负责:数据绑定和视图监听

所理解的MVVM响应式原理
MVVM作为绑定的入口,整合Observer、Compile和Watcher三者,通过Observer来监听model数据变化,通过Compile来解析编译模板指令,最终利用Watcher搭建起Observer、Compile之间的通信桥梁,达到数据变化->视图更新;视图交互变化->数据model变更的双向绑定效果。

Vue生命周期(2.x)

beforeCreate:创建之前,还没有data数据和Method方法
Created:创建完成,data和Method可以使用了
beforeMount:渲染之前
mounted:页面渲染已经完成,可以操作DOM了
beforeUpdate:data改变之前,对应的组件重新渲染之前
updated:data改变之后,对应的组件重新渲染完成
beforeDestory:在实例销毁之前,此时实例还可以使用
destroyed:实例销毁后

第一次进入组件或者页面,会执行哪些生命周期?

beforeCreate
Created
beforeMount
mounted

  • 如果使用了keep-alive组件会多执行一个activated
  • 但是第二次进入就之后执行activated,因为组件被缓存了。

keep-alive组件作用

vue性能优化
一般结合路由使用,如果没有变化,可以做一个缓存,不用重新加载。
activated和deactivated两个生命周期钩子函数。
用keep-alive包裹的组件在切换的时候不会进行销毁,而是缓存到内存中,并执行deactivated函数,命中缓存渲染结束后会执行activated钩子函数。

Vue优化方式

v-if和v-show
图片懒加载
路由懒加载
减少重新渲染和创建dom结点的时间,采用虚拟dom
使用Object.freeze()方式冻结data中的属性,从而阻止数据劫持

v-if和v-show

1、v-if是动态向dom树内添加或者删除dom元素
v-show是通过设置dom元素的display样式控制显示与隐藏
2、编译过程:v-if切换有一个局部编译/卸载的过程,切换过程中合适的销毁和重建内部的事件监听和子组件
v-show只是简单的css切换
3、编译条件:v-if是惰性的,如果初始条件为假,则什么也不做;只有在第一次条件变化时才开始局部编译
v-show是在任何条件都被编译,然后被缓存,dom元素保留
4、v-if性能切换消耗更高
v-show初始渲染消耗更高
5、v-if适合运营条件不太变化
v-show适合频繁切花

虚拟dom

虚拟dom是相对于浏览器所渲染出来的真实dom,在react、vue等技术出来之前,想要改变页面展示内容只能通过遍历查询dom数找到需要修改的dom节点,然后进行修改来达到更新ui的目的。
这种方式相当损耗计算资源,因为每次查询都要遍历整颗dom树,如果建立一个和dom树虚拟的dom对象(js对象),以对象嵌套的方式来表示dom树,那么每次dom的更改就变成了js对象属性的更改,这样查找js对象的属性变化比查询dom树性能开销小。

dom树优缺点
缺点:首次大量渲染dom时,由于多了一层虚拟dom的计算,会比插入innerHTML慢
优点:减少了dom操作,减少了回流与重绘。
保证性能的下限,性能虽然不是最好但是具备局部更新的能力,大部分时候会比正常dom性能高。

回流与重绘

回流
render树中一部分或全部元素需要改变尺寸、布局、或着需要隐藏而需要重新构建,这个过程叫做回流
回流必将引起重绘
重绘
render树中一部分元素改变,而不影响布局的,只影响外观的,比如颜色。
页面至少经历一次回流和重绘(第一次加载的时候)。
区别
回流必将引起重绘,但是重绘不一定会引起回流。
比如只有颜色改变的时候只会发生重绘不会发生回流。
页面布局和几何属性改变时就需要回流。
添加或者删除可见的DOM元素,元素位置改变,元素尺寸改变、内容改变、页面渲染初始化、浏览器窗口改变等
优化
使用DocumentFragment进行缓存操作,引发一次回流和重绘;
使用display:none技术,只引发两次回流和重绘;
使用cloneNode(true or false)和replaceChild技术,引发一次回流和重绘;
不要经常访问会引起浏览器flush队列的属性,如果确实要访问,就利用缓存;
让元素脱离动画流,减少回流的Render tree的规模;

位于<head>间的代码片段是做什么用的?

  • <meta name="viewport" content="width=device-width, initial-scale=1">表示支持响应式

  • <meta name="apple-mobile-web-app-capable" content="yes" />
    iPhone私有标签,它表示:允许全屏模式浏览

  • <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    iPhone私有标签,它指定的iPhone中safari顶端的状态条的样式

  • <meta name="format-detection" content="telephone=no; email=no" />
    不识别邮件和不把数字识别为电话号码

  • initial-scale :初始的缩放比

  • minimum-scale:允许用户缩放到最小比例

  • maximum-scale:允许用户缩放到最大比例

  • user-scalable:用户是否可以手动缩放

网关协议

BGP:边界网关协议
ICMP:控制报文协议
PPP:点对点协议
RIP:内部网关协议(IGP)
BGP:外部网关协议

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-09-14 13:14:30  更:2021-09-14 13:15:09 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年12日历 -2024/12/28 12:41:51-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码
数据统计