【面经——广州道一云+笔试+一二三面+HR面+offer】

面试相关 专栏收录该内容
11 篇文章 0 订阅

道一云

你可能不太敢相信,线下面的,笔试+一二三面+HR面 在一天下午就整完了,一二三面分别换了3位面试官,中间大概隔了10多分钟,第二天就拿offer了,效率可以。

vue

vue的生命周期

创建一个vue实例
初始化事件和生命周期 => beforeCreate,此时是没有数据的
通过依赖注入和导入依赖项,此时data和methods已经被初始化了,就进入created

检查是否具有el,如果没有的话就需要的话就需要手动的调用vm.$mounted
如果有的话就要检查是否具有template,有的话直接编译进渲染函数,没有的话就编译外部html代码为模板代码


beforeMounted 此时模板已经在内存中编译好了,但是还没挂载到页面上
接着就要将内存中编译好的代码挂载浏览器页面上
mounted表示整个vue已经初始化完成


当数据发生变化就会调用vm.$update(),就进入了beforeUpdate,但是此时还是原来的数据
接着根据虚拟dom重新渲染和替换已经改变的数据
updated数据同步更新完成


当需要删除就调用vm.$destroy(),进入beforeDestory
解除父子组件绑定,销毁子组件以及事件监听器
销毁完毕之后就进入destroyed 实例已经完全销毁

vue 父子组件传参方式

v-for 中key的作用

给每一个vnode绑定一个唯一的id,可以依靠key更准确、更快速的拿到原来节点对应的虚拟节点。总结就是能够更快速的更新虚拟dom。
中间涉及一个diff算法,同一层次从上往下去寻找不一样的节点,然后进行替换

v-if 和v-show,以及应用场景

  1. 手段:v-if是动态的向DOM树内添加或者删除DOM元素;v-show是通过设置display样式属性控制显隐
  2. 编译过程:v-if局部编译和卸载过程,销毁和重建内部的监听和子组件;v-show只是简单的基于css的变换;
  3. 性能消耗:v-if更高切换消耗;v-show更高渲染消耗
  4. 应用场景:v-if 运营条件不太可能改变,v-show频繁切换

loader和plugin区别?常见的loader和plugin

loader文件加载器,并对资源文件进行编译、压缩等处理,最终打包到指定文件中;loader的执行顺序是相反的。
plugin功能的扩展,不仅局限打包和资源加载,功能强大到可以处理各种各样的任务,作用于整个生命周期。plugin顺序执行。

css 图片 babel-loader ; banner-plugin、HtmlWebpackPlugin、HotModuleReplacementPlugin(热更新)

template和JSX

template vue静态模板方式,通过渲染函数解析成虚拟dom
JSX react动态编译的方式,只要能通过代码编辑的都可以在这里实现

vue组件通信方式

  • props / $emit 适用父子组件通信
  • ref 与 $parent / $chilren $root 适用父子组件通信
  • EventBus使用于父子、隔代、兄弟组件通信
  • $attrs / $listeners
  • provide / inject 适用于 隔代组件通信
  • slot插槽方式
  • .sync修饰符

vue路由模式

hash history anstract

vuex

专门为vue开发的状态管理模式,每一个vuex的应用核心就是store,相当于一个容器。
主要是有以下几个模块:

  • State: 定义了应用状态的数据结构,可以在这里设置默认的初始状态
  • Getter: 允许组件从Stroe 中获取数据
  • Mutation: 唯一更改store 中状态的方法,且必须是同步函数。
  • Action: 用于提交muatation , 而不是直接变更状态,可以包含任意异步操作
  • Module: 允许将单一的store 拆分为多个 sotre 且同时保存在单一的状态树

我们来聊一下MVVM?优点

Model、view、viewModel
Model[代表数据,数据模型,业务逻辑]
view 用来做数据的展示
ViewModel[监听model的变化,控制视图层数据的更新,处理用户的交互]


view 和 model 之间没有直接联系,是通过viewModel作为中间层来联系的
当model变更时,viewModel,会通知view做改变。
当view变更时,有了viewModel,model也会相应的进行同步!

优点:低耦合度、可重用性、独立开发、可测试

组件的data为什么必须要是函数

使用data()可以维护一份被返回对象的独立拷贝,每个组件的数据都输独立的。如果只是使用data的话,任意一个组件导致变量数值的改变所有的组件都会同步更新

对webpack的理解

简单来说,就是代码打包工具。

  1. 它可以处理不同模块之间的不同的复杂依赖
  2. 做代码打包的相关优化
  • 与grunt/gulp的区别
    1. 旧、核心为任务,webpack基于文件
    2. 现在进行简单的打包,例如ES6/TS转化,图片压缩,scss转css
    3. 前端自动化工具,不像webpack更加注重的是模块化

html

运算符分类

  1. 位运算符 | & ^ ~ >> <<
  2. 数学运算符 + - * / % ++ – **
  3. 赋值运算符 = -= += /= %= *=
  4. 比较运算符 > < = <= >= === == != !==
  5. 逻辑运算符 && || !
  6. 自加自减运算符 ++ –
  7. 三元运算符 === ? :

css

  1. 行内元素和块元素
    行内元素:img input label a
    块元素: div p h1 ol li

js

去重方式

计算机网络

各种状态码

项目

与后端人员的交互,负责的部分

git

git init 初始化版本库
git add 添加到版本库
git commit -m “注释” 把它提交到版本库
git status 查看修改结果
git diff 查看具体修改内容
git log 查看日志
git reset --hard HEAD^ 版本回退上一个版本
git clone 克隆
git push origin master 提交到远程主分支
git checkout -b dev创建并切换
git merge 合并分支
git branch -d dev 删除分支
git switch -c 创建并切换

杂谈

  1. 软件工程后端为什么转前端?
    以前玩视频和平面设计,不喜欢各种数据处理,前端所见即所得,提高学习兴趣

  2. 以后的职业规划?
    5年内都会坚持前端开发,5年后会重新思考自己再确定是否创业

  3. 会不会与舍友起冲突?
    不会,随和

  4. 大学期间最大挑战或难题?

实习薪资

反问

学习建议(学习过程注意底层知识积累,不只是停留在会用,多看技术文档)
上班时间(朝九晚六 可能加班)

  • 0
    点赞
  • 3
    评论
  • 8
    收藏
  • 打赏
    打赏
  • 扫一扫,分享海报

评论 3 您还未登录,请先 登录 后发表或查看评论
©️2022 CSDN 皮肤主题:游动-白 设计师:我叫白小胖 返回首页

打赏作者

realcoderpig

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

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

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

打赏作者

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

抵扣说明:

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

余额充值