Ext JS学习第十六天 事件机制event（一）
此文用来记录学习笔记；css
休息了好几天，从今天开始继续保持更新，鞭策本身学习html
今天咱们来讲一说什么是事件,对于事件，相信你必定不陌生，前端
基本事件是什么？就相似于click、keypress、focus、mouseover等这些事件都是浏览器定义好的内置事件，咱们直接使用便可。对于高级事件，无非就是本身去设计一个事件，就好比咱们实际项目中，一般都伴随些业务逻辑，多是曾删改查等...这些事件都是非原生事件，也就是浏览器没法自行判别触发的。可是咱们确实有需求去实现他们，从而让咱们开发起来更爽一些。java
首先咱们来看事件的几种绑定方式：node
第一种html方式：很简单直接给出代码jquery
<body> <input type="button" id="btn1" value="第一种事件绑定方式" onClick="hello()"> </body>
第二种绑定方式：dom方式git
首先咱们先构造几个按钮程序员
<body> <input type="button" id="btn1" value="第一种事件绑定方式" onClick="hello()"><br> <input type="button" id="btn2" value="第二种事件绑定方式"><br> <input type="button" id="btn3" value="第三种事件绑定方式"><br> <input type="button" id="btn4" value="单击我吧"><br> <input type="button" id="btn5" value="按钮5"> </body>
好了，开始第二种绑定方式，看栗子github
(function(){
Ext.onReady(function(){
if(Ext.isIE){
document.getElementById("btn2").attachEvent("onclick",function(){
alert("第二种事件绑定方式");
});
}else{
document.getElementById("btn2").addEventListener("click",function(){
alert("第二种事件绑定方式");
});
}
})
})();
第三种绑定方式：Ext方式web
(function(){
Ext.onReady(function(){
Ext.get('btn3').on("click",function(){
alert("第三种事件绑定方式");
})
})
})();
明天咱们继续学习如何自定义事件进行触发
我的 网站 www.fishcmonkey.com
DotNet进阶系列(持续更新)
一. 回顾历史
回顾我的发展历程，自2012年初次接触开发至今(2018年)已经有六个年头，这期间陆陆续续学习并掌握了很多技术，C#语言、ORM框架、多线程技术、设计模式、前端技术、MVC、MVVM框架思想等等，每种技术随着屡次使用，随着不断的反思，逐渐经历 “了解→理解→掌握→精通 ”这么一个过程，从最初的只能实现功能到现在的“每一步都考虑性能优化问题”，在近两年内，开始写博客，最初只是一时兴起，想让百度上能搜索出个人文章，但如今已经造成一个习惯，在没有特殊事情耽搁的状况下，坚持一周两篇博客，到目前为止，有效文章数已经达到140多篇，固然后面还会陆续写下去。
做为理科生出身的我，没有华丽的辞藻 ，没有煽情篇章，话很少说，回顾完我的开发历程，下面看一下C#和.Net的发展历程，再次补充一点，.Net不是一门开发语言，而C#才是基于.Net运行环境下的一种高级开发语言。
从上面的表格能够看出来，C#这么语言至今已经接近20年历史了，从2002年诞生的那一刻起，不断更新，不断改进，功能愈来愈强大，愈来愈方便程序们的开发，固然.NET类库、CLR、以及开发神器Visual Studio也在不端更新。（VS 2017 宇宙第一开发神器 这个应该毫无争议吧）
以前曾说过，C#仅仅是.Net下的一门开发语言而已，.Net生态远远不止如此。
咱们之前提到.Net，指的都是.Net FrameWork，常常被java程序员嘲笑，.Net不能跨平台，但如今不会来，他们能够闭嘴了，.Net Core就是为跨平台而生，下面简单总结一下.Net生态。
(1) 语言有：C# 、F#、VB
(2) C/S程序开发技术有：WinForm、WPF
(3) B/S程序开发技术有：ASP.Net WebForm 、ASP.Net MVC、Core MVC
(4) 通信技术有：WebAPI、WCF、SignalR
(5) 日志框架有：Log4Net
(6) 数据库访问技术有：ADO.NET 、EF
这里再也不继续列举了，也没有必要再列举了，由于对于新时代合格的工程师而言，没有人限制你只能掌握一种技术，任何一个大型的信息系统，都是有多种技术组合而来，在如今一个大一统的时代，连.Net的生身父母“微软”都开源了，难道小小的你还能故步自封吗？
二. 扫盲C#运行原理
C#做为一门高级语言，机器是不认识的，那么它是怎么编译成让机器码让机器识别呢，一张图胜似千言万语，请看下图。
概念补充：
CTS：C#、F#、VB都必须遵照的通用类型
CLS：通用语言规范（CLS是CTS的一个子集）
BCL：基础类库
总结：C#是一种面向对象的高级编程语言，符合CLR中的CLS(通用语言规范)
.Net Framework包含三部分：
1 CLR
2 编程工具
3 BCL(基类库)
三. 基础进阶系列及章节详细介绍
最近一直在考虑初学者学习.Net应该从哪学起，上面说的天花乱坠，有什么用呢？ 若是连.Net最基础的知识都掌握不了，还谈什么开发呢？
这里结合我本身的理解，整理出一条较为合适的路线，并对以前的博客从新排版从新改写，造成这个【DotNet进阶篇】系列，一方面方便本身往后复习，另外一方面也为.Net社区尽一点绵薄之力。
第一节：从面向对象思想(oo)开发、接口、抽象类以及两者比较
第二节：重写（new）、覆写（overwrite）、和重载（overload）
第三节：深度剖析各种数据结构(Array、List、Queue、Stack)及线程安全问题和yeild关键字
第五节：泛型(泛型类、接口、方法、委托、泛型约束、泛型缓存、逆变和协变)
第七节：语法总结(1)(自动属性、out参数、对象初始化器、var和dynamic等)
第九节：委托和事件(1)(委托的发展历史、插件式编程、多播委托)
第十节：委托和事件(2)(泛型委托、Func和Action、事件及与委托的比较)
第十一节：特性(常见的特性标签、自定义特性、特性的使用案例)
第十五节：Expression表达式目录树(与委托的区别、自行拼接、总结几类实例间的拷贝)
第十七节：易混淆的概念(静态和非静态、拆箱和装箱、值传递和引用传递、深拷贝和浅拷贝)(持续更新)
第二十二节：XXXXXXXXXXXXXXXXXXXXXXXX
第二十三节：XXXXXXXXXXXXXXXXXXXXXXXX
第一节：.Net版基于WebSocket的聊天室样例
一. 说在前面的话
该篇文章为实时通信系列的第一节，基于WebSocket编写了一个简易版聊天样例，主要做用是为引出后面SignalR系列的用法及其强大方便之处，经过这个样例与后续的SignalR对比，能够体会到用原生的WebSocket编程的不灵活以及繁琐之处。（PS：下面那个案例 编写+调试 用了大约2个小时的时间）
特别强调：该案例只是一个简易版的Demo，实现了一些基本的功能，起到一个基本入门的做用，在一些细节方面的限制、验证、以及关键信息的存放位置是有必定缺陷的，在实际项目中，须要根据实际状况进行调整。
后面打算以一个真实的微信项目为例【二人夺宝】以下图，介绍里面须要用到的实时通信技术，即SignalR在里面起到的做用，你会发现若是业务复杂，若是采用原生的WebSocket进行编程，“你能累死”，或者说有些功能很难实现。
最后以一个真实的App混合开发项目【红猴代派】以下图，介绍用SignalR替代推送技术的实现。
ps：鉴于保密协议，以上提到的两个项目名称并不是最终上线的真实名称。
二. WebSocket简介
WebSocket能够经过JS与服务器端创建实时的双向通讯，它主要包括：2个核心方法、4个监听函数、1个核心属性。
2个核心方法：
① send() 向远程服务器发送信息
② close() 关闭与远程服务器的链接
4个监听函数：
① onopen 当网络链接创建成功时触发该事件
② onerror 当网络发生错误时触发该事件
③ onclose 当网络链接被关闭时触发该事件
④ onmessage 当websocket接收到服务器发来的消息的时触发该事件
1个核心属性：readyState，它有四种状态
① WebSocket.OPEN：表示与服务器已经创建好链接
② WebSocket.CLOSED：表示与服务器链接已经断开
③ WebSocket.CONNECTING：表示正在尝试与服务创建链接
④ WebSocket.CLOSING：表示正在关闭与服务器链接
服务器端主要用到两个方法：
① SendAsync() 发送信息给客户端
② CloseAsync() 关闭该Socket链接
三. 聊天室实现的功能
1. 经过输入登陆标记，进行创建链接，会提示当前全部在线的人(包括本身)，登陆成功。（Ps：同一个标记不能重复登陆）
2. 点击关闭链接，断开当前链接，提示除了本身之外的全部人，“某某离开了”。
3. 群发功能：给全部在线的人（本身除外）的发送消息。
4. 单发功能：点对点发送消息。（须要输入内容和接收人的标识）
四. 代码分享
代码主要分为3部分组成：前端html页面、服务器端ashx通常处理程序、封装的消息发送帮助类。
前端页面代码：
1 @{
2 Layout = null;
3 }
4
5 <!DOCTYPE html>
6
7 <html>
8 <head>
9 <meta name="viewport" content="width=device-width" />
10 <title>Index</title>
11 <script src="~/Scripts/jquery-3.3.1.min.js"></script>
12 <script>
13
14 //封装WebSocket的相关方法
15 (function (w) {
16 //声明全局对象
17 var ws; //websocket对象
18 var url = "ws://localhost:9008/webSocketHandler.ashx"; //链接地址
19 var mainUitls = {
20 //1.初始化基本事件
21 init: function () {
22 this.initClick();
23 },
24 //2.创建通信事件
25 initConnect: function () {
26 var newUrl = url + "?userKey=" + $("#j_userKey").val();
27 ws = new WebSocket(newUrl);
28 //2.1 网络创建链接的时候触发该事件
29 ws.onopen = function () {
30 $('#j_notice').html('已经链接');
31 }
32 //2.2 接受服务器发来消息时触发事件
33 ws.onmessage = function (evt) {
34 $("#j_Msg").append("<li>" + evt.data + "</li>");
35 }
36 //2.3 网络错误时候触发
37 ws.onerror = function (evt) {
38 $('#j_notice').html(JSON.stringify(evt));
39 }
40 //2.4 当链接关闭的时候触发该事件
41 ws.onclose = function () {
42 //这里根据实际场景来编写 (好比断线重连机制)
43 //该版本只是简单的给个提示
44 $('#j_notice').html("链接断开");
45 }
46 },
47 //3. 各类点击事件
48 initClick: function () {
49 //3.1 创建链接
50 $("#j_connect").on("click", function () {
51 if ($("#j_userKey").val()=="") {
52 $('#j_notice').html("请输入用户标记");
53 return;
54 }
55 mainUitls.initConnect();
56 });
57 //3.2 关闭链接
58 $("#j_close").on("click", function () {
59 ws.close();
60 });
61 //3.3 群发发送消息
62 $("#j_send").on("click", function () {
63 //表示与服务器已经创建好链接
64 if (ws.readyState == WebSocket.OPEN) {
65 ws.send($('#j_content').val());
66 }
67 //表示与服务器链接已经断开
68 else if (ws.readyState == WebSocket.CLOSED) {
69 $('#j_notice').html('与服务器链接已经断开');
70 }
71 //表示正在尝试与服务创建链接
72 else if (ws.readyState == WebSocket.CONNECTING) {
73 $('#j_notice').html('正在尝试与服务创建链接');
74 }
75 //正在关闭与服务器链接
76 else if (ws.readyState == WebSocket.CLOSING) {
77 $('#j_notice').html('正在关闭与服务器链接');
78 }
79
80 });
81 //3.4 单发消息
82 $("#j_send2").on("click", function () {
83 var msg = $('#j_receiveUserKey').val();
84 if (msg=="") {
85 $('#j_notice').html('请输入接收人的标识');
86 return;
87 }
88 //下面对内容进行拼接
89 // "$--$--**" + msg + "$--$--**" + "发送的内容";
90
91 var finalMsg = "$--$--**" + msg + "$--$--**" + $('#j_content').val();
92
93 //表示与服务器已经创建好链接
94 if (ws.readyState == WebSocket.OPEN) {
95 ws.send(finalMsg);
96 }
97 //表示与服务器链接已经断开
98 else if (ws.readyState == WebSocket.CLOSED) {
99 $('#j_notice').html('与服务器链接已经断开');
100 }
101 //表示正在尝试与服务创建链接
102 else if (ws.readyState == WebSocket.CONNECTING) {
103 $('#j_notice').html('正在尝试与服务创建链接');
104 }
105 //正在关闭与服务器链接
106 else if (ws.readyState == WebSocket.CLOSING) {
107 $('#j_notice').html('正在关闭与服务器链接');
108 }
109
110 });
111 }
112
113 };
114
115 w.mainUitls = mainUitls;
116 })(window)
117
118 $(function () {
119 mainUitls.init();
120 });
121 </script>
122 </head>
123 <body>
124 <div>
125 <div><span>提示：</span><span id="j_notice"></span></div>
126 <div style="margin-top:20px">
127 <input type="text" name="name" value="" placeholder="请输入登陆标识" id="j_userKey" />
128 <button id="j_connect">创建链接</button>
129 <button id="j_close">关闭链接</button>
130 </div>
131 <div style="margin-top:20px">
132 <input type="text" value="" placeholder="请输入发送内容" id="j_content" />
133 <button id="j_send">群发</button>
134 </div>
135
136 <div style="margin-top:20px">
137 <input type="text" value="" placeholder="请输入接收人标识" id="j_receiveUserKey" />
138 <button id="j_send2">单发</button>
139 </div>
140 <div>
141 <ul id="j_Msg"></ul>
142 </div>
143 </div>
144 </body>
145 </html>
通常处理程序代码：
1 using System;
2 using System.Collections.Concurrent;
3 using System.Collections.Generic;
4 using System.Linq;
5 using System.Net.WebSockets;
6 using System.Text;
7 using System.Threading;
8 using System.Threading.Tasks;
9 using System.Web;
10 using System.Web.SessionState;
11 using System.Web.WebSockets;
12
13 namespace WebSocketDemo
14 {
15 /// <summary>
16 /// webSocketHander
17 /// </summary>
18 public class webSocketHandler : IHttpHandler, IRequiresSessionState
19 {
20 //用户登记标识
21 private string userKey = "";
22 public void ProcessRequest(HttpContext context)
23 {
24 if (context.IsWebSocketRequest)
25 {
26 this.userKey = context.Request.QueryString["userKey"];
27 context.AcceptWebSocketRequest(ProcessChat);
28 }
29 else
30 {
31 context.Response.Write("不是WebSocket请求");
32 }
33 }
34 private async Task ProcessChat(AspNetWebSocketContext context)
35 {
36 WebSocket socket = context.WebSocket;
37 CancellationToken cancellationToken = new CancellationToken();
38 bool isExits = WebManager.AddUser(userKey, socket);
39 if (isExits == false)
40 {
41 //表示该用户有在线
42 await WebManager.SendToMySelf(cancellationToken, $"用户【{this.userKey}】 已在线", this.userKey);
43 }
44 else
45 {
46 //表示登陆成功
47 //某人登录后，给群里其余人发送提示信息(本人除外)
48 await WebManager.SendLoginSucesssNotice(cancellationToken, $"用户【{this.userKey}】 进入聊天室,当前时间：{DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")}");
49 while (socket.State == WebSocketState.Open)
50 {
51 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
52 //接受指令
53 WebSocketReceiveResult result = await socket.ReceiveAsync(buffer, cancellationToken);
54 //表示是关闭指令
55 if (result.MessageType == WebSocketMessageType.Close)
56 {
57 //移除该用户对应的socket对象
58 WebManager.RemoveUser(userKey);
59 //发送离开提醒
60 await WebManager.SendOutNotice(cancellationToken, $"用户【{this.userKey}】 离开聊天室,当前时间：{DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")}");
61 await socket.CloseAsync(WebSocketCloseStatus.NormalClosure, String.Empty, cancellationToken);
62 }
63 //获取是发送消息指令
64 else
65 {
66 string userMsg = Encoding.UTF8.GetString(buffer.Array, 0, result.Count);
67 //这里要区分是单发仍是群发(经过与前端在内容开头作一个标记，来区分是单发仍是群发)
68 if (userMsg.Length > 8 && userMsg.Substring(0, 8) == "$--$--**")
69 {
70 //表示是单发，截取内容和接受者的标记
71 var array = userMsg.Split(new string[] { "$--$--**" }, StringSplitOptions.None);
72 var receiveNotice = array[1];
73 string content = $"用户【{this.userKey}】 发来消息：{array[2]},当前时间：{DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")}";
74 WebManager.SendSingleMessage(cancellationToken, content, receiveNotice);
75 }
76 else
77 {
78 //表示群发信息
79 string content = $"用户【{this.userKey}】 群发消息：{userMsg},当前时间：{DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")}";
80 WebManager.SendAllMessage(cancellationToken, content, userKey);
81 }
82 }
83 }
84 }
85
86 }
87
88 /// <summary>
89 /// true 若是 System.Web.IHttpHandler 实例是可重复使用; 不然为 false。
90 /// </summary>
91 public bool IsReusable
92 {
93 get
94 {
95 return false;
96 }
97 }
98 }
99
100
101 }
帮助类代码：
1 using System;
2 using System.Collections.Concurrent;
3 using System.Collections.Generic;
4 using System.Linq;
5 using System.Net.WebSockets;
6 using System.Text;
7 using System.Threading;
8 using System.Threading.Tasks;
9 using System.Web;
10 using System.Web.SessionState;
11
12
13 namespace WebSocketDemo
14 {
15 /// <summary>
16 /// webSocket帮助类
17 /// </summary>
18 public class WebManager
19 {
20 /// <summary>
21 /// 这采用ConcurrentDictionary字典，是线程安全的，不须要加锁
22 /// </summary>
23 private static ConcurrentDictionary<string, WebSocket> _UserDictionary = new ConcurrentDictionary<string, WebSocket>();
24
25 #region 01-增长用户
26 /// <summary>
27 /// 增长用户
28 /// </summary>
29 /// <param name="userKey"></param>
30 /// <param name="socket"></param>
31 public static bool AddUser(string userKey, WebSocket socket)
32 {
33
34 bool flag = _UserDictionary.Select(d => d.Key).ToList().Contains(userKey);
35 if (flag == false)
36 {
37 _UserDictionary[userKey] = socket;
38 return true;
39 }
40 else
41 {
42 //表示该用户在线
43 return false;
44
45 }
46 }
47 #endregion
48
49 #region 02-移除用户
50 /// <summary>
51 /// 移除用户
52 /// </summary>
53 /// <param name="userKey"></param>
54 public static void RemoveUser(string userKey)
55 {
56 WebSocket socket = null;
57 _UserDictionary.TryRemove(userKey, out socket);
58 }
59 #endregion
60
61 #region 03-登陆提醒
62
63 /// <summary>
64 /// 登陆提醒（包括本身）
65 /// </summary>
66 /// <param name="cancellationToken"></param>
67 /// <param name="content"></param>
68 /// <returns></returns>
69 public static async Task SendLoginSucesssNotice(CancellationToken cancellationToken, string content)
70 {
71 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
72 buffer = new ArraySegment<byte>(Encoding.UTF8.GetBytes(content));
73 //登陆提醒（包括本身）
74 foreach (var socket in _UserDictionary.Select(d => d.Value))
75 {
76 await socket.SendAsync(buffer, WebSocketMessageType.Text, true, cancellationToken);
77 }
78 }
79
80 #endregion
81
82 #region 04-离开提醒
83
84 /// <summary>
85 /// 离开提醒
86 /// </summary>
87 /// <param name="cancellationToken"></param>
88 /// <param name="content"></param>
89 /// <returns></returns>
90 public static async Task SendOutNotice(CancellationToken cancellationToken, string content)
91 {
92 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
93 buffer = new ArraySegment<byte>(Encoding.UTF8.GetBytes(content));
94 //离开提醒
95 foreach (var socket in _UserDictionary.Select(d => d.Value))
96 {
97 await socket.SendAsync(buffer, WebSocketMessageType.Text, true, cancellationToken);
98 }
99 }
100
101 #endregion
102
103 #region 05-群发消息，不包括本身
104 /// <summary>
105 /// 群发消息，不包括本身
106 /// </summary>
107 /// <param name="cancellationToken"></param>
108 /// <param name="content"></param>
109 /// <param name="myUserKey">当前用户标记</param>
110 /// <returns></returns>
111 public static void SendAllMessage(CancellationToken cancellationToken, string content, string myUserKey)
112 {
113 try
114 {
115 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
116 buffer = new ArraySegment<byte>(Encoding.UTF8.GetBytes(content));
117 //群发消息，但不包括本身
118 foreach (var item in _UserDictionary)
119 {
120 if (item.Key.ToString() != myUserKey)
121 {
122 item.Value.SendAsync(buffer, WebSocketMessageType.Text, true, cancellationToken);
123 }
124 }
125 }
126 catch (Exception ex)
127 {
128 var msg = ex.Message;
129 }
130 }
131 #endregion
132
133 #region 06-单发消息
134 /// <summary>
135 /// 单发消息
136 /// </summary>
137 /// <param name="cancellationToken"></param>
138 /// <param name="content"></param>
139 /// <param name="receiveKey">接收者的标识</param>
140 /// <returns></returns>
141 public static void SendSingleMessage(CancellationToken cancellationToken, string content, string receiveKey)
142 {
143 try
144 {
145 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
146 buffer = new ArraySegment<byte>(Encoding.UTF8.GetBytes(content));
147 //单发消息
148 foreach (var item in _UserDictionary)
149 {
150 if (item.Key.ToString() == receiveKey)
151 {
152 item.Value.SendAsync(buffer, WebSocketMessageType.Text, true, cancellationToken);
153 }
154 }
155 }
156 catch (Exception ex)
157 {
158 var msg = ex.Message;
159 }
160 }
161 #endregion
162
163 #region 07-给本身发送消息
164
165 /// <summary>
166 /// 给本身发送消息
167 /// </summary>
168 /// <param name="cancellationToken"></param>
169 /// <param name="content"></param>
170 /// <param name="userKey">当前标记</param>
171 /// <returns></returns>
172 public static async Task SendToMySelf(CancellationToken cancellationToken, string content,string userKey)
173 {
174 ArraySegment<byte> buffer = new ArraySegment<byte>(new byte[2048]);
175 buffer = new ArraySegment<byte>(Encoding.UTF8.GetBytes(content));
176 //离开提醒
177 foreach (var item in _UserDictionary)
178 {
179 if (item.Key.ToString() == userKey)
180 {
181 await item.Value.SendAsync(buffer, WebSocketMessageType.Text, true, cancellationToken);
182 }
183 }
184 }
185 #endregion
186
187 }
188 }
最终实现效果：
五. 局限与后续计划
经过上面这个小例子，我以为WebSocket主要有这么两个缺陷：
1. 众所周知，不少低版本的浏览器不支持。
2. 代码写起来繁琐，客户端和服务器端之间不能自行指定方法名进行直接调用，好比上面单发和群发在客户端是只能经过Send方法进行发送到服务器端固定的位置，使得不得不本身约定规则进行区分；再好比：客户端消息的接受只能经过onmessage进行监听，很是局限不灵活。
而SignalR很好的解决了上面的两个问题。
补充一张websocket的兼容性，下图来自于网络。
后续章节开始详细的介绍SignalR的用法，大约3天一篇，有兴趣的朋友能够关注该系列，互相讨论，共同提升。
第十五节：深刻理解async和await的做用及各类适用场景和用法
一. 同步VS异步
1. 同步 VS 异步 VS 多线程
2. 常见的异步方法（都以Async结尾）
① HttpClient类：PostAsync、PutAsync、GetAsync、DeleteAsync
② EF中DbContext类：SaveChangesAsync
③ 文件相关中的：WriteLineAsync
3. 引入异步方法的背景
好比我在后台要向另外一台服务器中获取中的2个接口获取信息，而后将两个接口的信息拼接起来，一块儿输出，接口1耗时3s，接口2耗时5s，
① 传统的同步方式：
须要的时间大约为：3s + 5s =8s, 以下面 【案例1】
先分享一个同步请求接口的封装方法，下同。
1 public class HttpService
2 {
3 /// <summary>
4 /// 后台跨域请求发送代码
5 /// </summary>
6 /// <param name="url">eg:http://ac.guojin.org/jeesite/regist/saveAppAgentAccount </param>
7 ///<param name="postData"></param>
8 /// 参数格式（手拼Json） string postData = "{\"name\":\"" + vip.comName + "\",\"shortName\":\"" + vip.shortName + + "\"}";
9 /// <returns></returns>
10 public static string PostData(string postData, string url)
11 {
12 HttpWebRequest req = (HttpWebRequest)WebRequest.Create(url);//后台请求页面
13 Encoding encoding = Encoding.GetEncoding("utf-8");//注意页面的编码，不然会出现乱码
14 byte[] requestBytes = encoding.GetBytes(postData);
15 req.Method = "POST";
16 req.ContentType = "application/json";
17 req.ContentLength = requestBytes.Length;
18 Stream requestStream = req.GetRequestStream();
19 requestStream.Write(requestBytes, 0, requestBytes.Length);
20 requestStream.Close();
21 HttpWebResponse res = (HttpWebResponse)req.GetResponse();
22 StreamReader sr = new StreamReader(res.GetResponseStream(), System.Text.Encoding.GetEncoding("utf-8"));
23 string backstr = sr.ReadToEnd();//能够读取到从页面返回的结果，以数据流的形式。
24 sr.Close();
25 res.Close();
26
27 return backstr;
28 }
而后在分享服务上的耗时操做，下同。
1 /// <summary>
2 /// 耗时方法 耗时3s
3 /// </summary>
4 /// <returns></returns>
5 public ActionResult GetMsg1()
6 {
7 Thread.Sleep(3000);
8 return Content("GetMsg1");
9
10 }
11
12 /// <summary>
13 /// 耗时方法 耗时5s
14 /// </summary>
15 /// <returns></returns>
16 public ActionResult GetMsg2()
17 {
18 Thread.Sleep(5000);
19 return Content("GetMsg2");
20
21 }
下面是案例1代码
1 #region 案例1(传统同步方式 耗时8s左右)
2 {
3 Stopwatch watch = Stopwatch.StartNew();
4 Console.WriteLine("开始执行");
5
6 string t1 = HttpService.PostData("", "http://localhost:2788/Home/GetMsg1");
7 string t2 = HttpService.PostData("", "http://localhost:2788/Home/GetMsg2");
8
9 Console.WriteLine("我是主业务");
10 Console.WriteLine($"{t1},{t2}");
11 watch.Stop();
12 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
13 }
14 #endregion
② 开启新线程分别执行两个耗时操做
须要的时间大约为：Max(3s,5s) = 5s ,以下面【案例2】
1 #region 案例2(开启新线程分别执行两个耗时操做 耗时5s左右)
2 {
3 Stopwatch watch = Stopwatch.StartNew();
4 Console.WriteLine("开始执行");
5
6 var task1 = Task.Run(() =>
7 {
8 return HttpService.PostData("", "http://localhost:2788/Home/GetMsg1");
9 });
10
11 var task2 = Task.Run(() =>
12 {
13 return HttpService.PostData("", "http://localhost:2788/Home/GetMsg2");
14 });
15
16 Console.WriteLine("我是主业务");
17 //主线程进行等待
18 Task.WaitAll(task1, task2);
19 Console.WriteLine($"{task1.Result},{task2.Result}");
20 watch.Stop();
21 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
22 }
23 #endregion
既然②方式能够解决同步方法串行耗时间的问题，但这种方式存在一个弊端，一个业务中存在多个线程，且须要对线程进行管理，相对麻烦，从而引出了异步方法。
这里的异步方法 我 特指：系统类库自带的以async结尾的异步方法。
③ 使用系统类库自带的异步方法
须要的时间大约为：Max(3s,5s) = 5s ,以下面【案例3】
1 #region 案例3(使用系统类库自带的异步方法 耗时5s左右)
2 {
3 Stopwatch watch = Stopwatch.StartNew();
4 HttpClient http = new HttpClient();
5 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
6 Console.WriteLine("开始执行");
7 //执行业务
8 var r1 = http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
9 var r2 = http.PostAsync("http://localhost:2788/Home/GetMsg2", httpContent);
10 Console.WriteLine("我是主业务");
11
12 //经过异步方法的结果.Result能够是异步方法执行完的结果
13 Console.WriteLine(r1.Result.Content.ReadAsStringAsync().Result);
14 Console.WriteLine(r2.Result.Content.ReadAsStringAsync().Result);
15
16 watch.Stop();
17 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
18 }
19 #endregion
PS：经过 .Result 来获取异步方法执行完后的结果。
二. 利用async和await封装异步方法
1. 首先要声明几点：
① async和await关键字是C# 5.0时代引入的，它是一种异步编程模型
② 它们自己并不建立新线程，但我能够在自行封装的async中利用Task.Run开启新线程
③ 利用async关键字封装的方法中若是写所有都是一些串行业务, 且不用await关键字，那么即便使用async封装，也并无什么卵用，并起不了异步方法的做用。
须要的时间大约为：3s + 5s =8s, 以下面 【案例4】，而且封装的方法编译器会提示：“缺乏关键字await，将以同步的方式调用，请使用await运算符等待非阻止API或Task.Run的形式”（PS：非阻止API指系统类库自带的以Async结尾的异步方法）
1 //利用async封装同步业务的方法
2 private static async Task<string> NewMethod5Async()
3 {
4 Thread.Sleep(3000);
5 //其它同步业务
6 return "Msg1";
7 }
8 private static async Task<string> NewMethod6Async()
9 {
10 Thread.Sleep(5000);
11 //其它同步业务
12 return "Msg2";
13 }
1 #region 案例4(async关键字封装的方法中若是写所有都是一些串行业务 耗时8s左右)
2 {
3 Stopwatch watch = Stopwatch.StartNew();
4
5 Console.WriteLine("开始执行");
6
7 Task<string> t1 = NewMethod5Async();
8 Task<string> t2 = NewMethod6Async();
9
10 Console.WriteLine("我是主业务");
11 Console.WriteLine($"{t1.Result},{t2.Result}");
12 watch.Stop();
13 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
14 }
15 #endregion
观点结论1：从上面③中能够得出一个结论，async中必需要有await运算符才能起到异步方法的做用，且await 运算符只能加在 系统类库默认提供的异步方法或者新线程（如：Task.Run）前面。
如：下面【案例5】 和 【案例6】须要的时间大约为：Max(3s,5s) = 5s
1 // 将系统类库提供的异步方法利用async封装起来
2 private static async Task<String> NewMethod1Async()
3 {
4 HttpClient http = new HttpClient();
5 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
6 //执行业务
7 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
8 return r1.Content.ReadAsStringAsync().Result;
9 }
10 private static async Task<String> NewMethod2Async()
11 {
12 HttpClient http = new HttpClient();
13 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
14 //执行业务
15 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg2", httpContent);
16 return r1.Content.ReadAsStringAsync().Result;
17 }
18
19 //将await关键字加在新线程的前面
20 private static async Task<string> NewMethod3Async()
21 {
22 var msg = await Task.Run(() =>
23 {
24 return HttpService.PostData("", "http://localhost:2788/Home/GetMsg1");
25 });
26 return msg;
27 }
28 private static async Task<string> NewMethod4Async()
29 {
30 var msg = await Task.Run(() =>
31 {
32 return HttpService.PostData("", "http://localhost:2788/Home/GetMsg2");
33 });
34 return msg;
35 }
1 #region 案例5(将系统类库提供的异步方法利用async封装起来 耗时5s左右)
2 //而且先输出“我是主业务”，证实t1和t2是并行执行的，且不阻碍主业务
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5
6 Console.WriteLine("开始执行");
7 Task<string> t1 = NewMethod1Async();
8 Task<string> t2 = NewMethod2Async();
9
10 Console.WriteLine("我是主业务");
11 Console.WriteLine($"{t1.Result},{t2.Result}");
12 watch.Stop();
13 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
14 }
15 #endregion
1 #region 案例6(将新线程利用async封装起来 耗时5s左右)
2 //而且先输出“我是主业务”，证实t1和t2是并行执行的，且不阻碍主业务
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5
6 Console.WriteLine("开始执行");
7 Task<string> t1 = NewMethod3Async();
8 Task<string> t2 = NewMethod4Async();
9
10 Console.WriteLine("我是主业务");
11 Console.WriteLine($"{t1.Result},{t2.Result}");
12 watch.Stop();
13 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
14 }
15 #endregion
2. 几个规则和约定
① async封装的方法中，能够有多个await，这里的await表明等待该行代码执行完毕。
② 咱们一般本身封装的方法也要以Async结尾，方便识别
③ 异步返回类型主要有三种：Task<T> 、Task、Void
3. 测试得出其余几个结论
① 若是async封装的异步方法里既有同步业务又有异步业务(开启新线程或者系统类库提供异步方法)，那么同步方法那部分的时间在调用的时候是会阻塞主线程的，即主线程要等待这部分同步业务执行完才能往下执行。
如【案例7】 耗时：同步操做之和 2s+2s + Max(3s,5s)=9s;
1 //同步耗时操做和异步方法同时封装
2 private static async Task<String> NewMethod7Async()
3 {
4 //调用异步方法以前还有一个耗时操做
5 Thread.Sleep(2000);
6
7 //下面的操做耗时3s
8 HttpClient http = new HttpClient();
9 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
10 //执行业务
11 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
12 return r1.Content.ReadAsStringAsync().Result;
13 }
14 private static async Task<String> NewMethod8Async()
15 {
16 //调用异步方法以前还有一个耗时操做
17 Thread.Sleep(2000);
18
19 //下面的操做耗时5s
20 HttpClient http = new HttpClient();
21 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
22 //执行业务
23 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg2", httpContent);
24 return r1.Content.ReadAsStringAsync().Result;
25 }
1 #region 案例7(既有普通的耗时操做，也有系统自己的异步方法,耗时9s左右)
2 //且大约4s后才能输出 “我是主业务”，证实同步操做Thread.Sleep(2000); 阻塞主线程
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5
6 Console.WriteLine("开始执行");
7 Task<string> t1 = NewMethod7Async();
8 Task<string> t2 = NewMethod8Async();
9
10 Console.WriteLine("我是主业务");
11 Console.WriteLine($"{t1.Result},{t2.Result}");
12 watch.Stop();
13 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
14 }
15 #endregion
证实：async封装的异步方法里的同步业务的时间会阻塞主线程，再次证实 await只能加在 非阻止api和开启新线程的前面
② 若是封装的异步方法中存在等待的问题，并且不能阻塞主线程(不能用Thread.Sleep) , 这个时候能够用Task.Delay，并在前面加await关键字
如【案例8】 耗时：Max（2+3 , 5+2）=7s
1 //利用Task.Delay(2000);等待
2 private static async Task<String> NewMethod11Async()
3 {
4 //调用异步方法以前须要等待2s
5 await Task.Delay(2000);
6
7 //下面的操做耗时3s
8 HttpClient http = new HttpClient();
9 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
10 //执行业务
11 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
12 return r1.Content.ReadAsStringAsync().Result;
13 }
14
15 private static async Task<String> NewMethod12Async()
16 {
17 //调用异步方法以前须要等待2s
18 await Task.Delay(2000);
19
20 //下面的操做耗时5s
21 HttpClient http = new HttpClient();
22 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
23 //执行业务
24 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg2", httpContent);
25 return r1.Content.ReadAsStringAsync().Result;
26 }
1 #region 案例8(利用Task.Delay执行异步方法的等待操做)
2 //结果是7s，且立刻输出“我是主业务”，说明Task.Delay(),不阻塞主线程。
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5 Console.WriteLine("开始执行");
6 Task<string> t1 = NewMethod11Async();
7 Task<string> t2 = NewMethod12Async();
8
9 Console.WriteLine("我是主业务");
10 Console.WriteLine($"{t1.Result},{t2.Result}");
11 watch.Stop();
12 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
13 }
14 #endregion
三. 异步方法返回类型
1. Task<T>, 处理含有返回值的异步方法，经过 .Result 等待异步方法执行完，且获取到返回值。
2. Task：调用方法不须要从异步方法中取返回值，可是但愿检查异步方法的状态，那么能够选择能够返回 Task 类型的对象。不过，就算异步方法中包含 return 语句，也不会返回任何东西。
如【案例9】
1
2 //返回值为Task的方法
3 private static async Task NewMethod9Async()
4 {
5
6 //下面的操做耗时3s
7 HttpClient http = new HttpClient();
8 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
9 //执行业务
10 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
11 Console.WriteLine("NewMethod9Async执行完成");
12 }
1 #region 案例9(返回值为Task的异步方法)
2 //结果是5s，说明异步方法和主线程的同步方法 在并行执行
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5
6 Console.WriteLine("开始执行");
7 Task t = NewMethod9Async();
8
9 Console.WriteLine($"{nameof(t.Status)}: {t.Status}"); //任务状态
10 Console.WriteLine($"{nameof(t.IsCompleted)}: {t.IsCompleted}"); //任务完成状态标识
11 Console.WriteLine($"{nameof(t.IsFaulted)}: {t.IsFaulted}"); //任务是否有未处理的异常标识
12
13 //执行其余耗时操做，与此同时NewMethod9Async也在工做
14 Thread.Sleep(5000);
15
16 Console.WriteLine("我是主业务");
17
18 t.Wait();
19
20 Console.WriteLine($"{nameof(t.Status)}: {t.Status}"); //任务状态
21 Console.WriteLine($"{nameof(t.IsCompleted)}: {t.IsCompleted}"); //任务完成状态标识
22 Console.WriteLine($"{nameof(t.IsFaulted)}: {t.IsFaulted}"); //任务是否有未处理的异常标识
23
24 Console.WriteLine($"全部业务执行完成了");
25 watch.Stop();
26 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
27 }
28 #endregion
PS：对于Task返回值的异步方法，能够调用Wait(),等 待该异步方法执行完，他和await不一样，await必须出如今async关键字封装的方法中。
3. void：调用异步执行方法，不须要作任何交互
如【案例10】
1 //返回值是Void的方法
2 private static async void NewMethod10Async()
3 {
4 //下面的操做耗时5s
5 HttpClient http = new HttpClient();
6 var httpContent = new StringContent("", Encoding.UTF8, "application/json");
7 //执行业务，假设这里主须要请求，不须要作任何交互
8 var r1 = await http.PostAsync("http://localhost:2788/Home/GetMsg1", httpContent);
9 Console.WriteLine("NewMethod10Async执行完成");
10 }
1 #region 案例10(返回值为Void的异步方法)
2 //结果是5s，说明异步方法和主线程的同步方法 在并行执行
3 {
4 Stopwatch watch = Stopwatch.StartNew();
5
6 Console.WriteLine("开始执行");
7 NewMethod10Async();
8
9 //执行其余耗时操做，与此同时NewMethod9Async也在工做
10 Thread.Sleep(5000);
11
12 Console.WriteLine("我是主业务");
13
14
15 Console.WriteLine($"全部业务执行完成了");
16 watch.Stop();
17 Console.WriteLine($"耗时：{watch.ElapsedMilliseconds}");
18 }
19 #endregion
四. 几个结论
1. 异步方法到底开不开起新线程？
异步和等待关键字不会致使其余线程建立。 由于异步方法自己并不会运行的线程，异步方法不须要多线程。 只有 + 当方法处于活动状态，则方法在当前同步上下文中运行并使用在线程的时间。 可使用 Task.Run 移动 CPU 工做移到后台线程，可是，后台线程不利于等待结果变得可用处理。（来自MSDN原话）
2. async和await是一种异步编程模型，它自己并不能开启新线程，多用于将一些非阻止API或者开启新线程的操做封装起来，使其调用的时候像同步方法同样使用。
下面补充博客园dudu的解释，方便你们理解。
五. 参考资料
1. 反骨仔：http://www.cnblogs.com/liqingwen/p/5831951.html
http://www.cnblogs.com/liqingwen/p/5844095.html
2. MSDN：https://msdn.microsoft.com/library/hh191443(vs.110).aspx
PS：若是你想了解多线程的其余知识，请移步：那些年咱们一块儿追逐的多线程(Thread、ThreadPool、委托异步调用、Task/TaskFactory、Parallerl、async和await)
前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、Git/SVN)
一. 各种概念和指令介绍
1. NVM
(1). 全称：Node Version Manager，是一款针对Nodejs的版本管理工具，因为Node的版本不少，不少时候我要须要依赖多个版本，而且要求能够自动切换，这个时候采用NVM来管理Node再合适不过了。
(2). 下载地址：https://github.com/coreybutler/nvm-windows/releases
(3). 经常使用指令：
a. 查看已经安装的node版本： 【nvm list】
b. 更换当前node的版本： 【nvm use 版本号 】
c. 安装指定版本的node： 【nvm install 版本号 】 （nvm install stable 特指安装最新最稳的node版本 nvm install latest 特指下载最新的node版本）
d. 删除指定版本的node： 【nvm uninstall 版本号】
其它指令：
(4). NVM自身版本如何更新：
NVM总共就5个文件，直接复制到原文件夹下，覆盖便可。
2. Node.JS
(1). 一个JS的运行环境
(2). 主要用于开发Web应用程序
(3). 不少的前端开发工具都是基于node这个平台
(4). 所用的工具就至关于一些软件
PS：
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。
Node.js 的包管理器 npm，是全球最大的开源库生态系统。
Node.js的版本管理器为nvm。
3. NPM
NPM（node package manager），是Node.js的包管理器，是全球最大的开源生态库。
参考地址： 官方网站：https://www.npmjs.com/
npm管理包很是方便，咱们只须要记住使用哪一个包就能够了，相似于.Net平台下的Nuget。
4. CNPM
cnpm工具，它是中国版的npm镜像库，地址在这里：https://cnpmjs.org/，也是npm官方的一个拷贝，由于咱们和外界有一堵墙隔着，因此用这个国内的比较快，淘宝也弄了一个和npm同样的镜像库，http://npm.taobao.org/，它和官方的npm每隔10分钟同步一次。安装方式：
指令：【npm install -g cnpm --registry=https://registry.npm.taobao.org】
安装好了cnpm后，直接执行：cnpm install 包名
好比：cnpm install bower -g 就能够了。-g只是为了把包安装在全局路径下。若是不全局安装，也能够在当前目录中安装，不用-g就能够了。
注意：cnpm的下载路径按照上述指令安装的话，默认就是从taobao的地址下载，和经过nrm切换npm的下载源到taobao，此时npm和cnpm的下载源是相同的，下载速度也是一致的。
5. NRM
nrm就是npm registry manager 也就是npm的镜像源管理工具，有时候国外资源太慢，那么咱们能够用这个来切换下载的镜像源。
咱们只要经过这个命令: 【npm install -g nrm 】就能够实现安装。
注意：-g能够直接放到install的后面，咱们之后也最好这样用，由于这样用，咱们能够在cmd中上下箭头切换最近命令的时候，容易修改，更方便操做。安装完成后，咱们就可使用了。
命令：【nrm ls 】用于展现全部可切换的镜像地址
命令：【nrm use taobao】 咱们这样就能够直接切换到taobao上了，和上述的cnpm就一致了。固然也能够按照上面罗列的其余内容进行切换。
6. WebPack
WebPack能够看作是模块打包机：它作的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其转换和打包为合适的格式供浏览器使用。
Webpack的工做方式是：把你的项目当作一个总体，经过一个给定的主文件（如：index.js），Webpack将从这个文件开始找到你的项目的全部依赖文件，使用loaders处理它们，最后打包为一个（或多个）浏览器可识别的JavaScript文件。
7. Gulp/Grunt
Grunt和Gulp的工做方式是：在一个配置文件中，指明对某些文件进行相似编译，组合，压缩等任务的具体步骤，工具以后能够自动替你完成这些任务。
8. Git/SVN
代码、文件等版本管理工具。
二. 安装步骤(两套安装方案)
方案一：严格按照顺序进行安装配置
(一). 安装NVM的详细步骤
(1). 在C盘目录下建一个Develop文件夹，该文件用来存放各类与开发相关的配置。
(2). 在Develop文件夹中新建nvm文件夹，并将下载的nvm五个文件拷贝进去。
下载地址：https://github.com/coreybutler/nvm-windows/releases
注意：下载免安装版本的，不要下载exe安装程序。
(3). cmd命令测试是否安装成功。
输入指令：【nvm -v 】， 发现并不能用。缘由是尚未配置环境变量。
(4). 配置环境变量
NVM_HOME=C:\Develop\nvm
PATH=%NVM_HOME%;
如图所示：
而后经过命令测试：
发现：并无成功，缘由是 nvm 的根目录下缺乏一个 配置文件setting.txt。
(5). 动态生成配置文件
（有现成的能够直接拷贝进去，这里介绍一种动态生成的方式）。
双击：install.cmd命令，而后把当前路径拷贝进去，点击回车，会自动在当前目录下生成 setting.txt文件。
从新cmd 输入指令【nvm -v】,发现大功告成。
下面咱们测试一下nodejs环境，指令【nvm list】，发现并无安装。
(二). 安装Node.js
(1). 直接输入指令【nvm install latest】，安装最新版本的node。
特别注意：备注： 若是你的电脑系统是32 位的，那么在下载nodejs版本的时候，必定要指明 32 如：【nvm install 5.11.0 32 】 这样在32位的电脑系统中，才可使用，默认是64位的。
这个时候发现一个现象，下载完最新的nodejs版后，自动去下载最新的npm了，这个现象很正常，在每一个版本的nodejs中，都会自带npm，为了统一块儿见，咱们安装一个全局的npm工具，这个操做颇有必要，由于咱们须要安装一些全局的其余包，不会由于切换node版本形成原来下载过的包不可用。
为了后面演示切换方便，咱们这里再安装另一个node的版本 指令【node install 6.2.0】。
一样的现象，安装完node后，会自动下载该版本的node对应npm包。
(2). 配置node的环境变量
【这里先补充一个知识点：nvm切换node版本的原理，会在nvm的同级目录下生成一个nodejs的快捷方式，当前使用哪一个版本的node，该快捷方式就会执行nvm文件夹里的对应版本的node】
基于以上原理，配置nodejs环境变量的时候，指向的是该快捷方式，这样不管怎么切换node版本，环境变量都不须要改，均可以直接对应。
A：配置NVM文件夹下的setting.txt配置文件。
B：配置系统环境变量。
(3) . 查看已经安装的node版本，并选择指定版原本使用。
查看已经安装的node版本，指令【node list】
选择8.5.0版本进行使用，指令 【node use 8.5.0】
再输入该命令以前，观察一个现象，Develop目录下只有nvm一个文件夹。
执行该命令。
发现Develop目录下多了一个nodejs的快捷方式【正是经过该快捷方式来映射nvm文件夹里对应的node版本，同时node的环境变量也是对应该快捷方式】
再次查看使用版本【nvm list】，发现8.5.0正在使用中
(三). 设置npm全局的下载路径，而且安装全局的
咱们在前面提到，每安装一个node版本，都会安装与其对应的npm包，在这里咱们切换node版本，而后查看对应的npm版原本测试一下。
既然咱们已经装了多个不一样版本的npm了（每一个版本的node对应一个版本的npm），那么咱们为何还要安装一个全局的npm包呢？
【首先咱们先补充一个知识：经过npm下载下来的其余程序包都是存放在" node_modules "文件夹下，而每一个node下的npm都对应一个" node_modules "文件夹，但咱们再实际开发中，一般须要下载一些程序包，这些程序包要是全局的，不能由于切换node版本而致使该程序包不可用】
因此咱们下面的思路借助已有的npm，来下载安装一个全局的npm。
(1). 配置NPM的全局安装路径
进入cmd命令，输入【 npm config set prefix "C:\Develop\npm" 】回车，这是在配置npm的全局安装路径，而后在用户文件夹下会生成一个.npmrc的文件，用记事本打开后能够看到以下内容：
用记事本打开：并新增全局npm缓存的配置路径，以下图。
(2). 经过命令【npm install -g npm】，下载全局的npm包 (下载不下来，先放到后面)
(3) . 配置npm的环境变量
(4). 安装nrm
经过命令： 【npm install -g nrm】全局安装nrm
【nrm ls】，展现全部镜像的地址。
切换npm的下载源头。 【nrm use taobao】
从新全局安装npm， 【npm install -g npm】
特别注意：在这里下载完后，不管node版本怎么切换，npm的版本始终是全局的npm的 ： 5.4.2版本
特别注意：经过nrm的指令 【nrm use taobao】，将npm的下载源头切换到taobao，此时实际上和下面要安装cnpm下载是一个道理的，说白了，切换后的npm，就没有必要安装cnpm了。
这里再补充一种方式，来切换npm的下载路径（能够不用安装nrm）
【 npm config set registry https://registry.npm.taobao.org】，该指令与前面“配置npm的全局安装路径相似”，都是操控的 .npmrc文件。
（四）全局安装cnpm
指令【npm install -g cnpm --registry=https://registry.npm.taoba0.org】
查看安装是否成功【cnpm -v】
方案二. 直接官网下载NodeJS安装包，简单粗暴型
1. 官网下载Node.js的msi安装包，直接下一步安装。
下载地址：http://nodejs.cn/
安装过程很是简单，直接下一步、下一步、一路到底。
建议：安装路径根据本身的须要适当改一下。
特别注意：选择安装项的这一步，要不npm和add path(自动配置环境变量)，这两个选项给勾上。
2. 校验安装成果。
A： 发现nodejs和npm能够正常使用
B： 发如今用户变量和系统变量的path中各自多了一条记录。
C： 测试全局下载【npm install -g bootstarp】。将下载到该路径下：C:\Users\Administrator\AppData\Roaming\npm\node_modules
3. 该种安装方式总结。
不利于nodejs的版本管理，没法自动切换或更新nodejs的版本。
全局下载路径须要本身从新配置，默认的路径，有点坑爹，很差找。
默认是没有安装nrm或cnpm的，须要本身从新切换下载源，默认是国外的。
最后建议： 生命在于折腾，建议采用方案一的方式进行配置，对每一步的做用作到心中有数。
三. npm或cnpm使用
这里以cnpm的指令来介绍，npm的使用只需将指令中的cnpm改成npm便可。【手动将npm的下载源切换到taobao，实际上和cnpm同样了】
1. 将npm更新到最新版本： 【npm install -g npm】
2. 将cnpm更新到最新版本：【cnpm install -g cnpm】
3. 安装其它程序包： 【cnpm install xxx】 会在当前路径上生成一个"node-modules"，并将xx程序下载到该文件夹下。
eg ： 新建一个文件夹，在该文件夹下打开cmd命令，输入指令： 【cnpm install bootstrap 】
删除其它程序包： 【cnpm uninstall xxx】
4. 安装其它程序到全局npm路径下： 【cnpm install -g xx】
删除其它全局程序包：【cnpm uninstall -g xx】
5. 补充知识点：项目依赖
A: 普通项目依赖：
【npm init】：生成一个package.json文件，用来记录项目须要依赖哪些东西。
【npm install xx --save】：对应的是 package.json 文件 dependencies，该节点表示发布以后还须要依赖的东西。（eg：JQuery，发布以后，仍然须要依赖JQuery库）
【npm install xx --save-dev】：对应的是package.json 文件 devDependencies，该节点表示开发阶段须要依赖的东西。（eg：grunt、bable相似的工具类 ，只在开发阶段使用）
【npm install】：默认还原的是package.json下dependencies和devDependencies两个节点下的全部依赖库。
B：全局依赖：特指你要安装一个工具包，系统中任何位置均可能用到，这种状况下一版要全局安装。
指令：【cnpm install -g xx】
6. 全局npm版本更新
【npm install -g npm】，时间有点长，大约须要两分钟
四. 使用以上配置包，快速配置
看了上面的方案一的配置步骤，虽然步骤比较详细，可是受网速等一系列因素，对应一个新手而已，没有一两个小时，是很难配置成功的。
方案二简单粗暴的安装，不便于多版本的控制，不灵活。
因此这里我将提供我我的的已经下载配置好的程序包供广大网友使用，只需配置环境变量便可，省去了烦人的下载步骤。
下载地址：http://pan.baidu.com/s/1o8uUMgU
压缩文件中包括：【Develop文件夹】 【.nmprc文件】
Develop包括：【nvm 1.1.6】、【nodejs 8.5.0】、【nodejs 6.2.0】、【全局的npm 5.4.2】、【全局的nrm】、【全局的cnpm】
注意：这里的.npmrc里已经默认把npm的下载源头切换到了国内的taobao了，同cnpm同样了。
快速配置步骤：
(1). 解压压缩包：将Develop文件夹移动到C盘的根目录，将.nmprc移动到C盘→用户→Administrator(也多是其余用户名)。
(2). 配置环境变量
NVM_HOME=C:\Develop\nvm
NVM_SYMLINK=C:\Develop\nodejs
NPM_HOME=C:\Develop\npm
PATH=%NVM_HOME%;%NVM_SYMLINK%;%NPM_HOME%
注意：在配置path的时候，先后注意要有分号。
(3). 经过指令测试是否成功。（前先后后，分钟足以搞定）
PS： 后台技术系列