前端面试基础面试题——4

这篇具有很好参考价值的文章主要介绍了前端面试基础面试题——4。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

 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 对象有以下两个特点:

  1. 对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是Promise这个名字的由来,它的英语意思就是“承诺”,表示其他手段无法改变。

  2. 一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise对象的状态改变,只有两种可能:从pending变为fulfilled和从pending变为rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果,这时就称为 resolved(已定型)。如果改变已经发生了,你再对Promise对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

 3.解构赋值及其原理

解构赋值:其实就是分解出一个对象的解构,分成两个步骤:

  1. 变量的声明
  2. 变量的赋值

原理:ES6 变量的解构赋值本质上是“模式匹配”, 只要等号两边的模式相同,左边的变量就会被赋予匹配的右边的值,如果匹配不成功变量的值就等于 undefined

4.Vue常用的修饰符及使用的场景

vue中修饰符分为:表单修饰符、事件修饰符、鼠标按键修饰符、键值修饰符、v-bind修饰符

  1. 表单修饰符包括:lazy trim number
  2. 事件修饰符包括:stop prevent self once capture passive native
  3. 鼠标按钮修饰符包括: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 模块。

用途:js 可以写 es6、style 样式可以 scss 或 less;template 可以加 jade 等。文章来源地址https://www.toymoban.com/news/detail-691425.html

到了这里,关于前端面试基础面试题——4的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【前端高频面试题--Vue基础篇】

    【前端高频面试题–HTML篇】 【前端高频面试题–CSS上篇】 【前端高频面试题–CSS下篇】 【前端高频面试题–JS上篇】 【前端高频面试题–JS下篇】 【前端高频面试题–ES6篇】 【前端高频面试题–ES7-ES11】 【前端–异步编程】 【前端高频面试题–TypeScript篇】 【前端高频面

    2024年02月22日
    浏览(51)
  • 前端基础面试题(HTML,CSS,JS)

    前后端面试题库 (面试必备) 推荐:★★★★★ 地址:前端面试题库  web前端面试题库 VS java后端面试题库大全 代码结构:  使页面在没有css的情况下,也能够呈现出好的内容结构 有利于SEO:  爬虫根据标签来分配的权重,因此可以和搜索引擎建立良好的沟通,帮助爬虫抓

    2024年02月09日
    浏览(51)
  • 【学姐面试宝典】前端基础篇Ⅳ(JavaScript)

    前言 博主主页👉🏻蜡笔雏田学代码 专栏链接👉🏻【前端面试专栏】 今天继续学习前端面试题相关的知识! 感兴趣的小伙伴一起来看看吧~🤞 webpack 是一个现代 JavaScript 应用程序的 静态模块打包器(module bundler) 。当webpack 处理应用程序时,它会递归地构建一个依赖关系图

    2023年04月09日
    浏览(34)
  • 常见前端基础面试题(HTML,CSS,JS)(三)

      类型转换可以分为两种, 隐性转换 和 显性转换 主要分为三大类:数值类型、字符串类型、布尔类型 三大类的原始类型值的转换规则我就不一一列举了 数值类型(引用类型转换) 字符串类型(引用类型转换) 类型 转换前 转换后 number 4 4 string \\\"1\\\" 1 string \\\"\\\" 0 boolean true 1 b

    2024年02月12日
    浏览(58)
  • 【学姐面试宝典】—— 前端基础篇Ⅰ(HTTP/HTML/浏览器)

    前言 博主主页👉🏻蜡笔雏田学代码 专栏链接👉🏻【前端面试专栏】 今天开始学习前端面试题相关的知识! 感兴趣的小伙伴一起来看看吧~🤞 http: 超文本传输协议,是互联网上应用最为广泛的一种网络协议,是一个客户端和服 务器端请求和应答的标准(TCP),用于从 WW

    2024年02月19日
    浏览(46)
  • 【学姐面试宝典】—— 前端基础篇Ⅱ(HTTP/HTML/浏览器)

    前言 博主主页👉🏻蜡笔雏田学代码 专栏链接👉🏻【前端面试专栏】 今天继续学习前端面试题相关的知识! 感兴趣的小伙伴一起来看看吧~🤞 作用是 Doctype 声明于文档最前面,告诉浏览器以何种方式来渲染页面。 这里有两种模式, 严格模式 和 混杂模式 。 严格模式的排

    2024年01月25日
    浏览(68)
  • 记录--前端实习生的这个 bug 被用做了一道基础面试题

    测试发现了一个问题,简单描述问题就是通过函数删除一个数组中多个元素,传入的参数是一个数组索引。 然后发现实际效果有时删除的不是想要的内容。 具体  Bug  代码实现: 上面代码出现问题的原因是 splice 会改变原始数组的,然后导致索引偏移,不知道有没有同学出过

    2024年02月05日
    浏览(50)
  • 【学姐面试宝典】前端基础篇Ⅴ——JS深浅拷贝、箭头函数、事件监听等

    前言 博主主页👉🏻蜡笔雏田学代码 专栏链接👉🏻【前端面试专栏】 今天继续学习前端面试题相关的知识! 感兴趣的小伙伴一起来看看吧~🤞 addEventListener()方法,用于向指定元素添加事件句柄,它可以更简单的控制事件。语 法为: 第一个参数是 事件的类型 (如 “click”

    2024年01月19日
    浏览(44)
  • 前端基础面试题:如何判断对象是否具有某属性?遍历数组的方法有哪些?

    一、如何判断对象具有某属性? 如: let obj={name:\\\'zhangsan\\\',age:21} 有以下方法 ( property 为属性名的变量,实际上是key,键名): 1. property in obj 效果如图: in 运算符 2. Reflect.has(obj, property) 效果如图: 关于 Reflect: ① 它是JS的一个内置对象,无构造函数,可以用它遍历对象的key,如

    2023年04月08日
    浏览(58)
  • 【朝夕教育】2023年03月 其他-Web前端基础面试题(http_20道)

    一、http/浏览器 1、说一下http和https https 的 SSL 加密是在传输层实现的。 (1)http 和 https 的基本概念 http: 超文本传输协议,是互联网上应用最为广泛的一种网络协议,是一个客户端和服 务器端请求和应答的标准(TCP),用于从 WWW 服务器传输超文本到本地浏览器的传 输协议,它

    2023年04月09日
    浏览(41)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包