JavaWeb - 前端

概念：Drowser Object Model 浏览器对象模型，允许JavaScript 与浏览器对话，JavaScript将浏览器的各个组成部分分装为对象。

组成：

  • Window： 浏览器窗口对象
  • Navigator： 浏览器对象
  • Screen:  屏幕对象
  • History： 历史记录对象

Loccation：地址栏对象

浏览器窗口对象

获取：直接使用window 其中window.可以省略。 window.alert("hello window")    alret("hello window") 

属性： 

  • history：对history对象的只读引用。
  • location 对于窗户或框架的location对象
  • navigator：对navigator 对象的只读引用  浏览器

方法 ：

  • alert() : 显示警示框
  • confirm() 显示带有一段消息的对话框和取消按钮的对话框
  • setlnterval() 按钮指定的周期（以毫秒计）来调用函数或计算表达式
  • setTimeout() 在指定的毫秒数后调用函数或计算表达式，只会调用一次

location 

介绍：地址栏对象

获取： 使用window.location 获取，其中window. 可以省略  

window.location.属性   location.属性；

属性： href:设置或返回完整的URL  location.herf="https://www.itcast.cn"; 

DOM

概念：Document Object Model  文档对象模型

将标记语言的各个组成部分封装为对应的对象：

  • Document： 整个文档对象
  • Element： 元素对象
  • Attribute: 属性对象
  • Text: 文本对象
  • Comment: 注释对象

JavaScript通过DOM 就能够对HTML进行操作：

  • 改变HTML元素的内容
  • 改变HTML元素的样式（CSS)
  • 改变HTML DOM 事件做出反应
  • 添加和删除HTML 元素 

DOM 是W3C的标准，定义了访问HTML和XML文档的标准，分为3个不同的部分：

1.Core DOM - 整个文档类型的标准模型

  • Document： 整个文档对象
  • Element 元素对象
  • Attribute： 属性对象
  • Text 文本对象
  • Comment 注释对象 

2.XML DOM-XML 文档的标准模型

3.HTML DOM-HTML 文档的标准模型

  • image： <img>
  • Button <input type = 'button'> 

4.在dom 中获取元素对象 

HTML 中的 element 对象可以通过document 对象获取，而Document 对象是通过window对象获取的

Document对象中提供了以下四种获取Element 元素的函数

  • 根据id属性值获取，返回单个的Elemenet对象
  • var h1 =document.getElementById('h1') ;
  • 根据标签名称获取，返回Element 对象数组
  • var divs = document.getElementsByTagName('div');
  • 根据name 属性值获取，返回Element 对象数组
  • var hobbys = document.getElementsByName('hobby');
  • 根据class 属性值获取，返回Element 对象数组
  • var class = document.getElementsByClassName('cls');

JS事件监听

事件：HTML 事件是发生在HTML 元素的“事情”。比如

  • 按钮被点击
  • 鼠标移动到元素上
  • 按下键盘按钮 

事件监听：JavaScript 可以在事件被侦测到时 执行代码。

JS 事件监听

事件的绑定

方式一：通过HTML标签中的事件属性进行绑定

<input type="button" onclick="on()" value="按钮1">

<script>
     function on(){
      alert('我被点击了！');
    }
</script>

 方式2:通过DOM 元素属性绑定

<input type="button" id="btn" value="按钮2">

<script> 
    document.getElementById('btn').onclick=function(){
        alert('我被点击了！');
    }
</script>

常见事件

事件名说明
onclick鼠标单击事件
onblur元素失去焦点
onfoucs元素获得焦点
onload某个页面或图像被完成加载
onsubmit当表单触发时触发该事件
onkeydown某个键盘按钮被按下
onmouseover 鼠标移动到某元素之上
onmouseout鼠标从某元素移开

Vue

VUE 是一套前端框架，免除原生态的JavaScript中的DOM 操作，简化书写

基于M(Model-View-ViewModel)思想，实现数据的双向绑定，将编程的关注点放在数据上。

官网：Vue.js (vuejs.org)icon-default.png?t=N7T8https://v2.cn.vuejs.org/

框架：是一个半成品软件，是一套可用的，通用的，软件基础码模块。基于框架进行开发，更加快捷，更加高效。 

Vue快速入门

新建HTML页面 引入Vue.js文件

<script src="js/vue.js"></script>

在JS代码区域，创建Vue核心对象，定义数据模型

<script>
    //定义Vue对象
    new Vue({
        el:"#app", //vue接管的区域
        data:{
            message:"Hello Vue"
        }
    })
</script>

编写视图

  <div id="app">
        <input type="text" v-model="message">  //v-model
        {{message}}
    </div>

插值表达式

  • 形容：{{}}
  • 内容可以是：
  • 变量
  • 三元运算符
  • 函数调用
  • 算数运算

Vue的常用指令

  • 指令：HTML 标签上带有v-前缀 的特殊属性，不同指令具有不同含义。例如：v-if,v-for....
  • 常见指令 
指令作用
v-bind为HTML标签绑定属性，如设置href css样式
v-model为表单元素上创建双向数据绑定
v-on为HTML标签绑定事件
v-if条件性的渲染某元素，判断为true时渲染，否则不渲染
v-eles-if
v-else
v-show根据条件展示某元素，区别在于切换的display属性的值
v-for列表渲染，遍历容器的元素或者对象的属性

  v-bind

生命周期

生命周期：指一个对象从创建到销毁的整个过程。

声明周期的八个阶段：每触发一个生命周期事件，会自动执行一个声明周期方法（钩子）

Ajax介绍

ajax 概念： asynchronous JavaScript And XML  异步的JavaScript 和XML  是存储说数据的

作用： 

  • 数据交换：通过Ajax 可以给服务器发送请求,并获取服务器响应的数据
  • 异步交互：可以在不加载重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索联想，用户名是否可用的校验等等

Axios

介绍：  Axios 对原生的Ajax 进行了分装，简化书写，快速开发

官网：https://www.axios-http.cn/ 

Axios 的使用方式

1.引入Axios的js文件

<script src="js/axios-0.18.0.js"></script>

2.使用Axios 发送请求，并获取响应的结果

axios({
    menthod:"get",
    url:"http://    ",
}).this((result.date)) =>{
    console.log(result.date);
});






axios({
    method:"post",
    url:"http://    ",
    data:"id=1"
}).then((result)) => {
      console.log(result.data);  
});

 Axios 

请求方式别名：

  • axios.get(url[,config])
  • axios.delete(url[,config])
  • axios.post(url[,data[,config]])
  • axios.put(url[,data[,config]])

前后端分离开发

YAPI 

介绍：YAPI 是高效，易用，功能强大的api 管理平台，旨在为开发，产品，测试提供更优雅的接口服务

地址：YApi Pro-高效、易用、功能强大的可视化接口管理平台

API接口管理   

Mock服务    通过YAPI可以生成接口的模拟测试，供前端测试工程测试

YAPI使用流程

  • 添加项目
  • 添加分类
  • 添加接口

实际的前端开发

  • 模块化  js css
  • 组件化 UI结构  样式 行为
  • 规范化  目录结构 编码 接口
  • 自动化 构建 部署 测试

前端工程化：是指在企业级的前端项目开发中，把前端开发所需要的工具，技术，流程，经验等进行规范化，标准化。 

前端工程化

  • 环境准备
  • Vue 项目简介
  • Vue 项目开发流程

环境准备

  • 介绍 Vue-cli 是Vue官方提供的一个脚手架，用于快速生成一个Vue 模板
  • Vue-cli 提供功能如下
  • 统一的目录结构
  • 本地调试
  • 热部署
  • 单元测试
  • 集成打包上线
  • 依赖环境：NodeJS 

  Vue 项目创建

  • 命令行  vue create vue-project01
  • 图像化界面： vue ui

Vue项目-目录结构

  • 基于Vue 脚手架创建出来的工程，有标准的目录结构，如下：

ELement-快速入门

快速入门：

安装ElementUI组件（在当前工程的目录下）,在命令执行行指令：

nmp install element-ui@2.15.3

 引入ElementUI组件库

import ElementUI from ‘element-ui’

import 'element-ui/lin/theme-chalk/imdex.css';

Vue.use(ElementUI);

访问官网,复制组件代码，调整

常见组件-表格

  • Table 表格：用于展示多条结构类似的数据，可对数据进行排序，筛选，对比或其他自定义操作

常见组件-分页

  • pagination 分页：当数据量过多时，使用分页分解数据。

常见组件-对话框

  • Dialog 对话框: 在保留当前页面的情况下，告知用户并承载相关操作。 

常见组件-表单

  • Form表单：由输入框，选择器，单选框，多选框等控制条件组成，用以收集，校验，提交数据。 

Vue路由

前端路由是指：URL中的hash(# 号)与组件之间的对应关系

Vue Router

  • 介绍：VueRouter 是Vue 的官方路由
  • 组成
  • VueRouter：路由类，根据路由请求在路由视图中动态渲染中的组件
  • <router-Link> 请求连接组件，浏览器会解析成<a> 
  • <router-view> 动态视图组件，用来渲染展示与路由路径向对应的组件 

Vue安装（创建Vue 项目时已选择）

npm install vue-router@3.5.1

定义路由  在router 下的index.j

打包部署

前端最为流行的服务器是NGINX

打包：npm run  build   打包到 dist 文件下

部署：Nginx 是一款轻量级的Web服务器/反向代理服务器及电子邮件（IMAP/POP3)代理服务器。其特点是占用内存少，并发能力强，在各大型互联网公司都有非常广泛的使用。

官网：nginx news

部署：将打包好的dist目录下的文件，复制到nginx安装目录的html目录下。

启动：双击 nginx.exe 文件即可，nginx服务器默认占用80端口号

注意：Nginx默认占用80端口号，如果80端口号被占用，可以在nginx.conf中修改端口号。

查询某个端口被谁占用：netstat -ano | findStar 80

JavaWeb-后端

什么是maven？

Maven 是apache旗下的一个开源项目，是一款用于管路和构建Java项目的工具。

apache：apache软件基金会，成立于1999年7月，是目前世界上最大的最受欢迎的开源软件基金会，也是一个专门为支持开源项目而生的非盈利组织。

开源项目：Welcome to The Apache Software Foundation!

Maven的作用？

  • 依赖管理 ：方便快捷的管理依赖的资源（jar) 避免版本冲突问题
  • 统一项目结构： 提供标准，统一的项目结构
  • 项目构建： 标准跨平台（Linux，Windows，macOS） 的自动化项目构建方式 

 Maven 是一款管理和构建Java项目的工具。

Maven概述

介绍：

  • apache maven 是一个项目管理和构建工具，它基于项目对象模型（POM)的概念，通过一小段信息来管理项目的构建
  • 作用：
  • 方便的依赖管理
  • 统一的项目结构
  • 标准的项目构建流程
  • 官网：Welcome to The Apache Software Foundation!

POM（project object model)

 仓库：用于存储资源，管理各种jar包

  • 本地仓库：自己计算机上的一个目录
  • 中央仓库：由Maven团队维护的全球唯一的。仓库地址：Central Repository: (maven.org)
  • 远程仓库（私服）：一般由公司团队搭建的私有仓库。

Maven 的安装

安装步骤：

1.解压apache-maven-3.6.1-bin.zip

2.配置本地仓库：修改conf/settings.xml 中的<localRepository>为一个指定目录。

<localRepository>E:\develop\apache-maven-3.6.2\mvn_repo</localRepository>

3.配置阿里云私服：修改conf/settings.xml 中的<mirrors>标签，为其添加如下子标签

<mirror>

        <id>alimaven</id>

        <name>aliyun maven</name>

        <url>http://maven.aliyun.com/nexus/content/groups/public/<url>

        <mirrorOf>central</mirrorOf>

</mirror>

4.配置环境变量：MAVEN_HOME 为maven 的解压目录，并将其bin 目录加入PATH环境变量。

Maven坐标

什么是坐标？

  • Maven 中的坐标是资源的唯一标识，通过该坐标可以唯一定位资源位置
  • 使用坐标来定义项目或引进项目所需要的依赖。

Maven 坐标主要组成

  • groupld:定义当前Maven项目隶属组织名称（通常是域名反写，例如com.itheima)
  • artifactId: 定义当前Maven项目名称（通常是模块名称，例如 order-service，goods-service)
  • version:定义当前项目版本号 
<groupId>org.example</groupId>
    <artifactId>project1</artifactId>
    <version>1.0-SNAPSHOT</version>

<dependency>
    <groupId>ch.qos.lohback</groupId>
    <artifactId>logback-classic</artifactId>
    <version>1.2.3</version>
</dependency>

导入Maven 项目

方式一：打开idea，选择右侧Maven面板，点击+号，选择对应项目的pom.xml文件，双击即可

方式二：打开idea，点击右侧Maven面板，点击+号，选中对应项目 的pom.xml文件双击即可。

依赖管理

依赖配置：

  • 依赖：指当前项目运行所需要的Jar包，一个项目中可以引入多个依赖
  • 配置
  • 1.在pom.xml 中编写<dependencies>标签
  • 2.在<dependencies>标签中 使用<dependency>引入坐标
  • 3.定义坐标的 groupld,artifactld,version
  • 4.点击刷新按钮，引入最新加入的坐标 

  <dependencies>
        <dependency>
            <groupId>ch.qos.logback</groupId>
            <artifactId>logback-classic</artifactId>
            <version>1.2.9</version>
        </dependency>
    </dependencies>

依赖传递

  • 依赖具有传递性
  • 直接依赖：在当前项目中通过依赖配置建立的依赖关系
  • 间接依赖：被依赖的资源如果依赖其他资源，当前项目间接依赖其他资源

排除依赖

排除依赖指主动断开依赖的资源，被排除的资源无需指定版本。

使用：exclusions 排除依赖

依赖范围：

依赖的jar包，默认情况下，可以在任何地方使用。可以通过<scope> ... </scope> 设置其作用范围。

作用范围：

  • 主程序范围有效（main文件范围内）
  • 测试程序范围有效（test文件范围内）
  • 是否参与打包运行（package指令范围内）

maven生命周期

Maven 生命周期就是为了对所有的maven 项目构建过程进行抽象和统一。

maven有三套相互独立的生命周期：

  • clean:清理工作
  • default：核心工作，如：编译，测试，打包，安装，部署等
  • site:生成报告，发布站点等。 

生命周期阶段：

  • clean:移除上一次构建生成的文件
  • compile:编译项目源代码
  • test:使用合适的单元测试框架运行测试（junit)
  • package 将编译后的文件打包 如：jar,war等
  • install 安装项目到本地仓库 

在同一生命周期中，当运行后面的阶段时，前面的阶段都会运行。

执行指定生命周期的两种方式：

  • 在idea中，右侧的maven 工具栏，选中对应的生命周期，双击执行。
  • 在命令行中，通过命令执行 

Web后端开发

SpringBootWeb 入门

  • 官网Spring | Home
  • Spring 发展到今天已经形成了一种开发生态圈，Spring提供了若干子项目，每个项目用于完成特定的功能。

 

 Spring Framework  配置繁琐  入门难度大

Spring Boot  简化配置  快速开发

Spring Boot 可以帮助我们非常快速的构建应用程序，简化开发，提高效率。

  • SpringBootWeb 入门

SpringBootWeb快速入门

需求：使用SpringBoot 开发一个web应用，浏览器发起请求 /hello 后，给浏览器返回字符串“Hello World ~”。

开发步骤：

  • 创建Springboot 工程，并勾选web 开发相关依赖。
  • 定义helloController类，添加方法hello，并添加注解。
  • 运行测试 

HTTP 协议

HTTP概述：超文本传输协议，规定了浏览器和服务器之间数据传输的规则。

  特点：

  1. 基于TCP协议：面向连接，安全  传输层
  2. 基于请求-响应模型的：一次请求对应一次响应
  3. HTTP协议是无状态的协议：对于事务处理没有记忆能力。每次请求-响应都是独立的。
  4. 缺点：多次请求间不能够共享数据
  5. 优点：速度快 

HTTP-请求数据格式

get请求与post请求的关系？
请求方式-GET:请求参数在请求行中，没有请求实体，如：/brand/findAll?name=OPPO&status=1.

GET请求时有限制的。

请求方式——POST 请求参数在请求体中，POST请求大小是没有限制的。

HTTP-响应协议

响应数据的第一行（协议，状态码，描述） 响应行

响应头：从第二行开始，格式：key:value

响应体：最后一部分，存放响应数据

web服务器

web服务器是一个软件程序，对HTTP协议的操作进行封装，使得程序员不必直接对协议进行操作，让web开发更加便捷。主要功能是“提供网上浏览服务”。

Web服务器-Tomact

TOmact概述

概念：Tomcat 是Apache 软件基金会一个核心项目，是一个开源免费的轻量级Web服务器，支持Servlet/JSP少量javaEE规范。

javaEE：java Enterprise Edition,java企业班。指Java企业级开发的技术规范总和.包含13项技术规范：JDBC,JNDI，EJB,RMI，JSP,Servlet,XML,JMS,Jvaa IDL,JTA,JavaMail,JAF.

Tomcat也被称为 web容器，Servlet容器。Servlert容器，Servlet程序需要依赖于Toccat才能运行

官网：Apache Tomcat® - Welcome!

小结：

1.web服务器

  • 对于HTTP协议操作进行封装，简化web程序开发
  • 部署web项目，对外提供网上信息浏览服务 

 2.Tomcat

  • 一个轻量化的web服务器，支持servlet，jsp等少量javaEE规范
  • 也被称为web容器，servlet容器 

请求响应：

  • 请求（HttpServletRequest):获取请求数据
  • 响应（HttpServeltResponse)：设置响应数据 
  • BS架构：Browser/Server,浏览器/服务器架构模式。客户端只需要浏览器，应用程序的逻辑和数据都存储在服务器端。京东，淘宝，天猫等等
  • CS架构：Client/Server，客户端/服务器架构模式。 微信，百度网盘等等
  • CS架构需要安装客户端，不同的系统安装的客户端不同
  • BS框架不需要单独的安装客户端，维护方便，体验一般 

请求：

postman

postman是一款功能其强大的网页调试与发送网页HTTP请求的Chrome插件

作用：常用于进行接口测试 

简单参数：

  • 原始方式
  • 在原始的web程序中，获取请求参数，需要通过HttpServletRequeest对象手动获取。

请求：原始的方式获取请求参数

1.Controller 方法形参中参数声明HttpServletrequest对象

2.调用对象的getParameter(参数名）

  • SpringBoot 中接收简单参数

1.请求参数名与方法形参变量名相同

2.会自动进行类型转换

  • @RequestParam 注解 

1.方法形参名称与请求参数名称不匹配，通过该注解完成映射

2.该注解的required 属性默认是true 代表请求参数必须传递 

实体参数：

  简单实体对象：请求参数名与形参对象属性名相同，定义POJO接受即可

数组集合参数：

数组参数：请求参数名与参数名称相同且请求参数为多个，定义数组类型即可接受参数。

 @RequestMapping("/arrayParam")
        public String arrayParam(String[] hobby){
            System.out.println(Arrays.toString(hobby));
            return "ok";
        }

集合参数：请求参数名与形参集合名称相同且请求参数为多个，@RequestParam绑定参数关系

1.数组集合参数

数组：请求参数名与形参中数组变量名相同，可以直接使用数组封装

集合：请求参数名与形参集合变量名相同，通过@RequestParam绑定参数关系

日期时间：

  • 日期参数：使用@DateTimeFormat注释完成日期参数格式转换
@RequestMapping("/dateParam")
    public String  dateParam(@DateTimeFormat(pattern = "yyyy-MM--dd HH:mm:ss") LocalDateTime updateTime){
        System.out.println(updateTime);
        return "ok";
    }

 Json参数

  • JSON参数：JSON数据键名与形参对象属性名相同，定义POJO类型形参即接受参数，需要@RequestBody标识

 @RequestMapping("/jsonParam")
    public String jsonParam(@RequestBody User user){
        System.out.println(user);
        return "ok";
    }
}

路径参数：

  • 路径参数：通过请求URL直接传递参数，使用{...}来标识该路径的参数，需要使用@PathVariable获取参数
 @RequestMapping("/path/{id}")
    public String pathParam(@PathVariable Integer id){
        System.out.println(id);
        return "ok";
    }

响应数据：

@ResponseBody

  • 类型：方法注解，类注解
  • 位置：Controller方法上/类上
  • 作用：将方法返回值直接响应，如果返回值类型是 实体对象/集合，将会转换为JSON格式响应
  • 说明：@RestController = @Controller + @ResponseBody;

1.@ResponseBody

位置：Controller类上/方法上

作用：将方法返回值直接响应，若返回值类型是 实体对象/集合，转JSON格式响应

2.统一响应结果

Result（code,msg,data) 

分层解耦：

 三层架构：

  • Controller 接受请求，响应数据
  • Service 逻辑处理
  • Dao 数据访问
  1. controller 控制层，接受前端发送的请求，对请求进行处理，并相应数据
  2. Service：业务逻辑层，处理具体的业务逻辑
  3. dao 数据层访问（Data Access Object)(持久层），负责数据访问操作，包括数据的增，删，改，查。  

 分层解耦

内聚：软件中各个功能模块内部的功能联系

耦合：衡量软件中各个层/模块之间的依赖，关联的程度

软件设计原则：高内聚低耦合

控制反转：inversion Of Control 简称IOC 对象的创建控制权由程序自身转移到外部（容器），这种思想称为控制反转。

依赖注入：Dependency Injection 简称DI 容器为应用程序提供运行时，所依赖的资源，称之为依赖注入

Bean对象：IOC容器中创建，管理对象，称之为bean.

  1. Service层 及Dao 层的实现类，交给IOC容器管理。 @Component
  2. 为Controler 及service 注入运行时，依赖的对象。 @Autowired

IOC详解：（容器）

Bean的声明：

要把某个对象交给IOC容器管理,需要在对应的类上加上如下注解之一：

注解说明位置
@Commponent声明bean的基础注释

不属于以下三类时，用此注解

@Controller @Component的衍生注解标注在控制器类上
@Service@Component的衍生注解标注在业务类上
@Repository@Component的衍生注解标注在数据访问类上(由于与mybatis整合，用的少）

注意事项：

  • 声明bean 的时候，可以通过value属性指定bean的名字，如果没有指定，默认为类名的首字母小写
  • 使用以上四个注解都可以声明bean 但是在Springboot 集成web 开发中，声明控制器bean 只能用@Controller 

Bean组件扫描

  • 前面声明bean的四大注解，要想生效，还要被组件扫描注解@ComponentScan扫描
  • @ComponentScan注解虽然没有显示配置，但是实际上已经包含了启动类声明注解@SprringBootApplication中，默认扫描的范围是启动类所包及其子包   

DI详情（依赖注入） 

Bean注入

  • @Autowired注解，默认是按照类型进行，如果存在多个相同类的bean，将会报出错误 
  • 通过以下几种方案来解决：
  • @Primary
  • @Qualifier
  • @Resource 

 如果同类型的bean存在多个：

  • @primary
  • @Autowried + @Qualifier("bean的名称")
  • @ResCource(name="bean的名称"）

@Resource 与 @Autowired 区别

  • @Autowried 是spring 框架提供的注解，而@Resource是jdk提供的注解。
  • @Autowried 默认是按照类型注入，而@Resource 默认是按照名称注入。  

Mybatis 

mybatis 是一款优秀的持久层的框架，用于简化JDBC的开发。

Mybatis入门

使用mybatis查询所有用户数据

使用步骤：

  • 准备工作（创建springBoot工程，数据库表user,实体类User)
  • 引入Mybatis的相关依赖，配置Mybatis(数据库的连接信息）
  • 编写SQL语句（注入/XML)

JDBC介绍

JDBC（java DataBase Connectivity) 就是使用java 语言操作关系型数据库的一套API.

本质：

  • sum公司官方定义的一套操作所有关系型数据库的规范，及接口
  • 各个数据库厂商实现这套接口，提供数据库驱动jar包
  • 我们可以使用这套接口（JDBC）编程，真正执行的代码时驱动jar包实现类

数据库连接池：

  • 数据库连接池是一个容器，负责分配，管理数据库连接（connection)
  • 它允许应用程序重复使用一个现有的数据库连接，而不是在重新建立一个
  • 释放空闲时间查过最大空闲时间的连接池，来避免因为没有释放连接而引起的数据库连接遗漏

优势：

  • 资源重用
  • 提升系统相应速度
  • 避免数据库连接遗漏 

数据库连接池：

标注接口：DataSource

  • 官方（sum)提供的数据库连接池接口，由第三方组织实现此接口
  • 功能：获取连接 connection getConnection() throws SQLException; 

常见产品：c3p0 DBCP Driuid Hikari(springboot默认）追光者

driuid (德鲁伊）

driuid连接池是阿里巴开源的数据库连接池项目

功能强大，性能优秀，是Java语言最好的数据库连接池之一

切换Druid数据库连接池

引入起步依赖

<dependency>
    <groupId>com.alibaba</groupId>
    <artifactId>druid-spring-boot-starter</artifactId>
    <version>1.2.16</version>
</dependency>

 配置连接信息

lombok

lombok是一个使用的java类库，能够通过注解的形式自动生成构造器，getter/setter,equals,hashcode,toString等方法，并可以自动化生成日志变量，简化Java开发，提高效率。

注解作用
@GETTER/@SETTER为所有的属性提供get/set方法
@ToString会给类自动生成易读的toString方法
@EqualsAnddHashCode根据类拥有的非静态字段自动重写equals方法和hashCode方法
@Data提供了更综合的生成代码功能（@Getter+@Setter+@ToString+@EqualsAndHashCode)
@NoArgsConstructor为实现类生成午餐的构造器方法
@AllArgsConStructor为实现类生成除了static修饰的字段之外带有个参数的构造器方法

Lombok会在编译时，自动生成对应的Java代码。我们使用lombok时，还需安装一个lombok的插件（idea自带）

Mybits基础操作（增删改查）

接口方法

@Delete("delete from emp where id = #{id}")
public void delete(Integer id);

注意事项：如果mapper接口方法形参只有一个普通的参数，#{...}里面的属性是可与随便写的，如#{id}，#{value}

日志输出

可以在application.properties中，打开mybits的日志，并指定输出到控制台。

预编译sql语句 

优势：

  • 新能高
  • 更安全（防止SQL注入）

SQL注入是通过操作的数据来修改事先定义好的SQL语句，以达到执行代码对服务器进行攻击的方法。 

#{...}

  • 执行SQL时，会将#{...}替换为？，生成预编译SQL,会自动设置参数值。
  • 使用时机:参数传递，都使用#{...}

${...}

  • 拼接SQL。直接将参数拼接在SQL语句中，存在SQL注入问题。
  • 使用时机：如果对表明，列名进行动态设置时使用。 

 新增：

  • SQL语句
  • 接口方法 （如果有多个参数可以使用类来封装）

 新增（主键返回）

 在添加数据成功后，需要获取插入数据库数据的主键。如 添加套餐数据时，还需要维护菜品关系表数据。

实现：

@Options(keyProperty = "id",useGeneratedKeys = true)

会自动将生成的主键值，赋值给emp对象的id属性

更新：

 @Update("update emp set username =#{username},name = #{name},gender=#{gender},image =#{image}," +
            "job=#{job},entrydate=#{entrydate},dept_id=#{deptId},update_time=#{updateTime} where id=#{id};")
    public void update(Emp emp);

查询：（根据ID查询）

数据分装:

  • 实体类属性名和数据库查询返回的字段的字段名一致，mybatis会自动分装
  • 如果实体类属性名和数据库查询返回的字段不一致，不能自动分装

解决方法：

1.给字段起别名，让别名与实体类属性一致 

  @Select("select id ,username, password, dept_id deptId from emp where id = #{id}")
    public Emp GetById(Integer id);

2.通过@Results，@Result 注释手动映射分装

# 前端
Logo
GitCode 开源社区

旨在为数千万中国开发者提供一个无缝且高效的云端环境，以支持学习、使用和贡献开源项目。

更多推荐

cover

GitTalk | 使用面向业务的狮偶编程语言提升开发效率

avatar GitCode 开源社区
cover

GitTalk | DevUI Suits 场景解决方案

avatar GitCode 开源社区
cover

GitTalk | DevUI Admin 前端项目构建

avatar GitCode 开源社区