2024年Web前端最全Node(18)，达内web开发培训班

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

const route=‘/a/b/c/test.js’

let textName=path.basename(route)

console.log(textName)

//结果test.js

let name=path.basename(route,‘.js’)

console.log(name)

//结果test

4. 获取文件扩展名path.extname()

const route=‘/a/b/c/test.js’

let extName=path.extname(route)

console.log(extName)

//结果.js

5. 示例：提取一个html文件，并将其改为外联式后重新存储

//引入模块fs

const fs=require(‘fs’)

//引入模块path

const path=require(‘path’)

//定义正则表达式

const styleReg=/

const scriptReg=/

//拿到HTNL文件内容

fs.readFile(path.join(__dirname,‘./test/test.html’),‘utf-8’,function(err,datastr){

if(err){

return console.log(‘读取出错’,err.message)

}

//解析CSS，JS，重写HTML

resolveCSS(datastr)

resolveJS(datastr)

resolveHTML(datastr)

})

function resolveCSS(htmlstr){

//匹配内容

let str1=styleReg.exec(htmlstr)

//删除样式标签

let newStr1=str1[0].replace(‘’,‘’)

//重写CSS文件

fs.writeFile(path.join(__dirname,‘./test/css.txt’),newStr1,‘utf-8’,function(err){

if(err){

console.log(‘写入css出错’,err.message);

}else{

console.log(‘写入CSS成功’);

}

})

}

function resolveJS(htmlstr){

let str2=scriptReg.exec(htmlstr)

let newStr2=str2[0].replace(‘’,‘’)

fs.writeFile(path.join(__dirname,‘./test/js.txt’),newStr2,‘utf-8’,function(err){

if(err){

console.log(‘写入JS出错’,err.message);

}else{

console.log(‘写入JS成功’);

}

})

}

function resolveHTML(htmlstr){

//更改内部式为外链式

let str3=htmlstr.replace(styleReg,‘’).replace(scriptReg,‘’)

//重写HTMl

fs.writeFile(path.join(__dirname,‘./test/index.html’),str3,‘utf-8’,function(err){

if(err){

console.log(‘写入HTML文件成功’,err.message);

}else{

console.log(‘写入HTML文件成功’);

}

})

}

http模块

=========================================================================

网络基础知识

---

1. ip地址：互联网中每台WEB服务器都有唯一ip地址

2. 域名和域名服务器

ip地址太长并且无语义化，所以出现了域名，域名服务器就是将域名和ip两者进行转换

3. 端口号

一台服务器有成百上千服务，每个端口号就对应一个服务

注：一个端口一个服务，80端口可以省略

创建WEB服务器

---

1. 先调用内部模块require(‘http’)

2. 创建服务http.createServer()

3. 打开监听server.listen()

示例：

//调用内部模板

const http=require(‘http’)

//创建服务

const server=http.createServer()

//服务启动

server.on(‘request’,function(req,res){

console.log(‘someone visit our web server’)

})

//调用监听

server.listen(80,function(){

comsole.log(‘server running at http://127.0.0.1:80’)

})

//在浏览器输入 http://127.0.0.1:80会响应，但没内容

4. req请求对象包含与客户端相关的数据和属性

const http=require(‘http’)

const server=http.createServer()

serner.on(‘request’,(req)=>{

let url=req.url

let method=req.method

let str=you request url is${url},request method is${method}

console.log(str)

})

server.listen(80,function(){

comsole.log(‘server running at http://127.0.0.1:80’)

})

//当浏览器输入http://127.0.0.1:80/index.html时，控制台输入you request url is index.html,request method is get

5. res响应对象，向客户端传输内容

const http=require(‘http’)

const server=http.createServer()

serner.on(‘request’,(req，res)=>{

let url=req.url

let method=req.method

let str=you request url is${url},request method is${method}

console.log(str)

res.end(str)

})

server.listen(80,function(){

comsole.log(‘server running at http://127.0.0.1:80’)

})

//当浏览器输入http://127.0.0.1:80/index.html时，控制台输入you request url is index.html,request method is get,浏览器输出you request url is index.html,request method is get

6. 调用res.end(),会出现乱码问题，需要前加入

res.setHeader(‘Content-Type’,‘text/html;charset=utf-8’)

7. 根据不同的url地址响应不同的html内容

• 获取请求的url地址

• 设置默认响应内容为404 Not found

• 判断用户的请求

• 防止乱码

• 使用res.end()将内容给客户端

const http=require(‘http’)

const server=http.createServer()

server.on(‘request’,(req，res)=>{

let url=req.url

let content=‘

404 Not found!

’

if(url===‘/’||url===‘/index.html’){

content=<h1>关于页面</h1>

}

res.setHeader(‘Content-Type’,‘text/html;charset=utf-8’)

res.end(content)

})

server.listen(80,function(){

comsole.log(‘server running at http://127.0.0.1:80’)

})

基础学习：

前端最基础的就是 HTML , CSS 和 JavaScript 。

网页设计：HTML和CSS基础知识的学习

HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

动态交互：JavaScript基础的学习

JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

目实战+最新讲解视频】](https://bbs.csdn.net/topics/618166371)**

[外链图片转存中…(img-Y2zZ0rHa-1714829654180)]

CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

[外链图片转存中…(img-lZq7cngr-1714829654181)]

动态交互：JavaScript基础的学习

JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

[外链图片转存中…(img-YUuKyJAG-1714829654181)]