面试中积累

1.单页面spa开始加载html css js 路由机制实现跳转

6,data是一个函数,组件复用

7,v-model语法糖 基于value属性,input事件 props传值 this.$emit('input',xx)修改

8,组件通信:1,props $emit 2,ref $parent $children 3,eventBus ($emit /$on) 4,$attrs / $listenl 5,vueX

9,ssr加载方式,在服务器加载完毕,这样节省时间,首屏加载更快

优化首屏加载方法2,js文件按需加载,vue组件懒加载,方法3,js文件放在body后面4,使用csdn5,压缩代码

1,虚拟dom js对象模拟真实dom diff算法比较 pach算法差异

2,路由变化,页面数据不刷新 (watch 监听路由是否发生变化)

3,异步回调this指向问题(优化方法1,用其他变量储存this,防止发生改变,2,使用箭头函数)

4,setinterval计时器在路由跳转前销毁

8,判断数据类型,obeject.prototype.tostring.apply()

9,继承包含1,原型,2,构造函数3,混合继承4,拷贝继承5,实例化继承6,寄生混合继承

2,async和await
还有try和catch配合
async login () {
      this.loginLoading = true
      try {
        const res = await userLogin(this.user.mobile, this.user.code)
        this.$message({ message: '登陆成功', type: 'success' })
        this.loginLoading = false
        setUser(res.data.data)
        this.$router.push('/')
      } catch (err) {
        this.$message.error('登陆出错了')
        console.log(err)
        this.loginLoading = false
      } }
1,浏览器js事件循环机制
主线程任务执行完再执行微任务(promise),最后执行宏任务(setTimeout)
* 直接操纵dom性能消耗很大
* 为了简化dom操作,只操纵必须操纵的元素
* 就有了一个叫做虚拟dom的东西
  * 就是用js对象的方式去描述页面上的元素
* 数据更新之后,先更新`虚拟dom`,然后再去更新页面
  * 内存中的一个js对象
* * 数据改变之后,并不需要更新所有的元素
  * 到底更新哪一些呢?
  * `diff`算法的作用就是进行比较,计算出需要更新的最少的`dom`元素
  * 计算完毕之后,再去更新
  * 操纵了最少的dom元素
  * 性能的影响就最小了
1. webpack

2. 不就是打包器吗

3. 默认打包js

4. 通过loader解析其他文件

5. 有了`vue-loader`就可以解析`.vue`了

6. 但是现在不都是脚手架了,就很少`自己配`了

7. 现在基本都是项目打包时,稍作调整`vue.config.js`

1,移动端https://www.cnblogs.com/PeunZhang/p/3407453.html

1.es6新语法，css3新特性，promise，遍历数组和里面的参数

1.掌握Vue全家桶应用及相关插件，如：Vue-Router，Vuex等，熟悉MVVM模型原理。

3、熟练使用Git进行项目管理、版本控制，熟悉svn。

4、掌握常见跨域解决方案，如CORS，JSONP，正向代理，反向代理。

5、掌握js面向对象原理，如：原型、闭包等。

6、熟练使用axios的使用技术。

7、熟练使用Stylus/ Sass /Less CSS预处理编译工具。

8、熟悉 ECMAScript5 及 ECMAScript6 使用规范，掌握其新特性和用法，如：promise。

9、掌握多种经典布局方案，如：flex布局，响应式布局。

10、熟练使用html、css、js等网页制作技术，进行页面架构和布局。

11、熟悉HTTP协议，cookie，session等。

12、熟悉常见ui组件库element-ui/Vant。

13、掌握jQuery并能独立进行工具函数封装。

15、熟悉NodeJS使用，熟练使用Express框架快速搭建服务器以及MockJS模拟数据。

16、熟悉移动端开发

17、掌握webpack基本使用和优化方案。

18、掌握Echarts等数据可视化库。

说说CSS居中的几种方式？（垂直和水平都可以）

说说动画？(CSS、JS、其他都可以)

怎么用JS让一个盒子移动左100px？

1. 说说CSS选择器有哪些？
2. 说说flex是什么？有哪些属性？每个属性怎么使用？什么效果？（让你讲讲弹性布局）
3. 谈谈移动端？（我从移动端的几种布局开始说，然后每个介绍一下就差不多了）
4. 移动端总结:一个可以刷题,可以看文章,展示文章列表,可以在文章详情页发表评论可以对评论回复,对文章点赞,收藏,分享,可以搜索文章,公司列表模块,可以搜索公司可以根据距离,评分倒序,正序筛选文章,可以刷题,答完题后分别展示三种选项样式,选中的错选项,未选中的对选项,和未选中的错选项,答完进入下一题,也可以跳题,跳题展示三种样式答对答错,未答,已答不可以再进入选择,也可以对试题进行收藏,个人信息地区选择引入area地区选择文件,本地localstorage中存储,token和用户搜索文章历史使用json格式,调转的每个页面的路由元里放needlogin的标识,路由前置守卫判断是否有,如果没有用户可正常登陆,没有需要登录,判断localstorage是否有token,如果没有代表没登录用用户去登录页,地址拼接一个?_redirect参数加要去的地址方便登录完可以再回此页面,如果有再判断vuex的state里是否有用户信息一般都没有因为刷新vuex保存的用户信息会重置,没有调用获取用户信息api请求引入store再设置到vuex中通过store.commit(vuex的mutations的方法名,值为请求的数据),不然不规范而且不会被devtools监听到,vant组件的@submit方法提交数据会自动验证加了rules规则的表单元素,vant中的插槽需要会用template标签包裹住标签内用#标记插槽使用范围,iconfont字体图标可以去官网选择选择后查看源代码,复制到一个css文件内.app.vue最大的子组件文件import导入全局即可使用,axios的公用文件一般用请求拦截判断是否需要登录需要needtoken,相应拦截判断响应的状态码,特殊状态码需要处理,router文件路由配置一般放权限的标记是否需要登录之类的

购物车部分，首先购物车的需求 单选、全选和取消，而且会随着选中的商品计算出总价，还有就是单个商品购买数量的增加和减少，以及删除商品，当商品为空时，页面会变成空购物车的布局静态页面，使用flex布局，首先是一个商品列表，列表里的单品需要商品图，商品名，单价，数量，是否选中，商品id然后左下角的全选，需要一个字段表示是否全选了右下角的总价最后需要知道购物车是否为空首先我们要把购物车的列表数据作为一个数组，用户挑选后在提交数据的同时调用接口将数据添加到localStorage，然后从服务器拿到物品数据data，渲染物品的信息，我们需要给每个物品数据中加入一个是否选中的属性，所以先需要遍历数组，选中和取消选中单个物品，选中或未选中物品时，总数要进行加减，每次触发这个事件，都会触发计算总价的方法，全选按钮，实现物品的全选，当用户通过单选选择了所有物品是，“全选按钮”会自动改变未选中样式，当用户通过全选按钮选择所有商品时候，每个商品都应该是选中状态，然后在触发计算总价，触发该函数，重新计算价格，将总价变为0，在进行选中项的价格累加。

1. Pc/移动端适配,原理,
2. Promise.all(),race()
3. Express起服务

新建文件夹demo

Vscode打开文件,执行初始化 npm init -y

npm i express –save

创建app.js 写入

// 导入 express 模块

const express = require('express')

// 创建 express 的服务器实例

const app = express()

// 托管静态资源

app.use(express.static('./dist'))

// 调用 app.listen 方法，指定端口号并启动 web 服务器

const port = 8080

app.listen(port, function () {

  console.log('Express server running at http://127.0.0.1:' + port)

})

将打包的dist放入demo文件里

终端执行 node app.js 就可以打开项目