【牛客网-前端笔试题】——vue专项练习

本文介绍了牛客网作为求职者的强大资源,提供笔面试题库、面试经验分享和招聘服务。重点讲解了Vue的相关知识点,如组件生命周期、虚拟DOM、Vuex以及路由跳转等,并提到了面试技巧和刷题对提升求职能力的重要性。此外,还涵盖了数组操作、React组件this指向以及Vue的响应式原理等技术要点。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

🦸个人主页: 小卢要刷力扣题
🦸‍♂️ 作者简介: 大三学生,准备找工作的人儿
🕍 推荐一款找工作神器网站: 《牛客网》 |笔试题库|面试经验|实习招聘内推|
⛪ 系列专栏: 《前端面试题》
🐋 希望大家多多支持😘一起进步呀!
📝 如果文章对你有帮助的话,欢迎评论💬点赞👍收藏📂加关注

在这里插入图片描述


前言

秋招正式批已经到来,相信不少小伙伴在为找工作而烦恼,对自己的实力不太自信,感觉好难找工作,不用怕,下面我来给各位推荐一个知名刷题网站《牛客》

一、牛客是做什么的?

牛客网,是一个集笔面试系统、题库、课程教育、社群交流、招聘内推于一体的招聘类网站。牛客是领先的数字化招聘求职解决方案服务商,牛客向企业提供校园招聘技术人才招聘一站式解决方案服务,主要包括招聘渠道服务(发校招岗位收简历) ,招聘SaaS工具服务(笔、面试 、群面系统 ),招聘传播服务(技术竞赛、广告、线上招聘专场、牛客职播。
牛客网题库中包含几万道题目,主要通过第三方购买和 UGC 的方式获得,牛客网先后尝试了直播和录播课,内容覆盖笔试题解析、面试技巧和机器学习等。

在这里插入图片描述

在里面可以与大家交流最近的面试心得,
如果不知道怎么面试的或者面试技巧掌握得不够牢固的小伙伴可以在牛客里面找面经来看,快速提升自己的面试能力,以更快的找到自己心仪的工作

在这里插入图片描述
在这里插入图片描述

vue专项练习

在这里插入图片描述

当组件在keep-alive内被切换时,它的mounted和unmounted生命周期钩子会被activated和、deactivated代替。

在这里插入图片描述

v-show 本质就是通过设置 css 中的 display 设置为 none,控制隐藏
v-if 是动态的向 DOM 树内添加或者删除 DOM 元素

在这里插入图片描述

context是用在react中进行组件间的传值,vue并不提供该方法,Vue组件间传值可以通过props,$emit,Vuex,事件总线。通过props获取父组件的基本数据类型的值,在修改时会报错

在这里插入图片描述

push()在该数组最尾添加新的元素,然后返回更新后的数组长度,方法将改变原始数组的长度;
shift()删除该数组第一个元素,并且把该数组剩下的元素索引往前挪一位,然后返回删除的元素,方法将改变原始数组的长度;
reverse()反转该数组中元素的顺序,方法将改变原始数组。
concat()把两个以上的数字连接起来,该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
push(),shift(),reverse()改变原数组,会触发视图跟新;
concat()不更改数组,会返回新数组,因此没有替换原数组,不触发视图更新,要用新数组替换原数组才能实现视图更新。

在这里插入图片描述

虚拟 DOM 最大的优势在于抽象了原本的渲染过程,实现了跨平台的能力,而不仅仅局限于浏览器的 DOM,可以是安卓和 IOS 的原生组件,可以是近期很火热的小程序,也可以是各种 GUI。

在这里插入图片描述

可以通过vue ui一套图形化界面管理你的所有项目

在这里插入图片描述

Action 提交的是 mutation,而不是直接变更状态。
Action 可以包含任意异步操作。

在这里插入图片描述

使用watch handler属性有一个特点,就是当值第一次绑定时,watch不会执行监听函数,只有值发生改变时才会执行。
如果需要在最初绑定值的时候也执行函数,则就需要用到immediate属性,添加 immediate: true属性

在这里插入图片描述

vuex的五个属性:state、mutation、actions、getters, module

在这里插入图片描述

父子组件生命周期的执行顺序是父亲beforecreate、父亲created、父亲beforeMount、孩子beforecreate、孩子created、孩子beforeMount、孩子mounted、父亲mounted、父亲beforeDestroy、孩子beforeDestroy、孩子destroyed、父亲destroyed,孩子的mounted早于父亲mounted

在这里插入图片描述

Vue路由的跳转方式有route-link、this.$ router.push()、this.$ router.replace()、this.$ router.go()等,但是没有this.$router.jump()

在这里插入图片描述

React中组件的this并不是当前实例,需要通过bind或箭头函数来修改指向。
React 函数式组件中 this 为 undefined
React 类式组件中:
constructor 中的 this 指向组件实例
普通函数中的 this 指向 window,需要通过 bind 修改指向
箭头函数没有自己的 this,this 为创建时的上下文,即指向组件实例

在这里插入图片描述

老 VNode 节点的start和新VNode节点的end满足 sameVnode 时,这说明这次数据更新后oldStartVnode已经跑到了oldEndVnode后面去了,这时候在patchVnode后,还需要将当前真实dom节点移动到oldEndVnode的后面,同时老VNode节点开始索引加 1,新VNode节点的结束索引减 1。

在这里插入图片描述

路由导航守卫分为 3 种:全局路由守卫、路由独享的守卫、组件内的守卫
全局路由守卫:
全局前置守卫:beforeEach
全局解析守卫:beforeResolve
全局后置钩子:afterEach
路由独享的守卫:beforeEnter
组件内的守卫:
beforeRouteEnter
beforeRouteUpdate
beforeRouteLeave

在这里插入图片描述

Vue无法检测property的添加或移除。由于Vue会在初始化实例时对property执行getter/setter转化,所以property必须在data对象上存在才能让Vue将它转换为响应式的。

在这里插入图片描述

max属性控制最多可以缓存多少组件实例。一旦这个数字达到了,在新实例被创建之前,已缓存组件中最久没有被访问的实例会被销毁掉。

在这里插入图片描述

vue无法监听数组变化的情况
但是数组在下面两种情况下无法监听
利用索引直接设置数组项时,例如arr[indexofitem]=newValue
修改数组的长度时,例如arr.length=newLength

在这里插入图片描述

key属性不是必须的,但是不写kkey可能回报警告,有些内容可能显示异常。
key的作用:提高性能,不影响显示效果(如果没有id,可以使用index代替)

在这里插入图片描述

由于Vue实例没有执行DOM挂载,所以不会执行mounted钩子函数

在这里插入图片描述

Vue的特性有轻量级、双向数据绑定、组件化、数据驱动试图、指令、过滤器、路由、计算属性等。

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

菜菜的变强之路

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值