mirror of
https://gitee.com/many2many/java-web.git
synced 2025-01-11 14:40:55 +08:00
changed
This commit is contained in:
parent
7c3cf0eca6
commit
69c7b7a187
22
README.md
22
README.md
@ -47,11 +47,7 @@
|
||||
|
||||
## 3. [交互式web应用前端开发技术](./docs/chapter03.md)
|
||||
|
||||
### 3.1 前端开发技术趋势介绍 (了解)
|
||||
|
||||
#### 3.1.1 前端技术栈的演进
|
||||
|
||||
#### 3.1.2 前端框架和库的最新趋势
|
||||
### 3.1 前端开发技术的演进(了解)
|
||||
|
||||
### 3.2 响应式设计与Bootstrap
|
||||
|
||||
@ -59,15 +55,15 @@
|
||||
|
||||
#### 3.2.2 Bootstrap框架的使用 (了解)
|
||||
|
||||
### 3.3 异步编程与AJAX
|
||||
### 3.3 异步编程与AJAX(掌握)
|
||||
|
||||
#### 3.3.1 异步编程
|
||||
|
||||
#### 3.3.2 XMLHttpRequest对象的使用 (了解)
|
||||
|
||||
#### 3.3.3 Fetch API的使用 (掌握)
|
||||
#### 3.3.3 Fetch API的使用
|
||||
|
||||
#### 3.3.4 jQuery的AJAX API的使用 (掌握)
|
||||
#### 3.3.4 jQuery的AJAX API的使用
|
||||
|
||||
### 3.4 XML简介(掌握)
|
||||
|
||||
@ -78,8 +74,8 @@
|
||||
#### 3.4.3 XML的语法
|
||||
|
||||
#### 3.4.4 XML与Java对象的转换
|
||||
|
||||
#### 3.4.5 XML的最佳实践
|
||||
#### 3.4.5 JavaScript中处理XML
|
||||
#### 3.4.6 XML的最佳实践
|
||||
|
||||
### 3.5 JSON简介(掌握)
|
||||
|
||||
@ -90,8 +86,8 @@
|
||||
#### 3.5.3 JSON的语法
|
||||
|
||||
#### 3.5.4 JSON与Java对象的转换
|
||||
|
||||
#### 3.5.5 JSON的最佳实践
|
||||
#### 3.5.5 JavaScript中处理Json
|
||||
#### 3.5.6 JSON的最佳实践
|
||||
|
||||
### 3.6 JavaScript框架介绍 (了解)
|
||||
|
||||
@ -105,7 +101,7 @@
|
||||
#### 4.1.1 应用系统架构演进
|
||||
#### 4.1.2 服务器端渲染与客户端渲染
|
||||
### 4.2 MVC设计模式(掌握)
|
||||
#### 4.2.1 MVC模式概念
|
||||
#### 4.2.1 MVC概念
|
||||
#### 4.2.2 视图层、业务逻辑层和数据访问层的职责划分
|
||||
#### 4.2.3 使用MVC模式的优点
|
||||
#### 4.2.4 MVC模式的实现
|
||||
|
@ -1,8 +1,7 @@
|
||||
## 3. 交互式web应用前端开发技术
|
||||
|
||||
### 3.1 前端开发技术趋势介绍 (了解)
|
||||
### 3.1 前端开发技术的演进(了解)
|
||||
|
||||
#### 3.1.1 前端技术栈的演进
|
||||
- **早期阶段:** HTML、CSS 和 JavaScript 是构建网页的基本组成部分。
|
||||
- **Web 2.0时代:** 出现了更多的动态网页技术和框架,如 jQuery 和 Prototype。
|
||||
- **现代前端:** 进入了高度模块化和组件化的开发模式,出现了许多前端框架和库。
|
||||
@ -10,12 +9,6 @@
|
||||
- **任务运行器与打包工具:** gulp、webpack、parcel 等。
|
||||
- **构建工具:** babel、eslint 等。
|
||||
|
||||
#### 3.1.2 前端框架和库的最新趋势
|
||||
- **SPA (Single Page Application):** 单页面应用程序成为主流,它通过在不重新加载整个页面的情况下更新网页来提高用户体验。
|
||||
- **组件化:** 将界面分解成可复用的组件,有助于提高开发效率和代码复用。
|
||||
- **状态管理:** 如 Redux、Vuex 提供全局状态管理方案,帮助管理应用状态,特别是在大型应用中。
|
||||
- **服务端渲染 (SSR):** 改善首屏加载速度,有利于SEO优化,因为搜索引擎爬虫更容易解析渲染在服务器端的页面。
|
||||
- **前端自动化与持续集成:** 使用 CI/CD 工具提高开发效率,自动化测试和部署流程。
|
||||
|
||||
### 3.2 响应式设计与Bootstrap
|
||||
|
||||
@ -32,7 +25,7 @@ Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架
|
||||
|
||||
|
||||
|
||||
### 3.3 异步编程与AJAX
|
||||
### 3.3 异步编程与AJAX(掌握)
|
||||
|
||||
参考[ajax(PPT)](./resources/Ajax-heima.pptx)
|
||||
|
||||
@ -245,7 +238,7 @@ async function example() {
|
||||
// 发送请求
|
||||
xhr.send();
|
||||
```
|
||||
#### 3.3.3 Fetch API的使用 (掌握)
|
||||
#### 3.3.3 Fetch API的使用
|
||||
- **Fetch API:** 是一个现代替代 XMLHttpRequest 的 API,提供了更简洁的语法和基于 Promise 的接口。
|
||||
- **基本语法:** `fetch(url)`返回一个 Promise 对象。
|
||||
|
||||
@ -305,7 +298,7 @@ async function example() {
|
||||
- **处理响应:** 使用`.then()`处理响应,如`.json()`或`.text()`。
|
||||
- **错误处理:** 使用`.catch()`处理网络错误或其他异常。
|
||||
|
||||
#### 3.3.4 jQuery的AJAX API的使用 (掌握)
|
||||
#### 3.3.4 jQuery的AJAX API的使用
|
||||
- **$.ajax():** jQuery 的 AJAX 方法,提供简单的语法糖。
|
||||
- **$.get() 和 $.post():** 简化 GET 和 POST 请求的语法。
|
||||
- **$.getJSON():** 专门用于获取 JSON 数据的快捷方法。
|
||||
@ -439,9 +432,7 @@ async function example() {
|
||||
- **SAX (Simple API for XML)**: 一种基于事件的解析器,用于处理大型XML文档。
|
||||
- **StAX (Streaming API for XML)**: 类似于SAX,但提供了更好的性能和内存使用。
|
||||
|
||||
当然可以。以下是关于如何在JavaScript中处理XML的详细内容:
|
||||
|
||||
### 3.4.5 JavaScript中处理XML
|
||||
#### 3.4.5 JavaScript中处理XML
|
||||
|
||||
在JavaScript中处理XML文档通常涉及以下几个方面:
|
||||
|
||||
@ -586,7 +577,7 @@ try {
|
||||
- **Jackson**: 是一个流行的Java库,用于JSON的序列化和反序列化。
|
||||
- **Gson**: Google提供的用于JSON处理的Java库。
|
||||
|
||||
### 3.5.5 JavaScript中处理Json
|
||||
#### 3.5.5 JavaScript中处理Json
|
||||
|
||||
在JavaScript中,通常需要将JavaScript对象转换为JSON字符串,或者从JSON字符串解析出JavaScript对象。这个过程可以通过内置的`JSON.stringify()`和`JSON.parse()`方法来完成。
|
||||
|
||||
|
@ -45,17 +45,13 @@
|
||||
|
||||
### 4.2 MVC设计模式(掌握)
|
||||
|
||||
参考[MVC 架构详解](https://www.freecodecamp.org/chinese/news/the-model-view-controller-pattern-mvc-architecture-and-frameworks-explained/)
|
||||
|
||||
参考[MVC&&JavaBean(PPT)](./resources/JavaBean与JSP开发模型.pptx)
|
||||
|
||||
#### 4.2.1 MVC模式概念
|
||||
#### 4.2.1 MVC概念
|
||||
|
||||
- **MVC (Model-View-Controller)**:
|
||||
- **定义**: MVC是一种用于分离应用的输入、处理和输出的软件架构模式,以提高应用的模块化。
|
||||
- **模型 (Model)**: 负责数据和业务逻辑,是应用的状态。
|
||||
- **视图 (View)**: 负责展示数据(模型),是应用的界面。
|
||||
- **控制器 (Controller)**: 负责接收用户输入并调用模型和视图去完成用户的请求。
|
||||
|
||||
> MVC(Model-View-Controller)是一种强调分离软件的业务逻辑和显示的软件设计模式。这种模式的核心在于实现关注点的分离,即将应用程序分为三个核心组件:模型(Model)、视图(View)和控制器(Controller)。
|
||||
|
||||
#### 4.2.2 视图层、业务逻辑层和数据访问层的职责划分
|
||||
|
||||
@ -64,15 +60,19 @@
|
||||
- 通知视图数据变更。
|
||||
- 可以包含数据访问对象 (DAO) 和业务逻辑类。
|
||||
|
||||
> 模型是应用程序中用于处理数据逻辑的部分。它直接管理数据、逻辑和规则,并提供数据访问的接口。模型不依赖于视图和控制器,即它不关心数据将如何被显示或操作。
|
||||
|
||||
- **视图 (View)**:
|
||||
- 显示数据给用户。
|
||||
- 可以是JSP、HTML页面或使用模板引擎生成的页面。
|
||||
- 接收用户输入并传递给控制器。
|
||||
> 视图是应用程序中用于数据显示的部分。它实现了模型中数据的可视化。
|
||||
|
||||
- **控制器 (Controller)**:
|
||||
- 接收并解析用户输入。
|
||||
- 调用模型处理业务逻辑。
|
||||
- 选择视图并向用户展示结果。
|
||||
> 控制器是模型和视图之间的协调者。它接收用户的输入,并调用模型和视图去完成用户的请求。控制器的存在使得视图与模型能够分离.
|
||||
|
||||
#### 4.2.3 使用MVC模式的优点
|
||||
|
||||
@ -84,12 +84,18 @@
|
||||
|
||||
#### 4.2.4 MVC模式的实现
|
||||
|
||||
- **框架支持**: 许多Web框架如Spring MVC实现了MVC模式。
|
||||
- **流程**:
|
||||
1. 用户通过视图发送请求。
|
||||
2. 控制器接收请求并解析。
|
||||
3. 控制器调用模型进行处理。
|
||||
4. 模型更新后,控制器选择视图并返回响应。
|
||||
- **框架支持**: 许多Web应用开发框架都支持,比如spring mvc。
|
||||
|
||||
示例:典型的MVC模式的实现:jsp+servlet+javabean
|
||||
|
||||
![](./resources/imgs/jsp_javabean_mvc.jpg)
|
||||
|
||||
- JavaBean作为模型,既可以作为数据模型来封装业务数据,又可以作为业务逻辑模型来包含应用的业务操作。其中,数据模型用来存储或传递业务数据,而业务逻辑模型接收到控制器传过来的模型更新请求后,执行特定的业务逻辑处理,然后返回相应的执行结果。
|
||||
|
||||
- JSP作为视图层,负责提供页面为用户展示数据,提供相应的表单(Form)来用于用户的请求,并在适当的时候(点击按钮)向控制器发出请求来请求模型进行更新。
|
||||
|
||||
- Serlvet作为控制器,用来接收用户提交的请求,然后获取请求中的数据,将之转换为业务模型需要的数据模型,然后调用业务模型相应的业务方法进行更新,同时根据业务执行结果来选择要返回的视图。
|
||||
|
||||
|
||||
### 4.3 Servlet基础知识
|
||||
|
||||
@ -142,24 +148,31 @@
|
||||
|
||||
这个简单的`User`类遵循了JavaBean的规范,拥有两个属性`name`和`age`,以及对应的getter和setter方法。
|
||||
|
||||
- **与EJB的区别**:
|
||||
- JavaBeans通常是轻量级的,用于封装数据,而Enterprise JavaBeans (EJB) 是更重量级的企业级组件,包含业务逻辑,通常还涉及事务管理、安全性等方面。
|
||||
- JavaBeans可以在任何Java环境中使用,而EJB通常部署在应用服务器上。
|
||||
|
||||
- **总结**: JavaBean作为一种标准化的Java类,为数据的封装和组件的重用提供了便利。在Java Web开发中,JavaBeans常被用来处理数据传输和表单绑定的任务,是构建MVC架构的重要组成部分。
|
||||
|
||||
#### 4.3.2 Servlet基本概念和原理(掌握)
|
||||
#### 4.3.2 Servlet基本概念(掌握)
|
||||
|
||||
- **Servlet**:
|
||||
- 运行在服务器端的Java EE组件,生成动态响应。
|
||||
- 遵循Servlet API规范,实现javax.servlet.Servlet接口。
|
||||
**Servlet 的基本概念**
|
||||
- **定义:** Servlet(Java Servlet的简称)是一种基于Java的Web组件,它运行在服务器端,用于接收客户端(通常是Web浏览器)的请求、处理这些请求,并生成响应。Servlet遵循特定的Java API,这些API定义了Servlet必须实现的方法和行为。Servlet通常用于处理HTTP协议的请求和响应,但也可以处理其他类型的请求。
|
||||
- **生命周期:** Servlet 的生命周期包括初始化、服务请求和销毁三个阶段。Servlet 初始化时,容器会调用其 init() 方法;当请求到来时,容器会调用其 service() 或者 doGet(), doPost() 等方法;当 Servlet 不再需要时,容器会调用其 destroy() 方法。
|
||||
- **继承关系**: Servlet 类通常需要继承 javax.servlet.http.HttpServlet 类,并重写其中的 doGet() 或 doPost() 等方法来处理具体的 HTTP 请求。也可以直接实现 javax.servlet.Servlet 接口,但这在实际开发中较少见。
|
||||
|
||||
**Servlet的主要特点包括:**
|
||||
|
||||
* 基于Java:Servlet是用Java语言编写的,并且运行在支持Java的Web服务器或应用服务器上。
|
||||
|
||||
* 遵循Servlet API:Servlet实现了javax.servlet包中的Servlet接口,这个接口定义了所有Servlet必须遵守的生命周期方法,如init(), service(), destroy()等。
|
||||
|
||||
* 处理HTTP请求:Servlet主要用于处理HTTP请求,如GET、POST、PUT、DELETE等,但也可以处理其他类型的请求。
|
||||
|
||||
* 生成HTTP响应:Servlet可以生成HTTP响应,包括响应头、状态码和响应体。
|
||||
|
||||
* 运行在Web容器中:Servlet运行在Web容器(如Apache Tomcat、Jetty、WildFly)中,这些容器管理Servlet的生命周期,并负责将客户端请求路由到相应的Servlet。
|
||||
|
||||
* 可扩展性:Servlet API支持过滤器(Filters)、监听器(Listeners)和其他中间件组件,这些组件可以与Servlet一起工作,提供请求处理、事件处理和应用生命周期管理等功能。
|
||||
|
||||
* 平台无关性:由于Servlet是基于Java的,因此可以在任何支持Java的平台上运行,实现了跨平台的特性。
|
||||
|
||||
- **Servlet生命周期**:
|
||||
1. **实例化**: 容器创建Servlet实例。
|
||||
2. **初始化**: 调用init()方法。
|
||||
3. **服务**: 调用service()方法处理请求。
|
||||
4. **销毁**: 请求完成后,调用destroy()方法。
|
||||
5. **垃圾回收**: Servlet实例被容器回收。
|
||||
|
||||
#### 4.3.3 Servlet API (掌握)
|
||||
|
||||
|
@ -47,27 +47,22 @@
|
||||
|
||||
## 3. [交互式web应用前端开发技术](./docs/chapter03.md)
|
||||
|
||||
### 3.1 前端开发技术趋势介绍 (了解)
|
||||
|
||||
#### 3.1.1 前端技术栈的演进
|
||||
|
||||
#### 3.1.2 前端框架和库的最新趋势
|
||||
|
||||
### 3.1 前端开发技术的演进(了解)
|
||||
### 3.2 响应式设计与Bootstrap
|
||||
|
||||
#### 3.2.1 响应式设计的基本概念 (了解)
|
||||
|
||||
#### 3.2.2 Bootstrap框架的使用 (了解)
|
||||
|
||||
### 3.3 异步编程与AJAX
|
||||
### 3.3 异步编程与AJAX(掌握)
|
||||
|
||||
#### 3.3.1 异步编程
|
||||
|
||||
#### 3.3.2 XMLHttpRequest对象的使用 (了解)
|
||||
|
||||
#### 3.3.3 Fetch API的使用 (掌握)
|
||||
#### 3.3.3 Fetch API的使用
|
||||
|
||||
#### 3.3.4 jQuery的AJAX API的使用 (掌握)
|
||||
#### 3.3.4 jQuery的AJAX API的使用
|
||||
|
||||
### 3.4 XML简介(掌握)
|
||||
|
||||
@ -78,8 +73,9 @@
|
||||
#### 3.4.3 XML的语法
|
||||
|
||||
#### 3.4.4 XML与Java对象的转换
|
||||
#### 3.4.5 JavaScript中处理XML
|
||||
#### 3.4.6 XML的最佳实践
|
||||
|
||||
#### 3.4.5 XML的最佳实践
|
||||
|
||||
### 3.5 JSON简介(掌握)
|
||||
|
||||
@ -88,10 +84,9 @@
|
||||
#### 3.5.2 JSON的数据结构
|
||||
|
||||
#### 3.5.3 JSON的语法
|
||||
|
||||
#### 3.5.4 JSON与Java对象的转换
|
||||
|
||||
#### 3.5.5 JSON的最佳实践
|
||||
#### 3.5.5 JavaScript中处理Json
|
||||
#### 3.5.6 JSON的最佳实践
|
||||
|
||||
### 3.6 JavaScript框架介绍 (了解)
|
||||
|
||||
@ -105,7 +100,7 @@
|
||||
#### 4.1.1 应用系统架构演进
|
||||
#### 4.1.2 服务器端渲染与客户端渲染
|
||||
### 4.2 MVC设计模式(掌握)
|
||||
#### 4.2.1 MVC模式概念
|
||||
#### 4.2.1 MVC概念
|
||||
#### 4.2.2 视图层、业务逻辑层和数据访问层的职责划分
|
||||
#### 4.2.3 使用MVC模式的优点
|
||||
#### 4.2.4 MVC模式的实现
|
||||
|
Loading…
Reference in New Issue
Block a user