前端的初学习 -- 第十三章 -- ES6环境部署

博客说明

文章内容输出来源：拉勾教育Java就业急训营

什么是ES6

ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。 它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言

ECMAScript 和 JavaScript 的关系

• 要讲清楚这个问题，需要回顾历史。
• 1996 年 11 月，JavaScript 的创造者 Netscape 公司，决定将 JavaScript 提交给标准化组织 ECMA，希望这种语言能够成为国际标准
• ECMA 发布 262 号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语 言称为 ECMAScript，这个版本就是 1.0 版。
• 因此，ECMAScript （宪法）和 JavaScript（律师） 的关系是，前者是后者的规格，后者是前者的 一种实现

ES6 与 ECMAScript 2015 的关系

• 2011 年，ECMAScript 5.1 版发布后，就开始制定 6.0 版了。因此，ES6 这个词的原意，就是指 JavaScript 语言的下一个版本。
• ES6 既是一个历史名词，也是一个泛指，含义是 5.1 版以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017 等等

配置环境

Node环境

什么是Node环境

简单的说 Node.js 就是运行在服务端的 JavaScript。
JavaScript程序，必须要依赖浏览器才能运行！没有浏览器怎么办？OK，Node.js帮你解决
Node.js是脱离浏览器环境运行的JavaScript程序，基于Google的V8引擎，V8引擎执行Javascript的速度 非常快，性能非常好。

Node.js有什么用

如果你是前端程序员，你不懂得像PHP、Python或Ruby等动态编程语言，然后你想创建自己的服务， 那Node.js是一个非常好的选择。
Node.js 是运行在服务端的 JavaScript，如果你熟悉Javascript，那么你将会很容易的学会Node.js。 当然，如果你是后端程序员，想部署一些高性能的服务，那么学习Node.js也是一个非常好的选择。

安装

官网：https://nodejs.org/en/
中文网：http://nodejs.cn/
LTS：长期支持版本
Current：最新版
安装：Windows下双击点击安装——>Next——>finish
注意：

• node-v14.5.0-x64.msi 最新版本，如果是win7系统的话，可能安装不了。
• 如果是win7系统，安装node-v10.14.2-x64.msi这个版本

查看版本

在dos窗口中执行命令查看版本号：node -v

第一次使用node.js

1. 创建文件夹 node，其目录下创建 hello.js
   
2. 在hello.js 中输出hello,node.js！

console.log("hello,nodejs");

3. 运行：命令行终端中运行
   右键node文件夹，选中在集成终端中打开
   
4. 输入命令
   node hello.js
   第一次运行，可能会报错！
   
   兼容性的问题，让vscode以管理员身份运行即可

在集成终端中输入cls可清屏

服务器端应用开发（了解）

1. 创建node-server.js

const http = require("http"); // node中自带的require引入方法，http也是node中自带的服 务对象

http.createServer(function (request, response) {    // 发出http请求的头部信息
    // http的状态码：200；OK
    // 请求的内容类型：text/plain
    response.writeHead(200, { "Content-Type": "text/plain" });

    //响应的数据     "hello,welcome！" ,此时，并不支持中文（以后一定会解决！）    
    response.end("hello,welcome!");
}).listen(8888); // 监听端口

console.log("服务器已启动，请访问     http://127.0.0.1:8888");

2. 运行node-server.js
3. 服务器启动成功后，在浏览器中输入：http://127.0.0.1:8888 查看webserver成功运行，并输出hello,welcome!
4. 停止服务：ctrl + c

NPM环境

什么是NPM环境

• NPM全称Node Package Manager，是Node.js包管理工具
• 是全球最大的模块生态系统，里面所有的模块都是开源免费的，也是Node.js的包管理工具，相当于前 端的Maven
• 如果一个项目需要引用很多第三方的js文件，比如地图，报表等，文件杂而乱，自己去网上下载，到处 是广告和病毒
• 那么，我们就想办法，把这些js文件统一放在一个仓库里，大家谁需要，谁就去仓库中拿过来，方便多 了
• npm就是这个仓库系统，如果你需要某个js文件，那就去远程仓库中下载，放在本地磁盘中，进而引用 到我们的项目中

NPM工具的安装位置

• node的环境在安装的过程中，npm工具就已经安装好了。
• Node.js默认安装的npm包和工具的位置：Node.js目录\node_modules
• 在这个目录下你可以看见 npm目录，npm本身就是被NPM包管理器管理的一个工具，说明 Node.js已 经集成了npm工具

#在命令提示符输入 npm -v 可查看当前npm版本
npm -v

使用NPM管理项目

项目初始化

全新创建一个目录，作为项目目录，使用dos命令进入此目录，输入命令

# 如果不想输入下面这些东西，就按照默认初始化
npm init -y

npm init
# 接下来是一堆项目信息等待着你输入，如果使用默认值或你不知道怎么填写，则直接回车即可。 
# package name:  你的项目名字
# version: 版本号
# description: 对项目的描述
# entry point: 项目的入口文件（一般你要用那个js文件作为node服务，就填写那个文件）
# test command: 项目启动的时候要用什么命令来执行脚本文件（默认为node app.js）
# git repository: 如果你要将项目上传到git中的话，那么就需要填写git的仓库地址（这里就不写地址了）
# keywirds：项目关键字（我也不知道有啥用，所以我就不写了） 
# author: 作者的名字
# license: 发行项目需要的证书（这里也就自己玩玩，就不写了）

最后会生成package.json文件，这个是包的配置文件，相当于maven的pom.xml 我们之后也可以根据需要进行修改。
上述初始化一个项目也太麻烦了，要那么多输入和回车。想简单点，一切都按照默认值初始化即可， ok，安排

修改npm镜像 和 存储地址

NPM官方的管理的包都是从 http://npmjs.com下载的，但是这个网站在国内速度很慢。
这里推荐使用淘宝 NPM 镜像 http://npm.taobao.org/ ，淘宝 NPM 镜像是一个完整npmjs.com 镜 像，同步频率目前为 10分钟一次，以保证尽量与官方服务同步。

# 设置镜像和存储地址：
# 经过下面的配置，以后所有的npm install 都会经过淘宝的镜像地址下载 
npm config set registry https://registry.npm.taobao.org

# 设置npm下载包时保存在本地的地址（建议英文目录） 
npm config set prefix "H:\\repo_npm"

# 查看npm配置信息
npm config list

npm install命令的使用

#使用 npm install 安装依赖包的最新版 模块安装的位置：项目目录\node_modules
#安装会自动在项目目录下添加 package-lock.json文件，这个文件帮助锁定安装包的版本
#同时package.json 文件中，依赖包会被添加到dependencies节点下，类似maven中的 <dependencies>

#下载最新版
npm install jquery

#下载指定版本
npm install jquery@1.9.1