javaweb復習
<!--外部引入
? ? ? ? 注意：script必須成對出現
? ? -->
<script src="js/hj.js"></script>
?
<!--不用顯示定義type，也默認就是javaScript-->
<script type="text/javascript"></script>
Tomcat配置
1.omcat配置
1.可以配置主機名稱，可以配置端口號
2.Tomcat核心配置文件在conf文件里面的server.xml里面
? 2.IDEA中配置Tomcat
第一步：點擊
第二歩：點擊 + 選擇Tomcat
第三部 點擊
第四歩 解決報錯? 就一個/ = localhost:8080 加別的名字 就在8080后面加上你配置的名字
高難度面試題
請你談談網站是如何進行訪問的？
1.輸入一個域名:回車
2.檢查本機的：C:\Windows\System32\drivers\etc\hosts配置文件下有沒有這個域名映射
1.有：直接返回對應ip地址,這個地址中,有我們需要訪問的web程序，可以直接訪問
2.沒有：去DNS服務器找，找到到返回，找不到返回找不到
-
Http
1.http請求
客戶端--發請求--（request）--服務器
百度：
RequestURL:https://www.baidu.com/ 請求地址
RequestMethod:GET? ? get方法post方法
StatusCode:200OK(fromprefetchcache)狀態碼200
RemoteAddress:180.101.49.12:443?
1、請求行
請求行中的請求方式：GET
請求方式: Get ，Post
get:請求能夠攜帶參數比較少,大小有限制，會在瀏覽器地址欄展示數據,不安全，但高效
post:請求能夠攜帶參數沒有限制,大小沒有限制，不會在瀏覽器地址欄展示數據,安全，但不高 效
2、消息頭
2.http響應
服務器--響應--客戶端
百度：
?
Cache-Control:private
Content-Encoding:gzip
Content-Type:text/html;charset=utf-8
Date:Mon,18May202007:50:34GMT
Expires:Mon,18May202007:50:30GMT
1.響應體
2.響應狀態嗎
200:請求響應成功
3xx:請求重定向
重定向:你重新到我給你新位置去
4xx:找不到資源 404
資源不存在：
5xx:服務器代碼錯誤
#####? 兩個時代
http1.0：客戶端可以與web服務器連接后，只能獲得一個web資源，斷開鏈接，
http2.0：客戶端可以與web服務器連接后，只能獲得多個web資源
常見面試題
當你的瀏覽器中地址欄輸入地址并回車的一瞬間到頁面能夠展示數據回來，經歷了什么，
1.Servlet
Servlet就是sun公司開發動態web的一門技術
sun在這些APl中提供了一個接口,Servlet,如果你想開發一個Servlet程序,只需要完成兩個步驟
1.編寫一個類，實現Servlet接口
2.把開發好的JAVA類部署到web服務器中,
1.2 HelloServlet
1.1構建一個普通項目
1.2創建一個類，extends 繼承 HttpServlet
1.3重寫接口中的 doget dopost 方法
1.4編寫Servlet的映射文件 web.xml
1.5配置Tomcat測試即可
1.4Mapping問題
1.一個Servlet可以指定一個映射路徑
<!--Servlet請求路徑-->
<servlet-mapping>
<servlet-name>hello</servlet-name>
<url-pattern>/hello</url-pattern>
</servlet-mapping>
2.一個Servlet可以指定多個映射路徑
<servlet-mapping>
<servlet-name>hello</servlet-name>
<url-pattern>/hello1</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>hello</servlet-name>
<url-pattern>/hello2</url-pattern>
</servlet-mapping>
3.一個Sevlet可以指定通用映射路徑 /*=任何路徑
<servlet-mapping>
<servlet-name>hello</servlet-name>
<url-pattern>/hello/*</url-pattern>
</servlet-mapping>
4.指定一些后綴或者前綴等等.
<!--可以自定義后綴名
注意 *. 前面不能加路徑? /=只要是*.后面的內容
-->
<servlet-mapping>
<servlet-name>hello</servlet-name>
<url-pattern>*.xhf</url-pattern>
</servlet-mapping>
5.優先級問題
指定了固有的映射路徑優先級最高，如果找不到就會走默認的
##### ServletContext
1.調用this.getServletContext 使用方法
2.Servletcontext作用：共享數據 其他的Servlet都能獲取這個數據
2.獲取初始參數
1.servletContext.getInitParameter
3.請求轉發
1.request.getRequestDispatcher().forward();
4.讀取資源文件
1.在resources下建一個porperties配置文件
思路：需要一個文件流去讀取文件 然后打印即可
@Override
protectedvoiddoGet(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{
//獲取io流路徑
InputStreamresourceAsStream=this.getServletContext().getResourceAsStream("/WEB-INF/classes/db.properties");
//創建properties對象
Propertiesproperties=newProperties();
properties.load(resourceAsStream);//讀取路徑下的配置文件
Stringusername=properties.getProperty("username");
Stringpassword=properties.getProperty("password");
//輸出到頁面
resp.getWriter().print(username+":"+password);
?? }
HttpServletResponse
1.web服務器接受到客戶端的http請求，針對這個請求，分別創建一個代表請求的httpServletRequest
對象，代表響應的HttpServletResponse對象
2.如果要獲取客戶端請求過來的參數：找httpServletRequest
如果要給客戶端響應一些信息：找httpServletResponse
1、簡單分類
負責向瀏覽器發送數據的方法
servletOutputstreamgetOutputstream()throwsIOException;
Printwritergetwriter()throwsIOException;
負責向瀏覽器發送響應頭的方法
voidsetCharacterEncoding(Stringvar1)；
voidsetContentLength(intvar1)；
voidsetContentLengthLong(longvar1);
voidsetContentType(Stringvar1)；
voidsetDateHeader(Stringvarl,longvar2)
voidaddDateHeader(Stringvar1,longvar2)
voidsetHeader(Stringvar1,Stringvar2);
voidaddHeader(Stringvar1,Stringvar2)；
voidsetIntHeader(Stringvar1,intvar2);
voidaddIntHeader(Stringvarl,intvar2);
2、下載文件
1.獲取下載文件的路徑
2.下載中的文件名稱
3.設置想辦法讓瀏覽器能夠支持下載我們需要的東西
4.獲取文件下載流
5.創建緩沖區
6.獲取OutputStream對象
7.FileOutputStream流寫入到bufer緩沖區
8.使用OutputStream將緩沖區中的數據輸出到客戶端！
@Override
protectedvoiddoGet(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{
// 1. 要獲取下載文件的路徑
StringrealPath="F:\\班級管理\\西開【19525】\\2、代碼\\JavaWeb\\javaweb-02-servlet\\response\\target\\classes\\秦疆.png";
System.out.println("下載文件的路徑："+realPath);
// 2. 下載的文件名是啥？
StringfileName=realPath.substring(realPath.lastIndexOf("\\")+1);
// 3. 設置想辦法讓瀏覽器能夠支持(Content-Disposition)下載我們需要的東西,中文文件名URLEncoder.encode編碼，否則有可能亂碼
resp.setHeader("Content-Disposition","attachment;filename="+URLEncoder.encode(fileName,"UTF-8"));
// 4. 獲取下載文件的輸入流
FileInputStreamin=newFileInputStream(realPath);
// 5. 創建緩沖區
intlen=0;
byte[]buffer=newbyte[1024];
// 6. 獲取OutputStream對象
ServletOutputStreamout=resp.getOutputStream();
// 7. 將FileOutputStream流寫入到buffer緩沖區,使用OutputStream將緩沖區中的數據輸出到客戶端！
while((len=in.read(buffer))>0){
out.write(buffer,0,len);
?? }
?
in.close();
out.close();
}
4、實現重定向
使用場景：用戶登錄
方法：Response.sendRedirect("重定向路徑")
面試題：請你聊聊重定向和轉發的區別?
1他們的相同點：頁面都會實現跳轉
2.不同點： request 請求轉發的時候，瀏覽器地址欄不會發生改變 狀態欄是 307
response 重定向的時候，瀏覽器地址欄會發生改變 狀態欄是302
重定向到jsp頁面
index.jsp
? ? ? ? ? ? <html>
<body>
? ? <h2>Hel1o World!</h2>
? ? 《%--這里超交的路徑,需要尋找到項目的路徑--%>
? ? <%--${pageContext.request,contextPath}代表當前的項目--%>
? ? <formaction="${pageContext. request.contextPath}/login"method="get">
? ? ? ? 用戶名:<inputtype="text"name="username"><br>
? ? ? ? 密碼:<inputtype="password"name="password"><br>
? ? ? ? <inputtype="submit">
? ? </form>
?
</body>
RequestTest.java
? ? publicclassRequestTestextendsHttpServlet{
@Override
protectedvoiddoGet(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{
//處理方求
Stringusername=req.getParameter(s:"username");
Stringpasswordrea.getParameter(s:"password");
?
System.out.println(username+":"+password);
?
resp.sendRedirect(s:"/r/success.jsp");
HttpServletRequest
httpServletRequest代表客戶端請求，用戶通過http協議訪問服務器，http請求中的所有信息會被封裝到httpServletRequest，通過這個httpservletrequest的方法，獲取客戶端所有信息
1、獲取參數
request.getParamter(String s) String 獲取單條數據
request.getParmaterValues(String s)String[] 獲取多條數據
Cookie、Session
會話：用戶打開一個瀏覽器。點擊了很多鏈接,訪問多個web資源，關閉瀏覽器，這個過程可以稱之為會話
一個網站。怎么證明你訪問過
客戶端 服務器
1.服務器給客戶端一個 信件，客戶端下次訪問服務端帶上信件就可以了，cookie
2.服務器登記你來過了，下次你來過的時候我來匹配你：Seesion
保存會話的兩種技術
cookie
客戶端技術(響應，請求)
session
服務器技術，利用這個技術，可以保存用戶的會話信息，我們可以把會話信息或者數據放在Session中
舉例：網站登錄后，你下次不用在登錄了，第二次訪問就直接登錄上去，
Cookie
1.從請求中拿到cookie信息
2.服務器響應給客戶端cookie
3.cookie一些常用方法
Cookie[]cookies=req.getCookies();//獲得Cookie
cookie.getName();//獲得cookie中的key
cookie.getValue();//獲得cookie中的vlaue
newCookie("lastLoginTime",System.currentTimeMillis()+"");//新建一個cookie
cookie.setMaxAge(24*60*60);//設置cookie的有效期
resp.addCookie(cookie);//響應給客戶端一個cookie
4.Cookie細節
一個cookie只能保存一個信息
一個web站點可以給瀏覽器發送多個cookie，最多存放20個cookie
Cookie大小有限制4kb
300個cookie瀏覽器上限
5.刪除cookie
不設置有效期，關閉瀏覽器，自動失效
設置有效期時間為0
編碼 URLEncoder.encode("加油","utf-8")
解碼：URLDecoder.decode(cookie.getValue(),"UTF-8")
Session（重點）
什么是session
服務器會給每個用戶(瀏覽器)創建一個Session對象
一個Session獨占一個瀏覽器，只要瀏覽器沒有關閉，這個Session就存在
用戶登錄之后，整個網站都可以訪問，保存用戶信息，保存購物車信息
Session和cookie的區別
cookie是把用戶的數據寫給用戶的瀏覽器，瀏覽器保存(可以保存多個)
session把用戶的數據寫到用戶獨占的session中，服務器端保存(保存重要信息，減少服務器資源的浪費)
Session對象由服務端創建
使用場景：
保存一個登錄用戶的信息；
購物車信息；
在整個網站中經常會使用的數據，我們將它保存在Session中；
使用session
@Override
protectedvoiddoGet(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{
//解決亂碼問題
req.setCharacterEncoding("UTF-8");
resp.setCharacterEncoding("UTF-8");
resp.setContentType("text/html;charset=utf-8");
//得到Session
HttpSessionsession=req.getSession();
//給Session中存東西
session.setAttribute("name",newPerson("秦疆",1));
//獲取Session的ID
StringsessionId=session.getId();
?
//判斷Session是不是新創建
if(session.isNew()){
resp.getWriter().write("session創建成功,ID:"+sessionId);
}else{
resp.getWriter().write("session以及在服務器中存在了,ID:"+sessionId);
? ? ?? }
?
//Session創建的時候做了什么事情；
// ? ? ?? Cookie cookie = new Cookie("JSESSIONID",sessionId);
// ? ? ?? resp.addCookie(cookie); ? ? ?
//得到Session
HttpSessionsession=req.getSession();
?
Personperson=(Person)session.getAttribute("name");
?
System.out.println(person.toString());
?
HttpSessionsession=req.getSession();
session.removeAttribute("name");
//手動注銷Session
session.invalidate();
會話自動過期：web.xml配置
<!--設置Session默認的失效時間-->
<session-config>
<!--15分鐘后Session自動失效，以分鐘為單位-->
<session-timeout>15</session-timeout>
</session-config>
JSP
1、什么是JSP
java Servlet Pages：java服務端頁面，也和Servlet一樣，用于動態Web技術
特點：
寫JSP就像在寫HTML
區別：
HTML只給用戶提供靜態的數據
JSP頁面中可以嵌入JAVA代碼，為用戶提供動態數據
2.JSP原理
思路：JSP到底是怎么執行的
代碼層面沒有任何問題
服務器內部工作
原理：
tomcat中有一個work目錄：
IDEA中使用TOmcat的會在tomcat中生產一個work目錄
發現頁面轉變成了Java程序！
瀏覽器向服務器發送請求，不管訪問什么資源，其實都在訪問Servlet
JSP最終會被轉換成一個java類
JSP本質上就是個Sevlet
//初始化
publicvoid_jspInit() {
? }
//銷毀
publicvoid_jspDestroy() {
? }
//JSPService
publicvoid_jspService(.HttpServletRequestrequest,HttpServletResponseresponse)
?
2.內置一些對象
finaljavax.servlet.jsp.PageContextpageContext;//頁面上下文
javax.servlet.http.HttpSessionsession=null;//session
finaljavax.servlet.ServletContextapplication;//applicationContext
finaljavax.servlet.ServletConfigconfig;//config
javax.servlet.jsp.JspWriterout=null;//out
finaljava.lang.Objectpage=this;//page：當前
HttpServletRequestrequest//請求
HttpServletResponseresponse//響應
3.以上的這些個對象我們可以在JSP頁面中直接使用！
在jsp頁面中：
只要是java代碼就會原封不動的輸出
如果HTML代碼，就會被轉換為
out.write("<html>\r\n");
JSP聲明
<%!
static{
System.out.println("Loading Servlet!");
}
?
privateintglobalVar=0;
?
publicvoidkuang(){
System.out.println("進入了方法Kuang！");
}
?
JSP聲明，會被編譯到，JSP生成java類的中，其他的，就會被生產到jspService方法中
JSP的注釋，不會在客戶端顯示，HTML就會
JSP指令
<%@pageargs.... %>
<%@includefile=""%>
?
<%--@include會將兩個頁面合二為一--%>
?
<%@includefile="common/header.jsp"%>
<h1>網頁主體</h1>
?
<%@includefile="common/footer.jsp"%>
?
<hr>
?
?
<%--jSP標簽
jsp:include：拼接頁面，本質還是三個
--%>
<jsp:includepage="/common/header.jsp"/>
<h1>網頁主體</h1>
<jsp:includepage="/common/footer.jsp"/>
##### 9大內置對象
PageContext 存東西
Request 存東西
Response 響應消息
Session 存東西
Application 【ServletContext】存東西
Config 【ServletConifg】
out 輸出
pageContext.setAttribute("name1","秦疆1號"); //保存的數據只在一個頁面中有效
request.setAttribute("name2","秦疆2號"); //保存的數據只在一次請求中有效，請求轉發會攜帶這個數據
session.setAttribute("name3","秦疆3號"); //保存的數據只在一次會話中有效，從打開瀏覽器到關閉瀏覽器
application.setAttribute("name4","秦疆4號");? //保存的數據只在服務器中有效，從打開服務器到關閉服務器
request：客戶端向服務器發送請求，產生的數據，用戶看完就沒用了，比如：新聞，用戶看完沒用的！
session：客戶端向服務器發送請求，產生的數據，用戶用完一會還有用，比如：購物車；
application：客戶端向服務器發送請求，產生的數據，一個用戶用完了，其他用戶還可能使用，比如：聊天數據；
jsp標簽 jstl標簽 el表達式
<!-- JSTL表達式的依賴 --><dependency>? ? <groupId>javax.servlet.jsp.jstl</groupId>? ? <artifactId>jstl-api</artifactId>? ? <version>1.2</version></dependency><!-- standard標簽庫 --><dependency>? ? <groupId>taglibs</groupId>? ? <artifactId>standard</artifactId>? ? <version>1.1.2</version></dependency>
EL表達式： ${ }
獲取數據
執行運算
獲取web開發的常用對象
JSTL標簽庫需要導入 taglib
JSTL標簽庫的使用就是為了彌補HTML標簽的不足；它自定義許多標簽，可以供我們使用，標簽的功能和Java代碼一樣
MVC三層架構
什么是MVC
MVC：Model view Controller 模型 視圖 控制器
架構：沒有什么是加一層解決不了的！
原理圖
Model:
業務處理：Service?
數據持久層：CRUD Dao層 操作數據庫
View (JSP)
展示數據 jsp頁面
提供鏈接發起Servlet請求(a form 。。。)
Controller (Servlet)
接受用戶請求:
交給業務層處理 dao 和service
控制視圖跳轉
Filter(重點 過濾器)
比如一些安全框架，技術的底層就是用Filter來實現
Filter：過濾器，用來過濾網站的數據：
處理中文亂碼
判斷登錄驗證
Filter開發步驟
1.導包? JAVAx.servlet 導入這個包
2.編寫過濾器
3.實現Filter接口，重寫對應的方法即可
```java
publicclassCharacterEncodingFilterimplementsFilter{
//初始化：web服務器啟動，就以及初始化了，隨時等待過濾對象出現！
publicvoidinit(FilterConfigfilterConfig)throwsServletException{
System.out.println("CharacterEncodingFilter初始化");
? ?? }
//Chain : 鏈
/*
1. 過濾中的所有代碼，在過濾特定請求的時候都會執行
2. 必須要讓過濾器繼續同行 因為可以有多個Filter 每個Filter過濾不同的問題
chain.doFilter(request,response);
*/
publicvoiddoFilter(ServletRequestrequest,ServletResponseresponse,FilterChainchain)throwsIOException,ServletException{
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=UTF-8");
System.out.println("CharacterEncodingFilter執行前....");
chain.doFilter(request,response);//讓我們的請求繼續走，如果不寫，程序到這里就被攔截停止！
System.out.println("CharacterEncodingFilter執行后....");
? ?? }
//銷毀：web服務器關閉的時候，過濾器會銷毀
publicvoiddestroy() {
System.out.println("CharacterEncodingFilter銷毀");
? ?? }
? }
4.在web.xml中配置 Filter
<filter>
<filter-name>CharacterEncodingFilter</filter-name>
<filter-class>com.kuang.filter.CharacterEncodingFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>CharacterEncodingFilter</filter-name>
<!--只要是/servlet的任何請求，會經過這個過濾器-->
<url-pattern>/servlet/*</url-pattern>
<!--<url-pattern>/*</url-pattern>-->
<!-- 別偷懶寫個 /* -->
</filter-mapping>
### 監聽器
實現一個監聽器的接口；（有n種監聽器）
1.編寫一個監聽器
實現的接口
//統計網站在線人數 ： 統計session
publicclassOnlineCountListenerimplementsHttpSessionListener{
?
//創建session監聽： 看你的一舉一動
//一旦創建Session就會觸發一次這個事件！
publicvoidsessionCreated(HttpSessionEventse) {
ServletContextctx=se.getSession().getServletContext();
?
System.out.println(se.getSession().getId());
?
IntegeronlineCount=(Integer)ctx.getAttribute("OnlineCount");
?
if(onlineCount==null){
onlineCount=newInteger(1);
}else{
intcount=onlineCount.intValue();
onlineCount=newInteger(count+1);
? ? ?? }
?
ctx.setAttribute("OnlineCount",onlineCount);
?
?? }
?
//銷毀session監聽
//一旦銷毀Session就會觸發一次這個事件！
publicvoidsessionDestroyed(HttpSessionEventse) {
ServletContextctx=se.getSession().getServletContext();
?
IntegeronlineCount=(Integer)ctx.getAttribute("OnlineCount");
?
if(onlineCount==null){
onlineCount=newInteger(0);
}else{
intcount=onlineCount.intValue();
onlineCount=newInteger(count-1);
? ? ?? }
?
ctx.setAttribute("OnlineCount",onlineCount);
?
?? }
?
?
/*
Session銷毀：
1. 手動銷毀? getSession().invalidate();
2. 自動銷毀
*/
}
2.在web.xml中注冊監聽器
<listener>
<listener-class>com.kuang.listener.OnlineCountListener</listener-class>
</listener>
JDBC
什么是JDBC
JDBC：就是java鏈接數據庫
需要jar包的支持：
java.sql
javax.sql
mysql.conneter.java...連接驅動（必須導入）
IDEA中連接數據庫：
打開Datasouse 可以百度
JDBC固定步驟：
1.加載驅動
2.鏈接數據庫
3.向數據庫發送sql的對象Stetemnt
4.編寫sql
5.執行sql
6.關閉鏈接
//配置信息
//useUnicode=true&characterEncoding=utf-8 解決中文亂碼
Stringurl="jdbc:mysql://localhost:3306/jdbc?useUnicode=true&characterEncoding=utf-8";
Stringusername="root";
Stringpassword="123456";
?
//1.加載驅動
Class.forName("com.mysql.jdbc.Driver");
//2.連接數據庫,代表數據庫
Connectionconnection=DriverManager.getConnection(url,username,password);
?
//3.編寫SQL
Stringsql="insert into? users(id, name, password, email, birthday) values (?,?,?,?,?);";
?
//4.預編譯
PreparedStatementpreparedStatement=connection.prepareStatement(sql);
?
preparedStatement.setInt(1,2);//給第一個占位符？ 的值賦值為1；
preparedStatement.setString(2,"狂神說Java");//給第二個占位符？ 的值賦值為狂神說Java；
preparedStatement.setString(3,"123456");//給第三個占位符？ 的值賦值為123456；
preparedStatement.setString(4,"24736743@qq.com");//給第四個占位符？ 的值賦值為1；
preparedStatement.setDate(5,newDate(newjava.util.Date().getTime()));//給第五個占位符？ 的值賦值為new Date(new java.util.Date().getTime())；
?
//5.執行SQL
inti=preparedStatement.executeUpdate();
?
if(i>0){
System.out.println("插入成功@");
? ? ?? }
?
//6.關閉連接，釋放資源（一定要做） 先開后關
preparedStatement.close();
connection.close();
?
#### JDBC事務
要么都成功，要么都失敗
案例：轉賬，A--B 轉100 A-100 B+100 如果不開啟事務，服務器如果崩了，那么錢會減少而且到不了B賬戶。那么現在就需要開啟事務來執行，事務一旦開啟，只能提交才能，進行代碼，而且如果中途發生錯誤，可以回滾 到之前的狀態，防止以上問題
ACID原則：保證數據安全
setAutoCommit：開啟事務
commit：提交事物
roliBack：回滾事物
JavaScript
什么是JavaScript
javaScript是一門世界上最流行的語言
一個合格的后端人員，必須精通javaScript
2.1快速編寫一個javaScript
2.1內部標簽
<script>
? ? //....
<script>
2.2外部標簽
? ? ? <!--外部引入
注意：script必須成對出現
-->
<scriptsrc="js/hj.js"></script>
?
<!--不用顯示定義type，也默認就是javaScript-->
<scripttype="text/javascript"></script>
?
瀏覽器調試
2、數據類型
數值，文本，圖形，音頻，視頻
var 變量
number js中不區分 小數和整數， 是個數字類型
字符串 'abc'
邏輯符 && 兩個都為真，結果為真 ll 一個為真，結果為真 ！反著來
比較運算符 = 賦值 ==等于(類型不一樣。值一樣。也會判斷true) === 絕對等于(類型一樣，值一樣，結果為 ? ? ? true)
這是一個JS的缺陷，堅持不要使用 == 比較
null 和 undefined
null 空
undefined 未定義
數組
和java中的數組不同，不需要相同類型的，任何類型都可以存儲
如果取數組，數字下標，越界，就會報undefind
對象是大括號，數組是中括號
每個屬性之間使用逗號隔開，最后一個屬性不需要逗號
大小寫轉換
//注意，這里是方法，不是屬性了* student.toUpperCase(); student.toLowerCase();
數組
Array可以包含任意的數據類型
var arr = [1,2,3,4,5,6];//通過下標取值和賦值11、長度
arr.length1注意：假如給arr.lennth賦值，數組大小就會發生變化~，如果賦值過小，元素就會丟失
2、indexOf，通過元素獲得下標索引
arr.indexOf(2)112字符串的"1"和數字 1 是不同的
3、slice（）截取Array的一部分，返回的一個新數組，類似于String中substring4、push()，pop()尾部
push：壓入到尾部pop：彈出尾部的一個元素125、unshift(),shift() 頭部
unshift：壓入到頭部shift：彈出頭部的一個元素126、排序sort()
(3)["B","C","A"]arr.sort()(3)["A","B","C"]1237、元素反轉reverse()
(3)["A","B","C"]arr.reverse()(3)["C","B","A"]1238、concat()
注意：concat()并沒有修改數組，只是會返回一個新的數組
9、連接符join打印拼接數組，使用特定的字符串連接
10、多維數組
數組：存儲數據（如何存，如何取，方法都可以自己實現！）
對象
若干個鍵值對
var對象名={
? ? 屬性名：屬性值，
? ? 屬性名：屬性值，
? ? 屬性名：屬性值
}
多個屬性之間用逗號隔開，最后一個屬性不加逗號！
2、使用一個不存在的對象屬性，不會報錯！undefined
3、動態的刪減屬性，通過delete刪除對象的屬性
4、動態的添加，直接給新的屬性添加值即可
5、判斷屬性值是否在這個對象中！xxx in xxx
6、判斷一個屬性是否是這個對象自身擁有的 hasOwnProperty()
流程控制
if判斷
varage=3;
? ? if(age>3){
? ? alert("haha")
}elseif(){
....
? }
Map和Set
ES6的新特性~
MapSet：無序不重復的集合
iterator
es6新特性
作業：使用iterator來遍歷迭代我們Map，Set！遍歷數組遍歷Map遍歷set
函數
絕對值函數
functionabs(){
}
一旦執行到return代表函數結束，返回結果！如果沒有執行return，函數執行完也會返回結果，結果就是undefined
javaScript可以傳任意個參數，也可以不傳遞參數~
方法
方法就是把函數放在對象的里面，對象只有兩個東西：屬性和方法
varfeng={
name:function(){
return1
? }
}
內部對象
Date
轉換時間
JSON
json是什么
JSON是一種輕量級的數據交換格式
簡介和清晰的層次結構使得JSON成為理想的數據交換語言
采用完全獨立于編程語言的文本格式來存儲和表示數據
在 JavaScript 語言中，一切都是對象。因此，任何JavaScript 支持的類型都可以通過 JSON 來表示，例如字符串、數字、對象、數組等。看看他的要求和語法格式：
對象表示為鍵值對，數據由逗號分隔
花括號保存對象
方括號保存數組
JSON鍵值對形式 是用來保存javaScript對象的一種方式，和javaScript對象的寫法也大同小乙
鍵或者值。都用雙引號包裹，鍵和值以：冒號分開? 一組鍵值對以，號分開
JSON字符串和JS對象轉換
JSON和JS對象的區別
JSON是JavaScript對象的字符串表示法，它使用文本表示一個，JS對象信息，本質是一個字符串
用Controller返回JSON數據
Jackson應該是目前比較好的json解析工具了
當然工具不止這一個，比如還有阿里巴巴的 fastjson 等等。
我們這里使用Jackson，使用它需要導入它的jar包；
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.8</version>
</dependency>
需要兩個新東西，一個是Spring的注解@RespnonseBody，一個是ObjectMapper對象，
@Controller
publicclassUserController{
?
@RequestMapping("/json1")
@ResponseBody
publicStringjson1()throwsJsonProcessingException{
//創建一個jackson的對象映射器，用來解析數據
ObjectMappermapper=newObjectMapper();
//創建一個對象
Useruser=newUser("秦疆1號",3,"男");
//將我們的對象解析成為json格式
Stringstr=mapper.writeValueAsString(user);
//由于@ResponseBody注解，這里會將str轉成json格式返回；十分方便
returnstr;
? }
?
}
注意：瀏覽器可能會出現亂碼情況，我們需要設置他的編碼格式
通過@RequestMaping的produces屬性來實現，修改下代碼
//produces:指定響應體返回類型和編碼
@RequestMapping(value="/json1",produces="application/json;charset=utf-8")
亂碼統一解決
上一種方法比較麻煩，如果項目中有許多請求則每一個都要添加，可以通過Spring配置統一指定，這樣就不用每次都去處理了！
我們可以在springmvc的配置文件上添加一段消息StringHttpMessageConverter轉換配置！
<mvc:annotation-driven>
<mvc:message-convertersregister-defaults="true">
<beanclass="org.springframework.http.converter.StringHttpMessageConverter">
<constructor-argvalue="UTF-8"/>
</bean>
<beanclass="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
<propertyname="objectMapper">
<beanclass="org.springframework.http.converter.json.Jackson2ObjectMapperFactoryBean">
<propertyname="failOnEmptyBeans"value="false"/>
</bean>
</property>
</bean>
</mvc:message-converters>
</mvc:annotation-driven>
返回json字符串統一解決
在類上直接使用 @RestController ，這樣子，里面所有的方法都只會返回 json 字符串了，不用再每一個都添加@ResponseBody ！我們在前后端分離開發中，一般都使用 @RestController ，十分便捷！
@RestController
publicclassUserController{
?
//produces:指定響應體返回類型和編碼
@RequestMapping(value="/json1")
publicStringjson1()throwsJsonProcessingException{
//創建一個jackson的對象映射器，用來解析數據
ObjectMappermapper=newObjectMapper();
//創建一個對象
Useruser=newUser("秦疆1號",3,"男");
//將我們的對象解析成為json格式
Stringstr=mapper.writeValueAsString(user);
//由于@ResponseBody注解，這里會將str轉成json格式返回；十分方便
returnstr;
? }
?
}
輸出時間對象
增加一個新的方法
@RequestMapping("/json3")
public String json3() throws JsonProcessingException {
?
? ObjectMapper mapper = new ObjectMapper();
?
? //創建時間一個對象，java.util.Date
? Date date = new Date();
? //將我們的對象解析成為json格式
? String str = mapper.writeValueAsString(date);
? return str;
}
運行結果 :
默認日期格式會變成一個數字，是1970年1月1日到當前日期的毫秒數！
Jackson 默認是會把時間轉成timestamps形式
解決方案：取消timestamps形式 ， 自定義時間格式
@RequestMapping("/json4")
public String json4() throws JsonProcessingException {
?
? ObjectMapper mapper = new ObjectMapper();
?
? //不使用時間戳的方式
? mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
? //自定義日期格式對象
? SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
? //指定日期格式
? mapper.setDateFormat(sdf);
?
? Date date = new Date();
? String str = mapper.writeValueAsString(date);
?
? return str;
}
運行結果 : 成功的輸出了時間！
抽取為工具類
如果要經常使用的話，這樣是比較麻煩的，我們可以將這些代碼封裝到一個工具類中；我們去編寫下
package com.kuang.utils;
?
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.SerializationFeature;
?
import java.text.SimpleDateFormat;
?
public class JsonUtils {
? public static String getJson(Object object) {
? ? ? return getJson(object,"yyyy-MM-dd HH:mm:ss");
? }
?
? public static String getJson(Object object,String dateFormat) {
? ? ? ObjectMapper mapper = new ObjectMapper();
? ? ? //不使用時間差的方式
? ? ? mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
? ? ? //自定義日期格式對象
? ? ? SimpleDateFormat sdf = new SimpleDateFormat(dateFormat);
? ? ? //指定日期格式
? ? ? mapper.setDateFormat(sdf);
? ? ? try {
? ? ? ? ? return mapper.writeValueAsString(object);
? ?? } catch (JsonProcessingException e) {
? ? ? ? ? e.printStackTrace();
? ?? }
? ? ? return null;
? }
}
我們使用工具類，代碼就更加簡潔了！
@RequestMapping("/json5")
public String json5() throws JsonProcessingException {
? Date date = new Date();
? String json = JsonUtils.getJson(date);
? return json;
}
AJAX
AJAX 是一種，無需重新加載整個頁面的情況下，能夠更新部分網頁技術
AJAX 不是一種新的編程語言,而是一種用于創建更好更快以及交互性更強的WEB應用程序技術
在 2005 年，Google 通過其 Google Suggest 使 AJAX 變得流行起來。Google Suggest能夠自動幫你完成搜索單詞。
Google Suggest 使用 AJAX 創造出動態性極強的 web 界面：當您在谷歌的搜索框輸入關鍵字時，JavaScript 會把這些字符發送到服務器，然后服務器會返回一個搜索建議的列表。
就和國內百度的搜索框一樣!
傳統的網頁(即不用ajax技術的網頁)，想要更新內容或者提交一個表單，都需要重新加載整個網頁。
使用ajax技術的網頁，通過在后臺服務器進行少量的數據交換，就可以實現異步局部更新。
使用Ajax，用戶可以創建接近本地桌面應用的直接、高可用、更豐富、更動態的Web用戶界面。
利用AJAX可以做：
- 注冊時，輸入用戶名自動檢測用戶是否已經存在
- 登錄時，提示用戶名密碼錯誤
- 等等。。。
-
什么是異步？
異步請求就當發出請求的同時，瀏覽器可以繼續做任何事，Ajax發送請求并不會影響頁面的加載與用戶的操作，相當于是在兩條線上，各走各的，互不影響。
jQuery.ajax
AJAX核心是XMLHttpRequest對象，(XHR),XHR為向服務器發送請求和解析服務器響應提供了接口，能夠以異步的方式從服務器獲取新的數據
JQuery 提供了多個與AJAX有關的方法
通過JQuery.AJAX方法，您能夠使用HTTP Get和HTTp POst 從遠程服務器上請求文本，HTML.XML或者JSON 同時你能夠把這些外部數據直接載入網頁的被元素中，
JQuery 不是生產者 而是搬運工
jQuery Ajax本質就是 XMLHttpRequest，對他進行了封裝，方便調用！
jQuery.ajax(...)
部分參數：
url：請求地址
type：請求方式，GET、POST（1.9.0之后用method）
headers：請求頭
data：要發送的數據
contentType：即將發送信息至服務器的內容編碼類型(默認:"application/x-www-form-urlencoded; charset=UTF-8")
async：是否異步
timeout：設置請求超時時間（毫秒）
beforeSend：發送請求前執行的函數(全局)
complete：完成之后執行的回調函數(全局)
success：成功之后執行的回調函數(全局)
error：失敗之后執行的回調函數(全局)
accepts：通過請求頭發送給服務器，告訴服務器當前客戶端可接受的數據類型
dataType：將服務器端返回的數據轉換成指定類型
"xml":將服務器端返回的內容轉換成xml格式
"text":將服務器端返回的內容轉換成普通文本格式
"html":將服務器端返回的內容轉換成普通文本格式，在插入DOM中時，如果包含JavaScript標簽，則會嘗試去執行。
"script":嘗試將返回值當作JavaScript去執行，然后再將服務器端返回的內容轉換成普通文本格式
"json":將服務器端返回的內容轉換成相應的JavaScript對象
"jsonp":JSONP格式使用JSONP形式調用函數時，如"myurl?callback=?"jQuery將自動替換?為正確的函數名，以執行回調函數
面向對象編程
原型對象javascript、java、c#------面向對象；但是javascript有些區別！
類：模板
對象：具體實例
BOM對象(重點)
BOM是瀏覽器介紹
javascript和l瀏覽器的關系
BOM：瀏覽器對象模型
1、wiindow 代表瀏覽器窗口
2、screen 代表屏幕尺寸
3、location 代表當前頁面的URL信息
4、document 代表當前頁面，HTML。DOM文檔樹
獲取具體的文檔樹節點
document.getElementByID("AP")
獲取Cookie
document.cookie
5、history代表瀏覽器的歷史記錄 不建議使用
DOM對象(重點)
DOM：文檔對象類型
瀏覽器網頁就是一個Dom樹形結構！
更新：更新Dom節點
遍歷Dom節點：得到Dom節點
刪除：刪除一個Dom節點
添加：添加一個新的節點
1.獲得DOM節點
這是原生代碼，之后我們盡量都使用jQuery();
2.更新DOM節點
先獲取他的節點然后更新里面的內容
操作文本
操作css
3.刪除DOM節點
步驟：使用父節點刪除子節點 最后父節點刪除自己
表單
表單是 form 標簽
文本框? -- text
下拉框 -- select
單選框 -- radio
多選框 -- checkbox
隱藏域 -- hidden 可以用來隱藏提交某些 比如id
密碼卡 -- paswoord
。。。。。
想要獲得表單的提交信息就要使用dom對象
document.getElementById() 通過id選擇器來獲取
document.getElementsByTagName() 通過標簽名來查找元素
document.getElementsByClassName(name)? 通過類名來查找元素
提交表單。md5加密密碼，表單優化
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Title</title>
<!--MD5加密工具類-->
<scriptsrc="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js">
</script>
</head>
<body>
<!--表達綁定提交事件
? ? ? ? ? ? οnsubmit=綁定一個提交檢測的函數，true，false
? ? ? ? ? ? 將這個結果返回給表單，使用onsubmit接收
? ? ? ? -->
<formaction="https://www.baidu.com"method="post"onsubmit="return aaa()">
<p>
? ? <span>用戶名：</span><input type="text" id = "username" name = "username"/>
? ? </p>
<p>
? ? <span>密碼：</span><input type="password" id = "password" />
? ? </p>
<inputtype="hidden"id="md5-password"name="password">
<!--綁定事件onclick被點擊-->
<buttontype="submit">提交</button>
</form>
<script>
? ? functionaaa(){
alert(1);
varusername=document.getElementById("username");
varpwd=document.getElementById("password");
varmd5pwd=document.getElementById("md5-password");
//pwd.value = md5(pwd,value);
md5pwd.value=mad5(pwd.value);
//可以校驗判斷表單內容，true就是通過提交，false就是阻止提交
returnfalse;
? ? ? ? ?? }
</script>
</body>
</html>
JQuery
JAVAScript和JQuery的關系
JQuery是個庫，里面封裝了大量的JavaScript函數
獲取jQuery 去JQuery官網下載jar包
公式：$(){} 入口函數 頁面一打開就加載了
選擇器
//jQuery css中的選擇器它全部都能用！
$('p').click();//標簽選擇器
$('#id1').click();//id選擇器
$('.class1').click;//class選擇器
文檔工具站：http://jquery.cuishifeng.cn/
事件
鼠標事件
mousedown()(jQuery)----按下
mouseenter()(jQuery)
mouseleave()(jQuery)
mousemove()(jQuery)----移動
mouseout()(jQuery)
mouseover()(jQuery)
mouseup()(jQuery)
節點文本操作
$('#test-ul li[name=python]').text();//獲得值
$('#test-ul li[name=python]').text('設置值');//設置值
$('#test-ul').html();//獲得值
$('#test-ul').html('<strong>123</strong>');//設置值
?
css操作
$('#test-ul li[name=python]').css({"color","red"});
元素的顯示和隱藏，：本質display:none
$('#test-ul li[name=python]').show();顯示
$('#test-ul li[name=python]').hide();隱藏
學習的JS技巧
1、如何鞏固JS（看jQuery源碼，看游戲源碼！）
2、鞏固HTML、CSS（扒網站，全部down下來，然后對應修改看效果~）
F12 k + del
