1.谈谈你对 ES6 的理解
2.说说你对 promise 的了解
3.解构赋值及其原理
4.Vue常用的修饰符及使用的场景
5.vue 中 key 值的作用
6.什么是 vue 的计算属性?
7.watch的作用是什么
8.计算属性的缓存和方法调用的区别
9.响应式系统的基本原理
10.vue-loader 是什么?使用它的用途有哪些?
1.谈谈你对 ES6 的理解
es6 是一个新的标准,它包含了许多新的语言特性和库,是 JS 最实质性的一次升级。 比如'箭头函数'、'字符串模板'、'generators(生成器)'、'async/await'、'解构赋值'、'class'等等,还有就是引入 module 模块的概念。
箭头函数可以让 this 指向固定化,这种特性很有利于封装回调函数
-
(1)函数体内的 this 对象,就是定义时所在的对象,而不是使用时所在的对象。
-
(2)不可以当作构造函数,也就是说,不可以使用 new 命令,否则会抛出一个错误。
-
(3)不可以使用 arguments 对象,该对象在函数体内不存在。如果要用,可以用 Rest 参数代替。
-
(4)不可以使用 yield 命令,因此箭头函数不能用作 Generator 函数。
-
async/await 是写异步代码的新方式,以前的方法有回调函数和 Promise。
-
async/await 是基于 Promise 实现的,它不能用于普通的回调函数。async/await 与 Promise 一样,是非阻塞的。
-
async/await 使得异步代码看起来像同步代码,这正是它的魔力所在。
2.说说你对 promise 的了解
Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件监听——更合理和更强大。
所谓 Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。
Promise 对象有以下两个特点:
-
对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。
-
一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。
3.解构赋值及其原理
解构赋值:其实就是分解出一个对象的解构,分成两个步骤:
- 变量的声明
- 变量的赋值
原理:ES6 变量的解构赋值本质上是“模式匹配”, 只要等号两边的模式相同,左边的变量就会被赋予匹配的右边的值,如果匹配不成功变量的值就等于 undefined
4.Vue常用的修饰符及使用的场景
vue中修饰符分为:表单修饰符、事件修饰符、鼠标按键修饰符、键值修饰符、v-bind修饰符
- 表单修饰符包括:lazy trim number
- 事件修饰符包括:stop prevent self once capture passive native
- 鼠标按钮修饰符包括:left right middl
5.vue 中 key 值的作用
需要使用 key 来给每个节点做一个唯一标识,Diff 算法就可以正确的识别此节点,找到正确的位置区插入新的节点 所以一句话,key 的作用主要是为了高效的更新虚拟 DOM
6.什么是 vue 的计算属性?
先来看一下计算属性的定义: 当其依赖的属性的值发生变化的时,计算属性会重新计算。反之则使用缓存中的属性值。 计算属性和vue中的其它数据一样,都是响应式的,只不过它必须依赖某一个数据实现,并且只有它依赖的数据的值改变了,它才会更新
7.watch的作用是什么
watch 主要作用是监听某个数据值的变化。和计算属性相比除了没有缓存,作用是一样的。
借助 watch 还可以做一些特别的事情,例如监听页面路由,当页面跳转时,我们可以做相应的权限控制,拒绝没有权限的用户访问页面。
8.计算属性的缓存和方法调用的区别
计算属性是基于数据的依赖缓存,数据发生变化,缓存才会发生变化,如果数据没有发生变化,调用计算属性直接调用的是存储的缓存值;
而方法每次调用都会重新计算;所以可以根据实际需要选择使用,如果需要计算大量数据,性能开销比较大,可以选用计算属性,如果不能使用缓存可以使用方法;
其实这两个区别还应加一个watch,watch是用来监测数据的变化,和计算属性相比,是watch没有缓存,但是一般想要在数据变化时响应时,或者执行异步操作时,可以选择watch
9.响应式系统的基本原理
vue响应式的原理,首先对象传入vue实例作为data对象时,首先被vue遍历所有属性,调用Object.defineProperty设置为getter和setter,每个组件都有一个watcher对象,在组件渲染的过程中,把相关的数据都注册成依赖,当数据发生setter变化时,会通知watcehr,从而更新相关联的组件
10.vue-loader 是什么?使用它的用途有哪些?
vue-loader 是解析 .vue 文件的一个加载器,将 template/js/style 转换成 js 模块。文章来源:https://www.toymoban.com/news/detail-691425.html
用途:js 可以写 es6、style 样式可以 scss 或 less;template 可以加 jade 等。文章来源地址https://www.toymoban.com/news/detail-691425.html
到了这里,关于前端面试基础面试题——4的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!