掌握了哪些技术?
HTML、CSS、JavaScript
浏览器中的 JavaScript 的组成部分?
思考:为什么 JavaScript 可以在浏览器中被执行
JS代码之所以能够在浏览器中运行,是因为浏览器中它嵌入了一种JavaScript引擎(在这里我们把JavaScript引擎称为JS引擎,又称为:JavaScript虚拟机),而JS引擎它可以把JS代码解析成浏览器能够识别的代码,因此JS代码可以在含有JS引擎的浏览器中运行。
不同的浏览器使用不同的 JavaScript 解析引擎:
其中,Chrome 浏览器的 V8 解析引擎性能最好!
思考:为什么 JavaScript 可以操作 DOM 和 BOM
每个浏览器都内置了 DOM、BOM 这样的 API 函数,因此,浏览器中的 JavaScript 才可以调用它们。
浏览器的 JavaScript 运行环境
运行环境是指代码正常运行所需的必要环境。
总结:
思考:JavaScript 能否做后端开发
JavaScript可以写后端。JavaScript可以通过Node.js技术来实现后端开发,Node.js是一个让JavaScript运行在服务端的开发平台。
什么是 Node.js
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
Node.js 的官网地址: https://nodejs.org/zh-cn
注意:
Node.js 可以做什么
Node.js 作为一个 JavaScript 的运行环境,仅仅提供了基础的功能和 API。然而,基于 Node.js 提供的这些基础能,很多强大的工具和框架如雨后春笋,层出不穷,所以学会了 Node.js ,可以让前端程序员胜任更多的工作和岗位:
总之:Node.js 是大前端时代的“大宝剑”,有了 Node.js 这个超级 buff 的加持,前端程序员的行业竞争力会越来越强!
安装包可以从 Node.js 的官网首页(https://nodejs.org/en/)直接下载
区分 LTS 版本和 Current 版本的不同
查看已安装的 Node.js 的版本号
打开终端,在终端输入命令 node –v 后,按下回车键,即可查看已安装的 Node.js 的版本号。
步骤:
终端中的快捷键
在 Windows 的 powershell 或 cmd 终端中,我们可以通过如下快捷键,来提高终端的操作效率:
fs 模块是 Node.js 官方提供的、用来操作文件的模块。它提供了一系列的方法和属性,用来满足用户对文件的操作需求。
例如:
如果要在 JavaScript 代码中,使用 fs 模块来操作文件,则需要使用如下的方式先导入它:
const fs = require("fs")
如果出现了以下提示,不用管
var require: NodeRequire
(id: string) => any
文件是 CommonJS 模块; 它可能会转换为 ES 模块。
使用 fs.readFile() 方法,可以读取指定文件中的内容,语法格式如下:
fs.readFile(path[,options],callback)
参数解读:
文件夹框架
示例代码
以 utf8 的编码格式,读取指定文件的内容,并打印 err 和 dataStr 的值:
const fs = require("fs")
fs.readFile('./files/test.txt', 'utf8', function (err, dataStr) {
// 打印失败结果
console.log(err);
console.log('-------');
// 打印成功结果
console.log(dataStr);
})
执行test.js代码:直接定位到当前文件所处目录,在空白处,shift + 鼠标右键,点击“在此处打开PowerShell 窗口”打开终端并输入命令。
运行成功结果:
PS D:\code> node test.js
null
-------
11
PS D:\code>
运行失败结果:
PS D:\code> node test.js
[Error: ENOENT: no such file or directory, open 'D:\code\files\test1.txt'] {
errno: -4058,
code: 'ENOENT',
syscall: 'open',
path: 'D:\\code\\files\\test1.txt'
}
-------
undefined
PS D:\code>
判断文件是否读取成功
可以判断 err 对象是否为 null,从而知晓文件读取的结果:
const fs = require('fs')
fs.readFile('./files/test.txt', 'utf8', function (err, dataStr) {
if(err){
return console.log('文件读取失败!' +err.message);
}
console.log('文件读取成功,内容是:'+ dataStr);
})
运行成功/失败结果:
PS D:\code> node test.js
文件读取失败!ENOENT: no such file or directory, open 'D:\code\files\test1.txt'
PS D:\code> node test.js
文件读取成功,内容是:11
PS D:\code>
使用 fs.writeFile() 方法,可以向指定的文件中写入内容,语法格式如下:
fs.writeFile(file,data[,option],callback)
参数解读:
示例代码
向指定的文件路径中,写入文件内容:
const fs = require('fs')
fs.writeFile('./files/test.txt', 'Hello Node.js', function (err) {
// 如果文件写入成功,则 err 的值等于一个null
// 如果文件写入失败,则 err的值等于一个错误对象
console.log(err);
})
运行成功结果:
PS D:\code> node test.js
null
PS D:\code>
注意:
判断文件是否写入成功
可以判断 err 对象是否为 null,从而知晓文件写入的结果:
fs.writeFile('./files/test.txt', 'Hello Node.js', function (err) {
if(err){
return console.log('文件写入失败!'