回首:
- javascript 可以在浏览器运行 (js代码会JavaScript的解析引擎执行)
- chrome ==》V8 (性能最好)
- FireFox ==》 奥丁猴
- safri ==》JSCore
- IE浏览器 ==》查克拉
- JavaScript可以在浏览器端操作DOM 和BOM
- 每一个浏览器都内置了BOM,DOM这样的API函数,所以浏览器中的js才可以调用他们
- 浏览器中JavaScript的运行环境
- V8引擎负责解析和执行js代码
- 内置API是由运行环境提供的特殊接口,只能在所属的运行环境中调用
-
- 总结:浏览器是JavaScript的前端运行环境
-
- JavaScript语法 +浏览器内置的API (DOM+BOM)+ jquery第三方库
复制代码 node.js:
node是让JavaScript运行在服务端上的情况
- Node.js是JavaScript的后端运行环境
- Node.js中无法调用BOM,DOM等浏览器内置的API
- Node.js它内置的API : fs,path,http...
- http://nodejs.cn/api/
复制代码 Node.js® 是一个基于 Chrome V8 引擎 的 JavaScript 运行时情况。
下载node:
下一步下一步安装就可以
检测是否安装乐成:
windows+R 打开运行 — 输入cmd —打开命令窗口
- node -v
- v16.15.0
- npm -v
- # 8.5.5 (安装node的同时 也安装了npm)
复制代码 出现版本号,说明安装乐成
如何学习node:
javascript基础语法 +Node.js内置API(fs,path,http) +第三方模块(express)
在node情况中运行js代码:
- 新建目次mycode,目次下新建01test.js文件
- let name = '张三'
- console.log(name)
- var arr = [11, 22, 33, 44, 55]
- arr.forEach((item) => {
- console.log(item)
- })
复制代码 - node情况下运行js代码(第一种)
- 打开js文件地点目次
- 在目次地址栏上输入cmd ,回车(确保命令窗口的地址是js文件的目次地址)
- 输入命令 node 01test.js (输入文件名按tab)
- node情况下运行js代码(第二种)
- 打开js文件地点目次
- 按住shift+右击 在此处打开powershell窗口
- 输入命令 node 01test.js (输入文件名按tab)
- node情况下运行js代码(第三种)
- 在vscode中 点击文件右击 打开集成终端
- 输入命令 node 01test.js (输入文件名按tab)
终端快捷键:
- 上键 快速定位到上一次执行命令
- tab 快速补全
- esc 清空当前输入命令
- cls 清空终端
复制代码 Node三大模块:
内置模块:
安装了node就会有,(Node官方提供 fs,http,path…)
fs:
- /**
- *fs文件系统模块 fs模块是NodeJS官方提供,用来操作文件的模块,它提供了一些列的方法和属性,满足用户对文件的需求
- * */
- // 2引入fs模块 来操作文件
- var fs = require('fs')
- /*
- fs.readFile(path[,options],callback)
- path 读取文件路径
- options 读取文件时采用的编码方式 utf-8
- callback 回调函数,可以拿到读取失败和成功的结果 err data
- */
- fs.readFile('./aa.txt', 'utf8', function (err, data) {
- // console.log(err) //null 读取成功-null 读取失败 err值为错误对象
- // console.log(data) //读取失败 值为undefined
- if (err) {
- return console.log('读取文件失败')
- }
- console.log(data)
- })
- // 写入文件
- /*
- fs.writeFile(file, data[, options], callback)#
- file 文件路径
- data要写入文件的数据
- options 写入文件时采用的编码方式 utf-8
- callback 回调函数 err写入成功和失败的信息
- */
- let content = '<h3>正在使用fs.writeFile写入文件内容</h3>'
- fs.writeFile('./index.html', content, function (err) {
- // console.log(err)
- if (err) {
- return console.log('文件写入失败')
- }
- console.log('文件写入成功')
- })
复制代码 path:
系统内置的路径模块,用于处置惩罚文件和目次的路径
- /*
- 系统内置的路径模块,用于处理文件和目录的路径
- */
- const path = require('path')
- // path.join() 方法使用平台特定的分隔符把全部给定的 path 片段连接到一起
- console.log(path.join('/foo', 'bar', 'baz/asdf', 'quux', '..'))
- console.log(__dirname) //当前文件目录名 绝对路径 //C:\丁鹿课堂\17期\08node\day01-node\mycode
- console.log(__filename) //C:\丁鹿课堂\17期\08node\day01-node\mycode\03path.js
复制代码 http:
Node.js提供了http模块,http模块主要用于搭建HTTP服务端,调用HTTP模块
- const http = require('http')
- const fs = require('fs')
- const url = require('url')
- /*
- url.parse() 方法会解析一个 URL 字符串并返回一个 URL 对象。
- */
- // 创建服务
- http
- .createServer(function (request, response) {
- // console.log(123)
- // 解析请求 包含文件名
- // console.log(request.url)
- var pathname = url.parse(request.url).pathname
- // console.log(pathname.substr(1))
- fs.readFile(pathname.substr(1), function (err, data) {
- if (err) {
- console.log(err)
- response.writeHead(404, { 'Content-Type': 'text/html' })
- } else {
- response.writeHead(200, { 'Content-Type': 'text/html' })
- // 响应文件内容
- response.write(data.toString())
- }
- // 发送响应数据
- response.end()
- })
- })
- .listen(8080)
- console.log('server running at http://127.0.0.1:8080')
复制代码 自界说模块:
自界说模块就是自己界说的模块
注意:
自界说模块中界说的方法,变量只能在当前的模块中使用
加载模块:require() 可以引入须要的内置模块,用户自界说模块,第三方模块
向外共享:每个js自界说模块中都有一个module对象,它内里存储了和当前模块有关的信息
界说模块aa.js:
- const arr = [11, 22, 33]
- // 向外暴露
- module.exports.arr = arr
复制代码 界说模块bb.js:
- const arr = [
- { name: '张三', age: 12 },
- { name: '李四', age: 22 },
- { name: '王五', age: 33 },
- ]
- module.exports.arr = arr
复制代码 index.js中使用两个模块:
- const arr1 = require('./aa.js')
- const arr2 = require('./bb.js')
- console.log(arr1)
- console.log(arr2)
复制代码 其他:
- let a = 10
- const fn = function () {
- console.log(123)
- }
- console.log(exports === module.exports) //true
- // exports.a = a
- // exports = {
- // a: a,
- // }
- // module.exports.fn = fn
- exports.a = a
- module.exports = {
- fn: fn,
- }
- /*
- module.exports单词写起来比较复杂,为了简化向外共享成员的代码,node提供了exports对象
- exports和module.exports指向的是同一个对象
- exports和module.exports指向不同的对象,以module.exports为准
- */
复制代码 第三方模块:
Node中的第三方模块(别人写好的模块) 又叫做包
包的来源:
不同于Node.JS的内置模块和自界说模块,包是由第三方个人和团队开发出来的,免费使用
为什么要使用包:
NodeJS提供的api开发效率低
基于内置模块封装出来,提供了更高级,更方便的API,极大的进步了工作效率
下载包:
国外的一家IT公司,叫做npm 这家公司的著名的网址https://www.npmjs.com/是举世最大的包共享平台
https://registry.npmjs.org/对外共享全部的包。我们可以从这个服务器下载自己所须要的包
- https://www.npmjs.com/ 网站上搜索自己所需要的包
- https://registry.npmjs.org/ 服务器上下载自己需要的包
复制代码 如何下载:
npm包管理工具
这个包管理工具随着node的安装一起被安装到了用户的电脑上
在终端输入 npm -v 检察自己电脑上安装的npm包管理工具的版本号
项目中如何下载包:
- npm install 包的完整名称
- 简写
- npm i 包的完整名称
复制代码 初次安装包完成,项目文件下多了一个叫做node_modules文件夹 和package-lock.json和package.json
- node_modules 存放所有已安装到项目中的包 require导入第三方模块包,就是从node_modules目录中查找并加载包
- package-lock.json 配置文件用来记录node_modules目录下每一个包的下载信息,包的名字,版本号,下载地址,不需要手动修改文件, npm包管理工具会自动维护它
复制代码 包管理设置文件:
npm规定,在项目目次中,必须提供一个叫做package.json的包管理设置文件,用来记录与项目有关的一些设置
- 项目名称,版本号,描述
- 项目中都用到了那些包
- 那些包只在开发期间调用
- 那些包在开发和部署时都须要用到
- npm init -y
- //该命令只能在英文的目录下成功运行
- dependencies 专门用来记录你使用npm install 命令安装了那些包
复制代码 一次性安装全部的包:
- npm i
- 或者
- npm install
- npm uninstall 包文件名 删除包s
复制代码 yarn:
全局安装yarn:
使用:
- yarn init
- yarn ad 包文件名
- yarn remove 包文件名
- yarn
- or
- yarn install 根据package.json文件为项目安装所有依赖
复制代码 安装指定版本的模块:
- yarn add 包名@3.0.1
- npm i 包名@3.0.1
复制代码 如何记录项目中安装了那些包:
dependencies:
package.json中有一个dependencies 节点,专门用来记录你使用npm install 命令安装了那些包
devdependencies:
有些包只在项目开发阶段会使用,在项目上线之后不会用到,建议把这些包记录到devdependencies 中(less)
有些包在项目开发阶段和项目上线之后都会用到建议把这些包记录到dependencies
- //记录到devdependencies节点中
- npm i 包名 -D
- 完整写法
- npm i 包名 --save-dev
复制代码 包的分类:
npm包管理工具下载的包,分为两大类:
- 项目包
哪些被安装到项目标node_modules目次中的包,都是项目包
- 开发依赖包(记录到devdependencies节点中的包,只在开发阶段会用到)
- 核心依赖包记录到dependencies节点中的包,在开发阶段和项目上线之后都会用到)
- 全局包
指向npm i 命令提供了 -g 参数,安装的就是全局包
全局包被安装在C:\Users\54004\AppData\Roaming\npm\node_modules只有工具性质的包,才有全局安装的须要性
模块化:
什么是模块化:
模块化是指解决一个复杂的问题时,自顶向下逐层把系统划分为若干模块的过程
编程范畴的模块化:
(一个js文件就是一个模块)
遵守固定的原则,把一个大文件拆成独立的多个模块
- 进步了代码的复用性
- 进步了代码的可维护性
- 可以实现按需加载
模块化的规范:
模块化的规范就是对代码举行模块化的拆分和组合时,须要遵守的规则
- 如何引入模块
- 在模块中使用什么样的语法向外暴露成员
NodeJS中的模块化规范:
Node.js遵循了CommonJS模块化规范,Commonjs规定了模块的特性和各模块之间如何相互依赖
CommonJS规定:
- 每个模块内容,module变量代表当前模块
- module变量是一个对象,它的exports属性(module.exports)是对外的接口
- 加载某个模块,其实就是加载模块的module.exports属性,require方法用于加载模块
ES6模块:
前端模块化分类:
es6模块化诞生之前,js社区实行提出了AMD,CMD,Commonjs模块化规范
AMD,CMD实用于浏览器端的JavaScript模块化规范
Commonjs实用于服务器端的JavaScript模块化
Es6既实用于浏览器端也实用于服务器端
ES6模块化规范界说:
- 每个js文件都是一个独立的模块
- 导入别的模块成员使用 import
- 向外共享模块成员 实用 export
默认导出:
export default 默认导出的成员
注意:每个模块中,只允许使用唯一的一次export defaut ,否则会报错
- var a = 10
- function show() {}
- const arr = [11, 22, 33]
- export default {
- a,
- show,
- }
复制代码 默认导入:
默认导入的时间接收名称可以是恣意名称,只要是合法的成员名称就可以
- // 导入export default 向外共享的成员
- import aa from './01test.js'
- console.log(aa) //{ a: 10, show: [Function: show] }
复制代码 按需导入:
- import aa, { s as ss, say, s1 } from './03test.js'
- console.log(ss, say, s1)
- console.log(aa)
复制代码 按需导出:
- var a = 12
- function show() {}
- const arr = [11, 22, 333]
- // 按需导出
- export let s = 'aaa'
- export function say() {}
- export let s1 = true
- export default {
- a,
- show,
- arr,
- }
复制代码 按需导入和按需导出的注意事项:
- 每个模块中可以使用多次按需导出
- 按需导入的成员必须和按需导出的名称保持一致
- 按需导入时,可以使用as举行重命名
- 按需导入可以和默认导入一起使用
直接导入并 实行模块中的代码:
如果只想单纯的指向某个模块中的代码,并不须要得到模块中向外共享的成员
- for (let i = 0; i < 3; i++) {
- console.log(i)
- }
复制代码 test.js’
console.log(ss, say, s1)
console.log(aa)
var a = 12
function show() {}
const arr = [11, 22, 333]
// 按需导出
export let s = ‘aaa’
export function say() {}
export let s1 = true
export default {
a,
show,
arr,
}
- #### 按需导入和按需导出的注意事项:
- - 每个模块中可以使用多次按需导出
- - 按需导入的成员必须和按需导出的名称保持一致
- - 按需导入时,可以使用as进行重命名
- - 按需导入可以和默认导入一起使用
- #### 直接导入并 执行模块中的代码:
- > 如果只想单纯的指向某个模块中的代码,并不需要得到模块中向外共享的成员
复制代码 for (let i = 0; i < 3; i++) {
console.log(i)
}
- [/code] import ‘./06test.js’
- [code]
复制代码 免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。 |