位置: IT常识 - 正文

前端面试题(前端面试题目100及最佳答案)

编辑:rootadmin
前端面试题

目录

1、HTTP缓存机制

2、echarts 在 vue 中怎么引用?

1-1、全局引用:

1-2、局部使用:

3、Vue 组件如何进行传值的?

1-1、父组件向子组件传递数据

1-2、子组件向父组件传递数据

1-3、非父子组件之间传递数据

4、Vuex 的 5 个核心属性是什么?

1-1、state

1-2、getter

1-3、mutation

1-4、action

1-5、module

5、Vue-Router 是干什么的,原理是什么?

6、ES5的继承和ES6的继承有什么区别?

7、定时器的执行顺序或机制?

8、Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

9、fetch发送2次请求的原因?

10、http和https的区别?

11、Cookie、sessionStorage、localStorage的区别?

12、Cookie如何防范XSS攻击?

13、你了解的浏览器的重绘和回流导致的性能问题?

14、DOM、BOM对象分别是什么

15、闭包是什么?

16、原型、原型链是什么

17、computed与watch有什么区别

18、new操作符具体干了什么呢?


1、HTTP缓存机制

推荐整理分享前端面试题(前端面试题目100及最佳答案),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:前端面试题选择题,前端面试题及答案,前端面试题2023八股文,前端面试题宝典app,前端面试题2023,前端面试题vue,前端面试题及答案2023,前端面试题及答案2023,内容如对您有帮助,希望把文章链接给更多的朋友!

浏览器缓存也包含很多内容:

HTTP 缓存、indexDB、cookie、localstorage 等等。这里我们只讨论 HTTP 缓存相关内容。

浏览器缓存分为强缓存和协商缓存

强缓存是利用 http 的返回头中的 Expires 或者 Cache-Control 两个字段来控制的,用来表示资源的缓存时间。

2、echarts 在 vue 中怎么引用?

首先我们初始化一个 vue 项目,执行 vue create echart

接着我们进入初始化的项目下。安装 npm install echarts -S 或 cnpm install echarts -S

安装完成之后,我们就可以开始引入我们需要的 echarts 了,接下来介绍几种使用 echarts 的方式。

1-1、全局引用:

首先在 main.js 中引入 echarts,将其绑定到 vue 原型上:

import echarts from 'echarts'

Vue.prototype.$echarts = echarts;

接着,我们就可以在任何一个组件中使用 echarts 了。

1-2、局部使用:

当然,很多时候没必要在全局引入 ecahrts,那么我们只在单个组件内使用即可,代码更加简单:

import echarts from 'echarts'

可以看到,我们直接在组件内引入 echarts,接下来跟全局引入的使用一样。区别在于,这种方式如果你想在其他组件内用 echarts,则必须重新引入了。

3、Vue 组件如何进行传值的?1-1、父组件向子组件传递数据

父组件内设置要传的数据,在父组件中引用的子组件上绑定一个自定义属性并把数据绑定在自定义属性上,在子组件添加参数 props 接收即可

1-2、子组件向父组件传递数据前端面试题(前端面试题目100及最佳答案)

子组件通过 Vue 实例方法$emit 进行触发并且可以携带参数,父组件监听使用@(v-on)进行监听,然后进行方法处理

1-3、非父子组件之间传递数据

1、引入第三方 new Vue 定义为 eventBus

2、在组件中 created 中订阅方法 eventBus.$on("自定义事件名",methods中的方法名)

3、在另一个兄弟组件中的 methods 中写函数,在函数中发布 eventBus 订阅的方法 eventBus.$emit("自定义事件名”)

4、在组件的 template 中绑定事件(比如 click)

4、Vuex 的 5 个核心属性是什么?

分别是 State、 Getter、Mutation 、Action、 Module

1-1、state

state 为单一状态树,在 state 中需要定义我们所需要管理的数组、对象、字符串等等,只有在这里定义了,在 Vue.js 的组件中才能获取你定义的这个对象的状态。

1-2、getter

getter 有点类似 Vue.js 的计算属性,当我们需要从 store 的 state中派生出一些状态,那么我们就需要使用 getter,getter 会接收 state 作为第一个参数,而且 getter 的返回值会根据它的依赖被缓存起来,只有 getter 中的依赖值(state 中的某个需要派生状态的值)发生改变的时候才会被重新计算。

1-3、mutation

更改 store 中 state 状态的唯一方法就是提交 mutation,就很类似事件。每个 mutation 都有一个字符串类型的事件类型和一个回调函数,我们需要改变 state 的值就要在回调函数中改变。我们要执行这个回调函数,那么我们需要执行一个相应的调用方法:store.commit。

1-4、action

action 可以提交 mutation,在 action 中可以执行 store.commit,而且 action 中可以有任何的异步操作。在页面中如果我们要嗲用这个 action,则需要执行 store.dispatch

1-5、module

module 其实只是解决了当 state 中很复杂臃肿的时候,module 可以将 store 分割成模块,每个模块中拥有自己的 state、mutation、action和 getter

5、Vue-Router 是干什么的,原理是什么?

Vue-Router 是 Vue.js 官方的路由插件,它和 Vue.js 是深度集成的,适合用于构建单页面应用。Vue 的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。传统的页面应用,是用一些超链接来实现页面切换和跳转的。在 Vue-Router 单页面应用中,则是路径之间的切换,也就是组件的切换。路由模块的本质 就是建立起 url 和页面之间的映射关系。

“更新视图但不重新请求页面”是前端路由原理的核心之一,目前在浏览器环境中这一功能的实现主要有两种方式:

利用 URL 中的 hash(“#”)

利用 History interface 在 HTML5 中新增的方法

6、ES5的继承和ES6的继承有什么区别?

ES5的继承时通过prototype或构造函数机制来实现。ES5的继承实质上是先创建子类的实例对象,然后再将父类的方法添加到this上(Parent.apply(this))。

ES6的继承机制完全不同,实质上是先创建父类的实例对象this(所以必须先调用父类的super()方法),然后再用子类的构造函数修改this。

具体的:ES6通过class关键字定义类,里面有构造方法,类之间通过extends关键字实现继承。子类必须在constructor方法中调用super方法,否则新建实例报错。因为子类没有自己的this对象,而是继承了父类的this对象,然后对其进行加工。如果不调用super方法,子类得不到this对象。

7、定时器的执行顺序或机制?

因为js是单线程的,浏览器遇到setTimeout或者setInterval会先执行完当前的代码块,在此之前会把定时器推入浏览器的待执行事件队列里面,等到浏览器执行完当前代码之后会看一下事件队列里面有没有任务,有的话才执行定时器的代码。

8、Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

Doctype

本文链接地址:https://www.jiuchutong.com/zhishi/294507.html 转载请保留说明!

上一篇:Nodejs安装及npm配置(超详细)(nodejs安装与配置)

下一篇:vue3项目实战中的接口调用方法(一)async/await用法 对axios二次封装 实现异步请求(vue3项目搭建)

  • 什么是一般业务
  • 三方代付协议有效吗
  • 核定征收企业所得税应税所得率
  • 增值税申报时有0.1元差额,怎么申报
  • 个人所得税离职补偿金优惠政策
  • 员工全额承担社保账务怎么做?
  • 研发支出的材料费
  • 软件企业收到先征后返的增值税税款是否要缴纳企业所得税
  • 委托其他公司开票收款
  • 行政诉讼适用范围
  • 租金收入未收到 税法规定
  • 孵化器 怎么赚钱
  • 在win7中创建快捷方式可以创建什么
  • 个体户需要交钱吗
  • 销售折扣单独开票
  • 哪些固定资产不会随着时间的流逝贬值
  • 借条复印件可以起诉吗还有转账记录
  • thinkphp怎么部署
  • thinkphp paginate
  • win11正式版问题
  • 若依框架自动生成代码
  • 增值税进项税抵扣销项税
  • 应收账款保理的主要意图在于
  • 开出发票单位收到款项如何平账?
  • 事业单位利息收入
  • 社保征集单是什么样子的
  • 数字孪生demo
  • joomla组件
  • 合并财务报表抵消原理
  • thinkphp钩子场景
  • 残疾人就业保障金怎么申报
  • 防伪税控可以做什么
  • php调用第三方接口代码
  • mongodb添加环境变量
  • python 列表sum
  • 银行贷款可以置换险资吗
  • 如何网上填报个人所得税
  • 未开票收入申报有税务风险吗
  • 外商投资有限合伙企业
  • 上月的普票下月可以记账么
  • 增值税的专用发票金额含税吗
  • 事业单位应交增值税明细科目
  • 清算期间档案转移
  • 装修费用会计科目
  • 实缴增值税比计提增值税少怎么做账务处理
  • 税控盘年费每年都可以抵扣吗
  • 股东的投资款可以直接私人银行卡转账吗
  • 上月暂估本月怎么冲销
  • 返利开红字发票怎么做账
  • 个体户4年不注销有事吗
  • 个体户做账流程新手必看
  • 财税讲座视频
  • mysqldump导出csv文件
  • mac安装mysql
  • centos7.4修改主机名
  • wysafe.exe是什么
  • igs文件是什么文件
  • mac如何强制退出微信
  • centos6.6网络配置
  • ubuntu下载安装QQ的命令
  • windows102021年更新
  • windows10周年更新
  • iis的安全性设置主要包括
  • win7自动关闭显示器
  • win10登陆背景修改器
  • cocos2dx官方教程
  • cocos2d CC_CALLBACK_0/1/2/3之间的区别
  • jquery对动态生成的进行操作
  • 怎么创建pom.xml
  • python中列表删除
  • 远程计算机的命令
  • vue list清空
  • js的脚本语言
  • javascript怎么用
  • 国家税务总局增值税发票查验平台网址
  • 打印缴纳社保电子缴税凭证
  • 建筑业小规模纳税人工程结算增值税
  • 加强税务系统党委全面监督工作
  • 净缴税什么意思
  • 宁夏地税局电话
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设