Vue的安装及使用快速入门，JavaScript命名标识符规范

用户33914928060
18 阅读8分钟

总结一下

面试前要精心做好准备，简历上写的知识点和原理都需要准备好，项目上多想想难点和亮点，这是面试时能和别人不一样的地方。

还有就是表现出自己的谦虚好学，以及对于未来持续进阶的规划，企业招人更偏爱稳定的人。

万事开头难，但是程序员这一条路坚持几年后发展空间还是非常大的，一切重在坚持。

为了帮助大家更好更高效的准备面试，特别整理了《前端工程师面试手册》电子稿文件。

前端面试题汇总

JavaScript

性能

linux

前端资料汇总

前端工程师岗位缺口一直很大，符合岗位要求的人越来越少，所以学习前端的小伙伴要注意了，一定要把技能学到扎实，做有含金量的项目，这样在找工作的时候无论遇到什么情况，问题都不会大。

开源分享：docs.qq.com/doc/DSmRnRG…

2、进入你的项目目录，创建一个基于 webpack 模板的新项目

在这里插入图片描述

说明：

Vue build ==> 打包方式，回车即可；

Install vue-router ==> 是否要安装 vue-router，项目中肯定要使用到 所以Y 回车；

Use ESLint to lint your code ==> 是否需要 js 语法检测 目前我们不需要 所以 n 回车；

Set up unit tests ==> 是否安装 单元测试工具 目前我们不需要 所以 n 回车；

Setup e2e tests with Nightwatch ==> 是否需要 端到端测试工具 目前我们不需要 所以 n 回车；

3、进入项目：cd vue-demo，安装依赖

在这里插入图片描述

安装成功后，项目文件夹中会多出一个目录：　node_modules

在这里插入图片描述

4、npm run dev，启动项目

项目启动成功：

在这里插入图片描述

在这里插入图片描述

5、结束项目运行：

ctrl+c，选择Y即可停止项目的运行

Ps：在磁盘目录下按Shift+右键可以直接打开命令框

我的命令流程

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

三、vue项目目录讲解

=========================================================================

在这里插入图片描述

1、build：构建脚本目录

1）build.js ==> 生产环境构建脚本；

2）check-versions.js ==> 检查npm，node.js版本；

3）utils.js ==> 构建相关工具方法；

4）vue-loader.conf.js ==> 配置了css加载器以及编译css之后自动添加前缀；

5）webpack.base.conf.js ==> webpack基本配置；

6）webpack.dev.conf.js ==> webpack开发环境配置；

7）webpack.prod.conf.js ==> webpack生产环境配置；

2、config：项目配置

1）dev.env.js ==> 开发环境变量；

2）index.js ==> 项目配置文件；

3）prod.env.js ==> 生产环境变量；

3、node_modules：npm 加载的项目依赖模块

4、src：这里是我们要开发的目录，基本上要做的事情都在这个目录里。里面包含了几个目录及文件：

1）assets：资源目录，放置一些图片或者公共js、公共css。这里的资源会被webpack构建；

2）components：组件目录，我们写的组件就放在这个目录里面；

3）router：前端路由，我们需要配置的路由路径写在index.js里面；

4）App.vue：根组件；

5）main.js：入口js文件；

5、static：静态资源目录，如图片、字体等。不会被webpack构建

6、index.html：首页入口文件，可以添加一些 meta 信息等

7、package.json：npm包配置文件，定义了项目的npm脚本，依赖包等信息

8、README.md：项目的说明文档，markdown 格式

9、.xxxx文件：这些是一些配置文件，包括语法配置，git配置等

四、开始我们的第一个vue项目

=============================================================================

1、在components目录下新建一个views目录，里面写我们的vue组件

1）开始我们的第一个组件：

a：在views目录下新建First.vue

b：在router目录下的index.js里面配置路由路径

在这里插入图片描述

c：template 写 html，script写 js，style写样式

在这里插入图片描述

d：输入ip： http://localhost:8010/#/first，查看页面效果

在这里插入图片描述

注意：

一个组件下只能有一个并列的 div，以下写法是错误：

在这里插入图片描述

数据要写在 return 里面，而不是像文档那样子写，以下写法错误：

在这里插入图片描述

2、讲讲父子组件

1）在components目录下新建sub文件夹，用于存放一下可以复用的子组件。比如新建一个Confirm.vue组件

在这里插入图片描述

3）在父组件中引入子组件

引入：import Confirm from ‘…/sub/Confirm’

注册：在标签内的 name代码块后面加上 components: {Confirm}

使用：在内加上

完整代码：

在这里插入图片描述

2）父子组件通信

子组件：

在这里插入图片描述

父组件：

在这里插入图片描述

3、使用路由搭建单页应用

1）按照以上方法，新建一个Second.vue组件

2）路由跳转：去第二个页面

在这里插入图片描述

路由跳转之后，注意观察路径变化：

在这里插入图片描述

可以看到，在html中解析成了a标签

在这里插入图片描述

这里只是简单的介绍了一下路由的使用，更多详细信息，请前往官网学习：router.vuejs.org/zh-cn/

4、如何用less写样式

1）安装less依赖：npm install less less-loader --save

在这里插入图片描述

安装成功之后，可在package.json中看到，多增加了2个模块：

JavaScript

  • js的基本类型有哪些？引用类型有哪些？null和undefined的区别。

  • 如何判断一个变量是Array类型？如何判断一个变量是Number类型？（都不止一种）

  • Object是引用类型嘛？引用类型和基本类型有什么区别？哪个是存在堆哪一个是存在栈上面的？

  • JS常见的dom操作api

  • 解释一下事件冒泡和事件捕获

  • 事件委托（手写例子），事件冒泡和捕获，如何阻止冒泡？如何组织默认事件？

  • 对闭包的理解？什么时候构成闭包？闭包的实现方法？闭包的优缺点？

  • this有哪些使用场景？跟C,Java中的this有什么区别？如何改变this的值？

  • call，apply，bind

  • 显示原型和隐式原型，手绘原型链，原型链是什么？为什么要有原型链

  • 创建对象的多种方式

  • 实现继承的多种方式和优缺点

  • new 一个对象具体做了什么

  • 手写Ajax，XMLHttpRequest

  • 变量提升

  • 举例说明一个匿名函数的典型用例

  • 指出JS的宿主对象和原生对象的区别，为什么扩展JS内置对象不是好的做法？有哪些内置对象和内置函数？

  • attribute和property的区别

  • document load和document DOMContentLoaded两个事件的区别

  • JS代码调试

  • 开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

avatar
文章
阅读
粉丝