小白学习vuejs-02了安装Vue.js, 与es6基本语法

126 阅读2分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第2天,点击查看活动详情

自学前端

  • 前文
    • 本文是我自学vue的一些知识以及个人理解, 希望帮助到一些想要学习前端的小白朋友
    • 介绍本次学习的是vue的下载安装

安装方式

  • 使用一个框架, 我们第一步要做什么能?安装下载它
  • 安装Vue的方式有很多:
  • 方式一: 直接CDN引入
    • 你可以选择引入开发环境版本还是生产环境版本
    • <!--开发环境版本, 包含了有帮助的命令行警告-->
      <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
      <!--生产环境版本, 优化了尺寸和速度-->
      <script src="https://cdn.jsdelivr.net/npm/vue"></script>
      
  • 方式二:下载和引入
  • 方式三: NPM安装
    • 后续通过webpack和CLI的使用, 我们使用该方式

安装

  1. 打开官方网站

    cn.vuejs.org/index.html

  2. 点击安装, 安装开发版本
  3. 下载下来通过script表签直接引入

ES6基本语法

let/var

  • 事实上var的设计可以看成javaScript语言设计上的错误, 但是这种错误多半不能修复和移除, 为需要向后兼容
    • 大概十几年前你Brendan Eich就决定修复这个问题, 于是他添加了一个新的关键字: let
    • 我们可以将let看成更完美的var
  • 块级作用域
    • JS中使用var来声明一个变量时, 变量的作用域主要是和函数的定义有关
    • 针对与其他块的定义来说是没有作用域的, 比如if/for等, 这在我们开发中往往会引起一些问题
  • ES5之前应为if和for都没有块级作用域的概念, 所以在很多时候, 我们都必须借助于function的作用域来解决应用在外面的变量的问题
  • ES6中, 加入了let, let它是由if和for的块级作用域

const关键字

  • const
    • 在很多语言中已经存在, 比如C/C++中, 主 要的作用是将某个变量修饰为常量
    • 在javaScrip中也是如此, 使用const修饰的标识符为常量, 不可以再次赋值
  • 在什么时候使用const呢?
    • 当我们修饰的标识符不会被再次赋值时, 就可以使用const来保证数据的安全性
  • 建议: 在ES6开发中, 优先使用const, 只有需要改变某一个标识符的时候才使用let
  • const的注意
    • 注意一:
    • const a = 20;

      a = 30; //错误: const修饰的标识符必须赋值

    • const注意二:

      const name; //错误: const修饰的标识符必须赋值.

后记

  • 希望对对前端有兴趣的朋友们有帮助
  • 后面的教学将会讲到vue的语法
  • vue的作者是中国人尤雨溪, 非常厉害的人