本文全面介绍了Java全栈教程,涵盖从基础语法到高级框架的各个方面,帮助读者从零开始掌握Java全栈开发技能。内容包括环境搭建、面向对象编程、前后端技术、常用工具和实战项目演练,旨在提升开发者的综合能力。
Java基础入门Java简介及环境搭建
Java是一种高级编程语言,由Sun Microsystems(现为Oracle公司)开发。它具有跨平台性,可以编写一次,到处运行,这使得Java成为后端和全栈开发的热门选择。Java开发环境搭建主要包括安装JDK(Java Development Kit)和配置环境变量。
步骤一:下载JDK
访问Oracle官方网站的Java SE下载页面,选择合适的JDK版本进行下载。Windows用户可以选择.exe安装包,Linux用户可以选择.tar.gz压缩包,而macOS用户可以选择.dmg安装包。
步骤二:安装JDK
对于Windows用户,运行下载的.exe安装包,按照提示完成安装。对于Linux和macOS用户,解压下载的压缩包,并将解压后的目录移动到指定位置。
步骤三:配置环境变量
编辑系统环境变量,将JDK的bin目录路径添加到PATH变量中。例如,在Windows上,可以在系统环境变量中添加新的变量,命名为JAVA_HOME
,其值为JDK的安装路径;然后在Path
环境变量中添加 %JAVA_HOME%\bin
。
# Windows示例
set JAVA_HOME=C:\Program Files\Java\jdk-11.0.2
set PATH=%JAVA_HOME%\bin;%PATH%
# Linux或macOS示例
export JAVA_HOME=/usr/lib/jvm/jdk-11.0.2
export PATH=$JAVA_HOME/bin:$PATH
安装完成后,可以通过命令行运行java -version
来检查安装是否成功。
Java语法基础
Java语法基础涵盖变量、数据类型、条件语句、循环语句、数组等。
变量与类型
在Java中,变量是用来存储数据的容器,每个变量都有一个类型,该类型决定了变量可以存储的数据类型和大小。
public class VariableExample {
public static void main(String[] args) {
int age = 25; // 整型变量
double salary = 5000.5; // 双精度浮点型变量
boolean isStudent = true; // 布尔型变量
String name = "Alice"; // 字符串变量
System.out.println("Age: " + age);
System.out.println("Salary: " + salary);
System.out.println("Is Student: " + isStudent);
System.out.println("Name: " + name);
}
}
条件语句
Java中使用if
、else
和switch
语句来实现条件判断。
public class ConditionExample {
public static void main(String[] args) {
int num = 10;
if (num > 0) {
System.out.println("Positive number.");
} else if (num < 0) {
System.out.println("Negative number.");
} else {
System.out.println("Zero.");
}
// switch语句
switch (num) {
case 0: System.out.println("Zero."); break;
case 10: System.out.println("Ten."); break;
default: System.out.println("Other number.");
}
}
}
循环语句
Java中的循环语句包括for
、while
和do-while
。
public class LoopExample {
public static void main(String[] args) {
// for循环
for (int i = 0; i < 5; i++) {
System.out.println("For loop: " + i);
}
// while循环
int j = 0;
while (j < 5) {
System.out.println("While loop: " + j);
j++;
}
// do-while循环
int k = 0;
do {
System.out.println("Do-while loop: " + k);
k++;
} while (k < 5);
}
}
数组
Java中的数组是一种可以存储同一类型多个元素的数据结构。
public class ArrayExample {
public static void main(String[] args) {
// 声明和初始化数组
int[] numbers = new int[5];
numbers[0] = 10;
numbers[1] = 20;
numbers[2] = 30;
numbers[3] = 40;
numbers[4] = 50;
// 遍历数组
for (int i = 0; i < numbers.length; i++) {
System.out.println("Number " + i + ": " + numbers[i]);
}
// 使用for-each循环遍历数组
for (int number : numbers) {
System.out.println("Number: " + number);
}
}
}
Java面向对象编程
Java是一种面向对象的语言,面向对象编程(OOP)是Java的核心。面向对象编程的几个关键概念包括类、对象、封装、继承和多态。
类与对象
类是面向对象编程的基本单元,可以理解为一个模板,用于定义对象的结构和行为。对象是类的一个实例。
public class Car {
String color;
int speed;
public Car(String color, int speed) {
this.color = color;
this.speed = speed;
}
public void displayInfo() {
System.out.println("Car color: " + color + ", Speed: " + speed);
}
}
public class ObjectExample {
public static void main(String[] args) {
Car myCar = new Car("Red", 60);
myCar.displayInfo();
}
}
封装
封装是指将数据(字段)和操作数据的方法封装在一起,隐藏内部实现细节,只暴露必要的接口。
public class Person {
private String name;
private int age;
public Person(String name, int age) {
this.name = name;
this.age = age;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
public class EncapsulationExample {
public static void main(String[] args) {
Person person = new Person("Alice", 25);
person.setAge(26);
System.out.println("Name: " + person.getName() + ", Age: " + person.getAge());
}
}
继承
继承允许一个类(子类)继承另一个类(父类)的属性和方法,从而提高代码的复用性。
public class Animal {
public void eat() {
System.out.println("Animal is eating.");
}
}
public class Dog extends Animal {
public void bark() {
System.out.println("Dog is barking.");
}
}
public class InheritanceExample {
public static void main(String[] args) {
Dog myDog = new Dog();
myDog.eat();
myDog.bark();
}
}
多态
多态允许子类重写父类的方法,实现不同的行为。
public class Animal {
public void makeSound() {
System.out.println("Animal makes sound.");
}
}
public class Dog extends Animal {
@Override
public void makeSound() {
System.out.println("Dog barks.");
}
}
public class PolymorphismExample {
public static void main(String[] args) {
Animal myPet = new Dog();
myPet.makeSound();
}
}
常用API使用介绍
Java提供了大量的API,用于完成各种功能。这里介绍一些常用的API。
Math类
Math
类提供了基本的数学函数,如绝对值、平方根、对数等。
public class MathExample {
public static void main(String[] args) {
int absValue = Math.abs(-10);
double squareRoot = Math.sqrt(16);
double logValue = Math.log(10);
System.out.println("Absolute value: " + absValue);
System.out.println("Square root: " + squareRoot);
System.out.println("Logarithm: " + logValue);
}
}
String类
String
类用于处理字符串,提供了丰富的字符串操作方法。
public class StringExample {
public static void main(String[] args) {
String str = "Hello, World!";
int length = str.length();
String upperCase = str.toUpperCase();
String lowerCase = str.toLowerCase();
String trimmed = str.trim();
boolean startsWith = str.startsWith("Hello");
boolean endsWith = str.endsWith("World!");
System.out.println("Length: " + length);
System.out.println("Upper case: " + upperCase);
System.out.println("Lower case: " + lowerCase);
System.out.println("Trimmed: " + trimmed);
System.out.println("Starts with Hello: " + startsWith);
System.out.println("Ends with World! : " + endsWith);
}
}
ArrayList类
ArrayList
是Java中常用的动态数组,可以动态增删元素。
import java.util.ArrayList;
public class ArrayListExample {
public static void main(String[] args) {
ArrayList<String> names = new ArrayList<>();
names.add("Alice");
names.add("Bob");
names.add("Charlie");
for (String name : names) {
System.out.println(name);
}
names.remove("Bob");
System.out.println("After removing Bob:");
for (String name : names) {
System.out.println(name);
}
}
}
Collections类
Collections
类提供了对集合的操作方法,如排序、查找等。
import java.util.ArrayList;
import java.util.Collections;
public class CollectionsExample {
public static void main(String[] args) {
ArrayList<Integer> numbers = new ArrayList<>();
numbers.add(3);
numbers.add(1);
numbers.add(4);
numbers.add(1);
numbers.add(5);
numbers.add(9);
Collections.sort(numbers);
System.out.println("Sorted numbers: " + numbers);
int index = Collections.binarySearch(numbers, 4);
System.out.println("Index of 4: " + index);
}
}
Web前端技术入门
HTML与CSS基础
HTML(HyperText Markup Language)用于定义网页的结构和内容,而CSS(Cascading Style Sheets)用于设计网页的样式。
HTML基础
HTML文档由元素组成,每个元素由标签表示。常见的标签包括<html>
、<head>
、<body>
、<p>
、<div>
、<span>
等。
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Welcome to My First Page</h1>
<p>This is my first paragraph.</p>
<div>
<span>This is a span element.</span>
</div>
</body>
</html>
CSS基础
CSS通过选择器来定义样式,常见的选择器包括标签选择器、ID选择器、类选择器等。
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: lightblue;
}
h1 {
color: navy;
font-size: 36px;
}
p, div {
color: green;
font-size: 18px;
}
#unique {
color: red;
}
.special {
font-weight: bold;
}
</style>
</head>
<body>
<h1>Welcome to My First Page</h1>
<p>This is my first paragraph.</p>
<div>
<span id="unique">This is a unique span.</span>
<span class="special">This is a special span.</span>
</div>
</body>
</html>
CSS高级
CSS还可以通过伪类和伪元素来扩展样式,如:hover
、:first-child
等。
<!DOCTYPE html>
<html>
<head>
<style>
p:hover {
color: red;
}
.demo:first-child {
font-weight: bold;
}
</style>
</head>
<body>
<p>This is a paragraph.</p>
<p class="demo">This is a demo paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
JavaScript入门
JavaScript是一种脚本语言,用于实现网页的交互功能。JavaScript可以嵌入在HTML页面中,也可以独立运行。
基本语法
JavaScript的基本语法包括变量、数据类型、条件语句、循环语句等。
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Example</title>
</head>
<body>
<script>
let num = 10;
let str = "Hello, World!";
let isTrue = true;
if (num > 0) {
console.log("Positive number.");
} else {
console.log("Negative or zero.");
}
for (let i = 0; i < 5; i++) {
console.log("Loop " + i);
}
console.log("Number: " + num);
console.log("String: " + str);
console.log("Boolean: " + isTrue);
</script>
</body>
</html>
DOM操作
DOM(Document Object Model)是网页的结构模型,JavaScript可以通过DOM操作网页元素。
<!DOCTYPE html>
<html>
<head>
<title>DOM Example</title>
</head>
<body>
<p id="demo">This is a demo paragraph.</p>
<button id="changeText">Change Text</button>
<script>
document.getElementById("changeText").addEventListener("click", function() {
document.getElementById("demo").innerHTML = "Text changed!";
});
</script>
</body>
</html>
事件处理
JavaScript可以用来处理用户交互事件,如点击、鼠标悬停等。
<!DOCTYPE html>
<html>
<head>
<title>Event Example</title>
</head>
<body>
<button id="clickMe">Click Me</button>
<script>
document.getElementById("clickMe").addEventListener("click", function() {
alert("Button clicked!");
});
</script>
</body>
</html>
异步操作
JavaScript支持异步操作,如异步加载数据、延迟执行等。
<!DOCTYPE html>
<html>
<head>
<title>Async Example</title>
</head>
<body>
<button id="loadData">Load Data</button>
<script>
document.getElementById("loadData").addEventListener("click", function() {
fetch("https://api.example.com/data")
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
});
</script>
</body>
</html>
常用前端框架介绍
前端框架如Vue.js、React等提供了更高效、更灵活的方式来构建动态网页。
Vue.js
Vue.js是一个渐进式前端框架,易于上手且功能强大。
<!DOCTYPE html>
<html>
<head>
<title>Vue.js Example</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
<div id="app">
{{ message }}
</div>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello, Vue.js!'
}
});
</script>
</body>
</html>
React
React是一个由Facebook开发的JavaScript库,用于构建用户界面。
<!DOCTYPE html>
<html>
<head>
<title>React Example</title>
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
<div id="app"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello, React!</h1>,
document.getElementById('app')
);
</script>
</body>
</html>
实际项目示例
使用Vue.js或React构建一个简单的动态应用,如待办事项列表。
<!DOCTYPE html>
<html>
<head>
<title>Todo List</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
<div id="app">
<h1>Todo List</h1>
<input v-model="newTodo" placeholder="Add a new todo" @keyup.enter="addTodo">
<ul>
<li v-for="todo in todos" :key="todo.id">
<span>{{ todo.text }}</span>
<button @click="removeTodo(todo)">Remove</button>
</li>
</ul>
</div>
<script>
new Vue({
el: '#app',
data: {
newTodo: '',
todos: [
{ id: 1, text: 'Learn Vue.js' },
{ id: 2, text: 'Build a project' }
]
},
methods: {
addTodo() {
if (this.newTodo) {
this.todos.push({
id: this.todos.length + 1,
text: this.newTodo
});
this.newTodo = '';
}
},
removeTodo(todo) {
this.todos.splice(this.todos.indexOf(todo), 1);
}
}
});
</script>
</body>
</html>
Java后端开发
Java Web开发基础
Java Web开发主要是使用Java语言实现服务器端的功能,包括处理HTTP请求、发送HTTP响应等。
Servlet与JSP
Servlet是Java Web中的一个核心组件,用于处理HTTP请求并生成响应。JSP(JavaServer Pages)是一种动态网页技术,可以嵌入Java代码。
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class HelloWorldServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
response.getWriter().println("<h1>Hello, World!</h1>");
}
}
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>My First JSP Page</title>
</head>
<body>
<h1>Welcome to My First JSP Page</h1>
<%
out.println("<p>This is a server-side generated paragraph.</p>");
%>
</body>
</html>
Spring框架入门
Spring是一个流行的Java框架,提供了丰富的功能,如依赖注入(DI)、面向切面编程(AOP)等。
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
public class HelloWorldController {
@GetMapping("/hello")
public String hello() {
return "Hello, Spring!";
}
}
Spring Boot应用示例
Spring Boot简化了Spring应用的开发流程,支持自动配置和嵌入式Servlet容器。
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
}
@RestController
public class HelloWorldController {
@GetMapping("/hello")
public String hello() {
return "Hello, Spring Boot!";
}
}
RESTful API设计与实现
RESTful API是一种基于HTTP协议的API设计风格,用于构建可扩展的、松耦合的系统。
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.Arrays;
import java.util.List;
@RestController
@RequestMapping("/api")
public class UserController {
@GetMapping("/users")
public List<User> getUsers() {
return Arrays.asList(
new User(1, "Alice", 25),
new User(2, "Bob", 30)
);
}
}
class User {
private int id;
private String name;
private int age;
public User(int id, String name, int age) {
this.id = id;
this.name = name;
this.age = age;
}
public int getId() {
return id;
}
public String getName() {
return name;
}
public int getAge() {
return age;
}
}
数据库连接与操作
数据库是存储和管理数据的系统,Java可以通过JDBC(Java Database Connectivity)连接数据库。
JDBC连接
JDBC提供了一套标准的接口和类,用于数据库的连接和操作。
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
public class JdbcExample {
public static void main(String[] args) {
try {
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/mydb", "root", "password");
Statement stmt = conn.createStatement();
ResultSet rs = stmt.executeQuery("SELECT * FROM users");
while (rs.next()) {
System.out.println(rs.getString("name") + ", " + rs.getInt("age"));
}
rs.close();
stmt.close();
conn.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
事务管理
事务管理确保了数据库操作的完整性和一致性。
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
public class TransactionExample {
public static void main(String[] args) {
try {
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/mydb", "root", "password");
conn.setAutoCommit(false);
PreparedStatement stmt1 = conn.prepareStatement("INSERT INTO users (name, age) VALUES (?, ?)");
stmt1.setString(1, "Alice");
stmt1.setInt(2, 25);
stmt1.executeUpdate();
PreparedStatement stmt2 = conn.prepareStatement("INSERT INTO users (name, age) VALUES (?, ?)");
stmt2.setString(1, "Bob");
stmt2.setInt(2, 30);
stmt2.executeUpdate();
conn.commit();
} catch (Exception e) {
e.printStackTrace();
}
}
}
ORM框架
ORM(Object-Relational Mapping)框架如Hibernate和MyBatis,用于将对象映射到关系型数据库。
import org.hibernate.Session;
import org.hibernate.SessionFactory;
import org.hibernate.cfg.Configuration;
public class HibernateExample {
public static void main(String[] args) {
SessionFactory sessionFactory = new Configuration().configure().buildSessionFactory();
Session session = sessionFactory.openSession();
User user = new User("Alice", 25);
session.beginTransaction();
session.save(user);
session.getTransaction().commit();
session.close();
sessionFactory.close();
}
}
常用工具与框架
Git版本控制工具
Git是一种分布式版本控制系统,用于源代码的版本控制和协作开发。
# 初始化Git仓库
git init
# 添加文件到仓库
git add .
# 提交更改
git commit -m "Initial commit"
# 查看当前状态
git status
# 查看提交历史
git log
版本控制流程
# 分支管理
git branch feature-branch
git checkout feature-branch
git merge feature-branch
git push origin feature-branch
# 解决冲突
git checkout --ours file-with-conflict
git checkout --theirs file-with-conflict
Maven与Gradle构建工具
Maven和Gradle是Java项目的构建工具,用于管理依赖、编译代码、打包发布等。
Maven
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.example</groupId>
<artifactId>demo</artifactId>
<version>1.0-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<version>2.2.2.RELEASE</version>
</dependency>
</dependencies>
</project>
Gradle
apply plugin: 'java'
apply plugin: 'eclipse'
repositories {
mavenCentral()
}
dependencies {
compile 'org.springframework.boot:spring-boot-starter-web:2.2.2.RELEASE'
}
MyBatis与Hibernate ORM框架
MyBatis和Hibernate是ORM框架,用于简化数据库操作的复杂性。
MyBatis
<configuration>
<environments default="development">
<environment id="development">
<transactionManager type="JDBC"/>
<dataSource type="POOLED">
<property name="driver" value="com.mysql.jdbc.Driver"/>
<property name="url" value="jdbc:mysql://localhost:3306/mydb"/>
<property name="username" value="root"/>
<property name="password" value="password"/>
</dataSource>
</environment>
</environments>
<mappers>
<mapper resource="com/example/UserMapper.xml"/>
</mappers>
</configuration>
<mapper namespace="com.example.UserMapper">
<select id="getUser" resultType="com.example.User">
SELECT * FROM users WHERE id = #{id}
</select>
</mapper>
Hibernate
import org.hibernate.Session;
import org.hibernate.SessionFactory;
import org.hibernate.cfg.Configuration;
public class HibernateExample {
public static void main(String[] args) {
SessionFactory sessionFactory = new Configuration().configure().buildSessionFactory();
Session session = sessionFactory.openSession();
User user = new User("Alice", 25);
session.beginTransaction();
session.save(user);
session.getTransaction().commit();
session.close();
sessionFactory.close();
}
}
实战项目演练
小型博客系统开发
博客系统是一个典型的Web应用,需要实现文章的增删改查、用户管理等功能。
数据库设计
CREATE TABLE users (
id INT AUTO_INCREMENT PRIMARY KEY,
username VARCHAR(50),
password VARCHAR(100),
email VARCHAR(100)
);
CREATE TABLE posts (
id INT AUTO_INCREMENT PRIMARY KEY,
title VARCHAR(100),
content TEXT,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
user_id INT,
FOREIGN KEY (user_id) REFERENCES users(id)
);
后端实现
import org.springframework.web.bind.annotation.*;
@RestController
public class PostController {
@GetMapping("/posts")
public List<Post> getPosts() {
// 查询所有文章
return postRepository.findAll();
}
@PostMapping("/posts")
public Post createPost(@RequestBody Post post) {
// 创建新文章
return postRepository.save(post);
}
@PutMapping("/posts/{id}")
public Post updatePost(@PathVariable int id, @RequestBody Post post) {
// 更新文章
return postRepository.save(post);
}
@DeleteMapping("/posts/{id}")
public void deletePost(@PathVariable int id) {
// 删除文章
postRepository.deleteById(id);
}
}
前端实现
<!DOCTYPE html>
<html>
<head>
<title>Blog</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
<div id="app">
<h1>Blog</h1>
<ul>
<li v-for="post in posts">
<span>{{ post.title }}</span>
<span>{{ post.content }}</span>
</li>
</ul>
</div>
<script>
new Vue({
el: '#app',
data: {
posts: []
},
mounted() {
fetch('/posts')
.then(response => response.json())
.then(data => this.posts = data);
}
});
</script>
</body>
</html>
在线商城系统设计与实现
在线商城系统需要实现商品展示、购物车、订单管理等功能。
数据库设计
CREATE TABLE products (
id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(100),
price DECIMAL(10, 2),
description TEXT,
image_url VARCHAR(255)
);
CREATE TABLE orders (
id INT AUTO_INCREMENT PRIMARY KEY,
user_id INT,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
FOREIGN KEY (user_id) REFERENCES users(id)
);
CREATE TABLE order_items (
id INT AUTO_INCREMENT PRIMARY KEY,
order_id INT,
product_id INT,
quantity INT,
price DECIMAL(10, 2),
FOREIGN KEY (order_id) REFERENCES orders(id),
FOREIGN KEY (product_id) REFERENCES products(id)
);
后端实现
import org.springframework.web.bind.annotation.*;
@RestController
public class ProductController {
@GetMapping("/products")
public List<Product> getProducts() {
// 查询所有商品
return productRepository.findAll();
}
@GetMapping("/products/{id}")
public Product getProduct(@PathVariable int id) {
// 查询单个商品
return productRepository.findById(id).orElse(null);
}
@PostMapping("/orders")
public Order createOrder(@RequestBody Order order) {
// 创建新订单
return orderRepository.save(order);
}
}
前端实现
<!DOCTYPE html>
<html>
<head>
<title>Online Store</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
<div id="app">
<h1>Online Store</h1>
<ul>
<li v-for="product in products">
<span>{{ product.name }}</span>
<span>{{ product.price }}</span>
</li>
</ul>
</div>
<script>
new Vue({
el: '#app',
data: {
products: []
},
mounted() {
fetch('/products')
.then(response => response.json())
.then(data => this.products = data);
}
});
</script>
</body>
</html>
更复杂的业务逻辑示例
<!DOCTYPE html>
<html>
<head>
<title>Shopping Cart</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<body>
<div id="app">
<h1>Shopping Cart</h1>
<ul>
<li v-for="product in cart">
{{ product.name }} - ${{ product.price }}
<button @click="removeProduct(product)">Remove</button>
</li>
</ul>
<button @click="checkout">Checkout</button>
</div>
<script>
new Vue({
el: '#app',
data: {
products: [],
cart: []
},
mounted() {
fetch('/products')
.then(response => response.json())
.then(data => this.products = data);
},
methods: {
addProduct(product) {
this.cart.push(product);
},
removeProduct(product) {
this.cart.splice(this.cart.indexOf(product), 1);
},
checkout() {
// 处理订单
this.cart = [];
}
}
});
</script>
</body>
</html>
微信小程序接口对接
微信小程序可以调用后端API进行数据交互。
后端实现
import org.springframework.web.bind.annotation.*;
@RestController
public class WXMiniProgramController {
@GetMapping("/user")
public User getUser(@RequestParam String code) {
// 根据code获取用户信息
return userService.getUserByCode(code);
}
@PostMapping("/order")
public Order createOrder(@RequestBody Order order) {
// 创建新订单
return orderService.saveOrder(order);
}
}
小程序端实现
// 小程序端代码
// 获取用户信息
wx.login({
success: function(res) {
if (res.code) {
wx.request({
url: 'https://example.com/user',
data: {
code: res.code
},
success: function(res) {
console.log(res.data);
}
});
}
}
});
// 创建订单
wx.request({
url: 'https://example.com/order',
method: 'POST',
data: {
// 订单数据
},
success: function(res) {
console.log(res.data);
}
});
总结与展望
Java全栈开发常见问题与解决方案
Java全栈开发中常见的问题包括跨域请求、性能优化、安全性等。
跨域请求
跨域请求是指前端请求不同域名的后端资源。可以通过CORS(Cross-Origin Resource Sharing)来解决。
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@CrossOrigin(origins = "http://localhost:8080")
public class HelloController {
@GetMapping("/hello")
public String hello() {
return "Hello, World!";
}
}
性能优化
性能优化包括代码优化、数据库优化、缓存优化等。
import org.springframework.cache.annotation.Cacheable;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
public class ExampleController {
@Cacheable(value = "userCache", key = "#id")
@GetMapping("/user/{id}")
public User getUser(@PathVariable int id) {
// 查询用户
return userRepository.findById(id).orElse(null);
}
}
安全性
安全性包括身份验证、授权、数据加密等。
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
@RestController
public class SecurityController {
@PostMapping("/login")
public String login(@RequestParam String username, @RequestParam String password) {
// 验证用户
if (validateUser(username, password)) {
return "Login successful";
} else {
return "Login failed";
}
}
private boolean validateUser(String username, String password) {
// 验证逻辑
BCryptPasswordEncoder encoder = new BCryptPasswordEncoder();
String encodedPassword = encoder.encode(password);
// 比较加密后的密码
return encoder.matches(password, encodedPassword);
}
}
技术趋势与未来发展方向
Java技术在不断发展,未来的发展方向包括微服务、云原生、函数式编程等。
微服务
微服务架构是一种将单一的应用程序分解成一组小的服务的方式,每个服务运行在自己的进程中,并通过轻量级的通信机制(通常是HTTP资源API)来通信。
云原生
云原生是指利用云平台的特性(如按需扩展、弹性伸缩等)来构建和部署应用。云原生技术包括容器化(如Docker)、服务网格(如Istio)、不可变基础设施等。
函数式编程
函数式编程是一种编程范式,强调数据的不可变性和函数的纯函数性质。Java 8引入了一些函数式编程的概念,如Lambda表达式、Stream API等,未来可能进一步支持更高级的函数式编程特性。
总之,Java全栈开发是一个涉及多个技术领域的复杂过程。通过不断学习和实践,可以掌握更多高级技术,构建更高效、更可靠的系统。