21.Vue修饰符有哪些?
.prevent:阻止默认行为 .stop:阻止事件冒泡 .self:当事件发生在该元素本身而不是子元素的时候会触发 .once:只执行一次 .capure:事件侦听,事件发生的时候会调用
22.Vue-router导航守卫钩子有哪些类型,执行顺序是什么?
全局守卫 路由独享守卫 组件内守卫 导航被触发。 在失活的组件里调用 beforeRouteLeave 守卫。 调用全局的 beforeEach 守卫。 在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+)。 在路由配置里调用 beforeEnter。 解析异步路由组件。 在被激活的组件里调用 beforeRouteEnter。 调用全局的 beforeResolve 守卫 (2.5+)。 导航被确认。 调用全局的 afterEach 钩子。 触发 DOM 更新。 调用 beforeRouteEnter 守卫中传给 next 的回调函数,创建好的组件实例会作为回调函数的参数传入。
23.Vue中data为什么是一个函数?
如果data是对象的话,由于对象是引用类型,组件被复用的话,就会创建多个实例。本质上这些实例,都是同一个构造函数,为了避免组件之间的data冲突,data必须是一个函数。
24.ES6有哪些新特性?
Let、const、箭头函数、点点点运算符、变量的解构赋值简化对象写法、导入导出(import,export)、 形参的默认值、模板字符串、Promise、symbol、class类、for in、for of、Set、map、generator(接呢瑞特)
25.html5有哪些新特性、新标签?
语义化标签:header(头部标签)nav(导航栏标签)main(主体标签)section(划分区块)aside(侧栏标签)footer(页脚标签) 本地存储:localstorage (永久存储) sessionstorage(临时存储) 音频标签:audio 视频标签:video 表单标签:form 画布:canvas
26.简单介绍原型链?
所有对象都有自己的原型对象(prototype)。一方面,任何一个对象,都可以充当其他对象的原型;另一方面,由于原型对象也是对象,所以它也有自己的原型。因此,就会形成一个“原型链”(prototype chain)最终都可以上溯到Object.prototype Object.prototype对象有没有它的原型呢?回答Object.prototype的原型是null。null没有任何属性和方法,也没有自己的原型。因此,原型链的尽头就是null。
27.说一下你对Promise的了解?说说你对Promise的原理的理解?
Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。 所谓promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。
28.什么是事件委托?为什么这样做?
它还有一个名字叫事件代理,事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。 为什么这样做呢?通过事件委托可以减少事件处理程序数量,这样就能大大的减少与dom的交互次数,提高性能;
29.简述一下对闭包理解?
闭包:在一个外函数中定义了一个内函数,内函数里运用了外函数的临时变量,并且外函数的返回值是内函数的引用。这样就构成了一个闭包。一般情况下,在我们认知当中,如果一个函数结束,函数的内部所有东西都会释放掉,还给内存,局部变量都会消失。但是闭包是一种特殊情况,如果外函数在结束的时候发现有自己的临时变量将来会在内部函数中用到,就把这个临时变量绑定给了内部函数,然后自己再结束。经常用闭包来实现面向对象编程 一个函数和它的周围状态的引用捆绑在一起的组合 是一个可以读取其他函数内部变量的函数,在js中只有函数内部的函数才可以读取该函数内部的变量,因此,闭包可以是一个函数中返回的函数。 闭包的好处:可以读取其他函数你内部的变量,并将其一直保存在内存中。 坏处: 可能会造成内存泄露或者内存溢出
30.axios的原理,基于什么实现的?
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。 axios还是属于 XMLHttpRequest, 因此需要实现一个ajax;还需要一个promise对象来对结果进行处理。
31.js中new操作符做了哪些事情?
new操作符新建了一个空对象,这个对象原型指向构造函数的prototype,执行构造函数后返回这个对象 1、创建一个空对象 2、这个对象的原型指向构造函数的prototype 3、绑定this指向,执行构造函数 4、确保返回的是对象
32.本地存储和cookie的区别?
存储大小,本地存储官方说法是 5M 的大小,然而 Cookies 的存储大小更小并且和浏览器本身有关(大概在 4000个字节左右) Cookie 存储的内容会保留在 HTTP 请求的 Header 中,并且会随每次请求发送到浏览器;然而本地存储只会保留在客户端,浏览器请求过程不会发送到服务端。
33.说一下对proxy的理解?
Proxy可以理解成,在目标对象之前架设一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。 Proxy 这个词的原意是代理,用在这里表示由它来“代理”某些操作,可以译为“代理器”
34.vuex中如何实现数据持久化(数据刷新不掉)?
为了防止刷新数据丢失,可以将一些数据保存在localstorage、sessionstorage或cookie中,可以保证页面刷新数据不丢失且易于读取。
35.vue是如何实现数据双向绑定的?
vue.js是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。
36.什么是插槽,插槽的分类,分别在什么情况下使用?
Vue 为 组件的封装者 提供的能力 1.匿名插槽:没有名字的插槽 2.具名插槽:有名字(name属性)的插槽 3.作用域插槽:子组件中的数据只能子组件访问到,但是我们的插槽往往定义在父组件中,这个时候就需要作用域插槽来打通他们之间的关系,然后就能在父组件中愉快的使用子组件的数据了。 当子组件被复用时,需要在特定的区域展示不同的定制化的内容。
37.什么是jsx,使用jsx语法有什么好处?
JSX 是 JavaScript 的一种扩展,为函数调用和对象构造提供了语法糖,特别是 React.createElement()。 JSX和模板引擎或 HTML相似,但它不是。JSX 生成 React 元素,同时允许充分利用 JavaScript 的全部功能。 JSX优点: 开发人员体验代码:更易读,更形象,类 XML 语法可更好地表示嵌套的声明式结构。 非正式开发人员:可更容易修改代码,因 JSX 类似HTML。 减少语法错误,开发人员代码量变少。
38.说一说react的生命周期(class组件或者react hooks中的都行)?
组件将要挂载时触发的函数:componentWillMount 组件挂载完成时触发的函数:componentDidMount 是否要更新数据时触发的函数:shouldComponentUpdate 将要更新数据时触发的函数:componentWillUpdate 数据更新完成时触发的函数:componentDidUpdate 组件将要销毁时触发的函数:componentWillUnmount 父组件中改变了props传值时触发的函数:componentWillReceiveProps
39.Vue-router路由模式有几种,分别是什么?
1.hash路由 hash路由是依据‘#’后的地址进行监听跳转的,通过location.hash来获取当前的hash值,通过hashchange事件进行监听,相同的hash地址不会触发该事件。 2.history 该模式是利用h5新增的pushstate和replacestate将地址直接压入历史记录栈中,通过popstate进行监听实现页面跳转的。 该模式如果访问的相同的地址会导致404报错,需要后端进行相应的配置 3.abstract 该种模式支持js运行环境,比如在nodejs中。当识别不到window的api的时候就会强制进入该种模式。
40.判断js对象是否具备某一属性(至少写出三种)?
hasOwnProperty 查看对象中是否包含某一属性 返回一个布尔值 true / false 语法:obj.hasOwnProperty('name') in 运算符 语法:'name' in obj (.)与 undefined 相较 语法:obj.age == undefined
以上就是H5前端面试题,后续会持续更新,敬请关注。