前端系列--前后端交互node.js(1)

本篇主要介绍node的相关知识：

1、服务端相关

1.1前端人员为何要学习服务端开发基础

1.2服务端开发要做的事

1.3前端人员学习服务端为何选择node.js

2、node.js相关

2.1node.js介绍

代码运行环境：

实际上node所用引擎是谷歌开发用来运行js代码的，这也是node为什么能够运行js的原因；

2.2node.js组成

找网上其他博客将node.js下载安装完成后可以进行使用，下面先介绍node.js的组成部分：

node可以使用所有的ECMAScript语法；
示例图如下：

2.3node环境下运行代码

node环境下js的运行不是像之前一样在html文件中引入的，而是需要借助命令工具powershell去执行；步骤如下：
1、要先把powershell的地址通过cd指向代码文件所在的地址（也可以打开文件所在文件夹后再鼠标右键打开powershell这样进去后就是在当前目录下了）；
2、通过node命令执行js文件，如下执行了文件test,js，后面紧跟着的是文件的输出结果：

2.4node全局对象global

总的一句window中有的这些方法在node环境下的global下也有，使用都是一样的；

2.5node.js模块化开发

1、文件依赖：比如拿别人的代码中有轮播图，发现是slider.js的功能，但仍无法实现效果，进一步发现后是scroll.js以及更上异步要引入jquery.js文件全部引入才可使用，又进一步去引用这些文件，这个分析的过程十分麻烦；

2、命名冲突：程序中引入了两个js文件都定义了num变量，这时不会报错而是后面文件变量覆盖掉前面的；而node.js模块化中文件与文件之间是半封闭的可以设定其可否访问（以前的是所有文件都可访问）;

现介绍模块化开发：软件中的模块化开发，一个功能就是一个模块，多个模块可以组成完整应用，抽离一个模块不会影响其他模块的运行；

node.js中规定每个js文件就是一个模块，模块内部定义的变量与函数默认情况下在外部是访问不到的；而如果该js文件中的变量与函数想被外界使用，则必须在该文件a.js中通过exports将其导出，如下:

同时在获取这些变量与函数的b.js文件中require进行导入，如下：

注意在导入时，b.js中的后缀,js可以省略；

此外，导出还有另一种方式：

但这两种导出方式的在b.js中的require是相同的；两种导出exports与module.exports的区别如下：

默认情况下，两者指向的默认存储地址是相同的，即两者的作用相同；

但如果给module.exports赋了一个对象数据类型后，此时module.exports不再执行默认的存储地址而是指向了新地址，此时的导出结果以module.exports的为准：即两个导出同时存在时，若module.exports赋了对象数据，则要以module导出的数据为准；

此时如果再给exports也赋对象数据的话还是会只导出module.exports的内容；

由此，解决了命名冲突的问题；

2.6 node.js系统模块

系统模块是指node运行环境中提供的API，由于这些APOI是以模块化的方式进行开发的，所以称为系统模块；

2.6.1fs文件操作

使用前要先将模块引入：

1、读取文件内容方法如下，其中[]表示该参数选填，callback是读取文件结束后的回调函数（由于这是异步api所以不能直接获取返回值）处理结果会作为其参数进行传递


该方法主要用于服务端从硬盘中读取文件然后返回给客户端；

2、写入文件内容方法如下，第一个参数是要写入数据的文件（如果文件不存在将会被创建），第二个参数变成了将要写入的数据内容：

在网站运行时如果报错将错误写入到错误日志中，主要看回调函数第一个参数看有没写入成功：

2.6.2path路径操作

这里只介绍路径拼接的内容，为何要进行路径拼接：

因为服务端一般运行在linux系统上所以必须考虑不同系统的路径问题；
拼接通过path.join('路径1','路径2'...)方法进行，具体代码如下：

而关于服务端中的绝对路径与相对路径：

总的来说，大多数情况下写绝对路径，少数情况下如require引入模块时使用相对路径进行引入；

2.7node.js第三方模块

2.7.1第三方模块介绍

第三方模块即别人写好的具有特定功能，我们能够直接下载引入使用的模块，又因为第三方模块通常是由多个文件组成并放在一个文件夹中所以又称为包；

第三方模块有两种存在方式：
1、以js文件的形式存在，提供实现项目具体功能的API接口；
2、以命令行工具形式存在，辅助项目开发；

可以在npmjs.com上查找相关的内容，其是第三方模块存储和分发的仓库；

2.7.2第三方模块获取使用

要获取第三方模块，则需通过node.js的第三方模块管理工具npm；

通过npm我们可以命令工具powershell中安装所需的第三方模块，具体语句如下：

此外，介绍第三方模块全局安装和本地安装的概念：
通常，在安装时若在最后加上-g语句则表示该模块是全局安装，否则为本地安装；

全局安装：任何项目都可以使用模块，通常命令行工具使用全局安装；
本地安装：只有在当前项目中才可使用，安装后出现在node_modules文件夹中，一般模块都使用本地安装；

下面开始介绍一些常用的第三方模块：

1、nodemon：其是一个命令行工具，用以辅助项目开发，正常node.js中，每次修改了js文件后都要重新手动运行代码；但通过nodemon命令行工具运行后，其会一直处于监听状态，每当修改并重新保存了代码后，会自动运行；

由于是命令行工具所以提高-g进行全局安装；

如果想停止检测只需将光标定在命令行工具中并按control+c即可；

2、nrm：由于npm下载第三方模块是下载地址是在国外，下载速度比较慢，所以提高下载地址切换工具nrm将下载地址切换成国内的后可提高下载速度；

1. 先通过npm install nrm -g下载该模块（全局下载）
2. 查询可用下载地址列表nrm ls；
   
3. 切换下载地址，这里我们一般选用淘宝的 nrm use taobao；

3、gulp：其是基于node平台开发的前端构建工具，将机械化的操作编写成任务，想要执行机械化操作时执行一个命令行命令就能自动执行，提高开发效率；用途如下：

其中公共文件抽离是指如多个文件中都含有相同的同步内容，可以将其抽离出来，在日后修改时只需修改这部分内容实现一改多改的效果；

gulp的使用：
1、使用npm install gulp下载gulp
2、在项目中引入后可开始使用（注意一般将源文件放在新建src目录下，而将处理后的文件保存在新建dist文件夹下）

gulp为我们提供了以下方法：


其中first代表任务的名字，.pipe是将要执行的代码放到其中，而上面代码实质上是一个复制文件的操作，通过安装gulp -cli插件（需要下载）后可以直接gulp first执行相应的任务；

gulp中提供以下插件可供使用，下面逐一介绍（下面任务中全部省略下载插件步骤）：

1、html压缩任务：

先将插件进行引入：

读取文件，进行压缩后再输出，压缩中的collapseWitespace为true表示合并空格；

2、抽取html代码中的公共部分任务：

引入公共模块：

将a.html与b.html中公共代码剪切到common文件下的header.html文件中，在文件ab中将其引入：

在之前的代码中加入include语句，src中的*表示选中该文件夹下的html所有文件，include语句表示对上面所有选中的html中有@@include部分进行引入；

3、将less转css后并压缩任务：

引入插件：

数组表示选中所有的less文件和css文件，分别经过下面的less与csso后实现了less转css以及css的压缩：

4、es6转es5并压缩任务：
这里讲一下插件的下载：

后面的两个表示两个模块都下载；

引入插件：

babel将其转化为当前环境支持代码，然后再通过uglify压缩：

5、复制文件夹任务：

这里是通过*选择了该src文件夹下的所有文件复制到了dist文件夹下：

6、多个任务依次执行：
上面我们都是通过gulp 任务名去执行相应的任务，而现在我们通过构建任务将其放入一个任务中执行：

且如果函数名为default的情况下，函数名可以省略直接写gulp 即会自动运行default函数；

3、package.json相关

上面我们所提到的node_modules存在以下问题:

而package.json文件的存在则能够解决该问题:

其中的-y表示生成package.json文件时的所有的询问都默认为yes；

main代表项目的主模块，license中的ISC表示代码开源，scripts表示命令的别名，如：

则在命令行工具中输入nodemon app.js与输入npm run build的效果是一样的；

如果此时项目中第三方模块，则json文件中会有相应的dependencies对象，其记录了项目所依赖的第三方模块：

这样我们在将项目copy给别人时不需要copy巨大的node_modules文件夹，对方只需在该文件夹下npm install则会自动安装package.json中所依赖的第三方模块；

了解了依赖的相关内容后，下面介绍项目依赖和开发依赖：

1、项目依赖：

如上面的记录则为项目依赖，下面示例也是：

2、开发依赖：


区分了两种依赖后，通过
会安装所有的依赖；

而通过

则只会安装dependencies而不安装devDependencies；

除了package.json文件外，还有一个package-lock.json文件，其作用如下：


记录了模块与模块之间的依赖关系、版本、模块的下载地址；

4、Node.js中模块加载的机制

1、路径完整时：

require方法根据模块路径查找模块，当输入的是完整路径时直接根据路径引入模块；

2、但如果输入路径完整但没有尾缀时，如下：


(1、先在当前路径(./)下找找有没有同名js文件 3、当前文件夹指的是find文件夹 3、如果main没有写也会报错)

3、输入没有路径没有后缀时：


(1、假设是系统模块，在系统模块下查找有无这样一个系统模块有的话就直接执行 2、找同名js文件时是在node_module下)