? ?
JavaScrip
腳本語言：
特性：松散（對于開發(fā)者的要求低）
? 如：定義變量
嚴禁語言： int a=30；
松散語言：var a= 30；永遠不會認為開發(fā)者寫代碼有問題
分類：
ECMAScript:
計算機協(xié)會統(tǒng)一標準 只包含了基礎語法部分
版本區(qū)別｛
ECMASrcipt5(包含5）之前
ECMASrcipt6（ECMASrcipt2015 簡稱 ES6）包含了所有語言
｝
TypeScript(簡稱TS）
微軟出的js語言>js的超級
ECMASrcipt（語言基礎）
DOM、BOM操作：
DOM:操作頁面中的元素對象（標簽）
｛
批量創(chuàng)建
邏輯
交互
｝
BOM：瀏覽器的操作
｛
上一頁下一頁
歷史記錄
刷新
｝
webapl｛
webSocket(及時通訊)
音頻播放器
游戲（canvas）
webVR
｝
游戲引擎：coco? ? 白鷺? 微信小游戲
? ? ? ? ? ? ? ECMASrcipt
語言基礎
1.基礎語法：
預備知識:
(1)語句：通常一行代碼如添加一分號為一條語句
使用英文分號分隔
? (2)變量:目的通過一個名字來表示一個可以改變的值定義方式：var空格 變量名=值? 不賦值? var空格 變量名 war：為關鍵字?
變量名：開發(fā)這起的一個名字
變量名的命名規(guī)則：
不能使用關鍵字定義變量名
不能以數(shù)字開頭
不能以特殊符號開頭
定義變量名要有意義：
駝峰命名法：第一個首字母小寫其他首字母大寫
下劃線命名法
關鍵字（是由語言本事提供的名字，有固定意義的。如var就是定義變量的）：var? for while if static let等
意義：
變量名：開發(fā)者起的名字 外號? 標記
值（具體內(nèi)容）：數(shù)字 文字（字符串）數(shù)組 對象
（3）
2.opp（面向?qū)ο螅?/p>
JS的引入方式
1.<script>
var a=30;
<script>
2.<script src="js文件位置"> <script>
注釋：
單行：Ctrl+/
多行:ctrl+shift+/
運算符：
算數(shù)運算：+ - * / %(取余）必須數(shù)字與數(shù)字之間運算
數(shù)據(jù)類型：
Number：數(shù)字類型包含浮點和整數(shù)
String：字符串類型只要是使用雙引號或單引號包裹的
boolean：波爾類型;true(對）false（錯）
Array ：數(shù)組
Object：對象
Function：函數(shù)
數(shù)據(jù)類型的轉(zhuǎn)換：
字符串轉(zhuǎn)數(shù)字：
轉(zhuǎn)數(shù)字：parseLnt（）
轉(zhuǎn)浮點：parseFloat如果使用小數(shù)精度丟失｛
不要直接使用小數(shù)
一定要使用：1.乘以100倍精準的級別
｝prompr（）
輸入內(nèi)容：
使用代碼輸出變量
沒實際意義知識在控制臺輸出一下變量
console.log(a)日志
console.warn(a)警告
console.info(a)詳細詳細信息
調(diào)試方法：
1.console.log(a);日志
2.斷點調(diào)試：在程序中打點組織繼續(xù)執(zhí)行
首先根據(jù)經(jīng)驗定位到大概錯誤位置然后打開瀏覽器中
的Sources點擊要調(diào)試的js文件
在懷疑有錯誤的地方點個點（打斷點
）
程序重新運行會在斷點位置停止
->鼠標移動到斷點上面的變量
->就會顯示變量的值
如果繼續(xù)拍錯可以打多個斷點
通過播放鍵跳到下一個斷點
通過下一步執(zhí)行下一步代碼
復合運算符:
+= :var a=10;
? ? var b=20;
? ? a = a+=b;
-=:var a=10;
? ? var b=20;
? ? a = a-=b;
*=:var a=10;
? ? var b=20;
? ? a = a*=b;
/= :var a=10;
? ? var b=20;
? ? a = a/=b;
%=:var a=10;
? ? var b=20;
? ? a = a%=b;
++:自己給自己增加一個1加加減減在前先做自增減在做其他運算
加加減減在后先做其他運算（或別的操作）在做自增減
? --:自己給自己減少一個1
對比運算符：結(jié)果為Boolean類型的值分別為true和false。（> < >= <= ==（忽略數(shù)據(jù)的類型如:1=“1”） === (嚴格查看數(shù)據(jù)類型的必須類型與值都相同的如：1與“1”為不相同）!=(不等于不區(qū)分數(shù)據(jù)類型如：1與“1為相同”）!==（區(qū)分數(shù)劇類型如1與1“1”為不相同））
案例：d
分支結(jié)構(gòu)：
if(條件）
｛
當條件滿足執(zhí)行此內(nèi)容
｝
if（條件）｛
｝else｛
｝
if(條件）｛
｝else if（條件）｛
｝else｛
｝
三元運算（三目運算）：
經(jīng)常會代替if else語句
常用代碼：if(睡覺）｛
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 做夢
? ? ? ? ? ? ? ? ? ? ? ? ｝else｛
掌握三元運算
? ? ｝
三元運算：條件？滿足執(zhí)行，不滿足不執(zhí)行
//隨機數(shù)
//Math 數(shù)學函數(shù)
//random 隨機函數(shù)
var num3=Math.random();
console.log(num3);
邏輯運算：
與（&&）：所欲條件都必須滿足才算真的；
或（||）：兩個條件中只要有一個條件滿足就為真；
非（！）：黑白顛倒，對的就是錯的，錯的就是對的。
表示為真
* true
* 1
* 由內(nèi)容的字符串“xx”
* 有值的對象
* 表示為假的
* 0
* false
* null
* nudefineded
* NAN
* 空字符串“”
switch:選擇其中的某一個點子（case）
switch(變量）｛
case值1：
break；
case值2：
break；
default：
｝
break：不是強制添加如果不添加break程序會繼續(xù)執(zhí)行下面的條件。
循環(huán)結(jié)構(gòu)：
1、知道循環(huán)次數(shù)（for）
for（var i=0; i<5; 1++）｛
｝
var i=0;初始化變量；
i<5;循環(huán)的條件；
i++；更改變量的值
for循環(huán)的執(zhí)行流程
continue：
從continue的開始部分跳出循環(huán)
continue前的不會跳過
道循環(huán)次數(shù)（while）
while：while(條件)｛循環(huán)體｝；
do while：不管條件漫步滿足先執(zhí)行一次循環(huán)（計入總循環(huán)次數(shù)）公式：do ｛? }while ()
例： var index=0;
? do {
document.write("1212");
document.write("<br>");
index++;
if (index>10)break;
? }while (1)
函數(shù)
具備某些工能的工具
四種類型：
有返回值：
帶參數(shù)
不帶參數(shù)
無返回值：
帶參數(shù)
不帶參數(shù)
function hanShuMing（函數(shù)名）(? ? ) {
? ? alert("函數(shù)")
}
調(diào)用函數(shù)
hanShuMing():
2.var xx=function (? ? ) {
? ? 函數(shù)體
console.log("xxxxxx")
}
調(diào)用函數(shù)體—>函數(shù)體的代碼才會執(zhí)行
xx(? ? );
內(nèi)置函數(shù)｛
console.log（）
alert（）
Math.radom（）
prompt（）
｝
參數(shù)：
形式參數(shù)：形參沒有實際意義代表著即將傳進來的實參。
實際參數(shù)：實參是個實實在在的一個值
作用域：概念 ——》變量起作用的范圍
局部變量：作用域只在定義的函數(shù)體里面，在函數(shù)外面是不可以使用的。
全局變量：
自執(zhí)行函數(shù)：自執(zhí)行函數(shù) 解決作用域的問題（防止多個js文件間變量的互相影響）
(function () {
var num=20;
})()
返回值：帶返回值的函數(shù)是是什么？返回值是什么函數(shù)就表示的是什么
function x（）｛return｝
return（值）：放到函數(shù)中：
return有值時：有返回值的函數(shù)
return沒值時：跳出函數(shù)
? ? ? ? ? ? ? 數(shù)組
概念：有序排列的集合
標識數(shù)組中元素位置的叫做下標或索引；
下標;可以通過下標找到數(shù)組中的元素，可以通過下標改變這個位置的值；
數(shù)組中下標是從0開始的；
創(chuàng)建數(shù)組：字面量的方式var a=[? ? ]；
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? var b=[? "悟空 "，“八戒”，“和尚” ]
通過類名創(chuàng)建數(shù)組：var arr= new Array(? )
獲取數(shù)字中的元素：數(shù)組名[ 下標 ]；var a=["王八","烏龜","甲魚","鱉"];
var b=a[1];
a[0]="健權";
替換（修改）數(shù)組中的元素:數(shù)組名[下標]=新值；
遍歷數(shù)組（把數(shù)組中的元素逐個讀取出來）：for循環(huán)，forEach；
數(shù)組
1.屬性：長度:(數(shù)組名：length)：數(shù)組中有多少個元素->數(shù)字是多少
2.方法
在數(shù)組中最后一個位置插入（刪除）數(shù)據(jù)：
1.插入數(shù)據(jù)：數(shù)組名+點+push
2.刪除數(shù)組中最后一個；數(shù)組名+點+pop；
在數(shù)組中第一個位置插入（刪除）數(shù)據(jù)：
1.插入輸入unshift
2.刪除數(shù)據(jù)shift
翻轉(zhuǎn)數(shù)組（把數(shù)組中的元素順序顛倒）：reverse：會返回一個新的數(shù)組
如：var ss=[22,33,77]
var ww=ss.reverse(? );
document.write(ww)
document.write("<br>")；
合并數(shù)字;(concat)把兩個或多個數(shù)組合并成一個新的數(shù)組
數(shù)組排序：（sort）數(shù)組+點+函數(shù)（a,b,）{return a>b;}
數(shù)組轉(zhuǎn)字符串：
1.toString(萬能法）
2.join（“”）
在數(shù)組中插入一個元素：splice：公式：數(shù)組名+點splice（插入位置（下標），刪除元素數(shù)量，插入的元素（數(shù)據(jù)是什么））
刪除元素：splice公式：數(shù)組名+點 splice（刪除元素位置，刪除元素數(shù)量）->返回的數(shù)組為刪除的那些元素
截取數(shù)組：slice：公式：數(shù)組名+點+slice（開始下標，結(jié)束的下標）
? ? ? ? ? ? ? 字符串
屬性：長度（lenght）
方法：
1.字符串轉(zhuǎn)數(shù)組：split:
2.替換字符串：replace（查詢的字符串，替換的字符串）->會得到一個新的變量
3.查詢字符串:search:(查詢的內(nèi)容）正數(shù)和0為查詢到第一個數(shù)的位置-1為沒有查詢到
4.toLowerCase(轉(zhuǎn)小寫）：
5.toUpperCase（轉(zhuǎn)大寫）:
6.查詢某個字符在源字符串的位置（indexOf）
7.查詢某個位置的字符（charAt）
8.截?。╯lice）
9.查詢字符串：（match）可用正則
正則表達式：
input：value:輸入框的輸入值
DOM:獲取DOM（html）元素：document.querySelector(點+選擇器的名字）
DOM
獲取DOM元素
1.
document.querySelector("選擇器的名字")
2.
3.
4.
創(chuàng)建DOM元素
刪除DOM
清空DOM
插入文本
插入HTML
添加事件:鼠標事件.鍵盤事件.拖拽事件
? ? ? ? ? ? ? ? ? ? ? ? 日期
日期對象
Date：創(chuàng)建日期對象：獲取當前日期；var data=new Date(? )
new：是通過類名創(chuàng)建的對象
Date：是個日期類
通過日期類創(chuàng)建一個當前的日期
筆記截圖
獲取周日：周日為0；周一為1。。。。。
? ? ? ? 定時器（單位毫秒）
不可以重復使用多個定時器否則定時器的時間會疊加
用完要刪除定時器
刪除延遲定時器clearTimeOut(標記)
1.延遲執(zhí)行：
var 標記 =? setTimeout(執(zhí)行函數(shù)，延遲時間)
var bg=document.querySelector(".bg")
var setu=setTimeout(function () {
? bg.style.background="yellow"
? 清除定時器
? clearTimeout(setu);
},1000*2);
2.重復執(zhí)行
js的引入方式；
1.在head中引入（還未在HTML標簽就在js中查-》查不到）
2.在body結(jié)束標簽上面引入（可以避免查找不到HTML）
? ? ? ? ? ? ? ? ? ? ? DOM
1.查詢DOM元素：
（1）document.querySelector(“選擇器的名字”)
特點：查找的是第一個元素
（2）document.querySelectorAll(“選擇器”)
特點：查找偽數(shù)組
（3）ID選擇器不需要加＃document.getElementById
特點：查找ID
類選擇器
（4）通過類選擇器? getElementsByClassName("")
（5）document.getElementsByTagName("div")
特點-偽類數(shù)組
2.創(chuàng)件DOM的方法
（1）document.createElement(? "標簽的名字")
3.DOM的操作
（1）把DOM放到父元素里面，
公式：父元素+點+appendChild
（ 2? ）刪除元素
（ 3? ）替換元素
? ( 4 )? 復制元素:cloneNode(? )
4設置DOM的樣式：
1.獲取編譯完成的樣式（css里面的樣式)getComputedStyle(dom)
公式DOM.style
5.設置元素的屬性
（1）dom元素點屬性名=屬性值
查詢：dom元素點屬性名
（2）dom元素點setAttribute（屬性名）
查詢DOM元素點getAttribute(" ")
設置屬性：setAttribute·
讀取屬性：getAttribute
//設置類選擇器的名字
.className="ttt"
? ? ? ? ? ? ? ? ? ? 事件
1.鼠標事件
（1）點擊事假：onClick
dom.onClick=function(事件對象)｛｝
（2）移動事件：onmousemove:鼠標的時間對象
pageX：光標在頁面X軸的位置
pageY:? 光標在頁面y軸的位置
（3）鼠標移入事件
onmouseover:先調(diào)用
onmouseenter：后調(diào)用
(4)移除的事件
onmouseseleave：先調(diào)用
onmouseout：后調(diào)用
2.鍵盤事件
(1)onkeydown：（按下鍵盤觸發(fā)的事件）
dom.onkeydown=function(){}
(2)onkeyup：鍵盤按下抬起時觸發(fā)
(3)onkeypress：按鍵盤就觸發(fā)
當鍵盤事件觸發(fā)的時候會獲得一個事件對象（Event）
code：區(qū)分按下的是哪個鍵
keycode：區(qū)分按下的是哪個鍵
3.狀態(tài)事件
input的狀態(tài)：光標閃爍的狀態(tài)（onfocus），失去光標的時候(onblue),里面文字發(fā)生改變的時候(onchange,)只要用戶輸入就會改變（oninput）
JSON對象：（json是一種數(shù)據(jù)格式，沒有語言限制）
數(shù)據(jù)格式：｛
"鍵"：值，（由逗號分隔開）
"鍵"：[1,2,3,4,]，
｝
js里面的JSON對象
｛由? ? 鍵：值，
? ? ? ? ? 鍵：值
｝
XML：（數(shù)據(jù)格式?jīng)]有語言限制）很類似與HTML格式
? ? ? ? ? ? ? ? ? ? ? ? ? 事件監(jiān)聽
1.添加監(jiān)聽事件：
dom點addEventListener（“事件名”，函數(shù)）
2.移除監(jiān)聽事件：
dom點remoerEventListener("事件名"，函數(shù))
事件技巧：
1.阻止元素的默認行為
event.preventDefault()
例：去掉a標簽刷新頁面（跳轉(zhuǎn)）頁面的功能
表單標簽里面的<input type="submit"><input type="rest">
2.事件冒泡或捕獲
事件冒泡：是從內(nèi)向外觸發(fā)（默認行為為事件冒泡）
事件捕獲：從外向內(nèi)觸發(fā)
Event所有事件的先祖
MouseEvent
keyboardEvent
function f1(a,b) {
? ? ? ? //arguments是傳入進去的全部參數(shù)(參數(shù)列表)->數(shù)組
? ? ? ? console.log(arguments[0])
? ? ? ? console.log(a)
? ? }
? ? f1(3,6,9,10)
? ? f1(83,6,9,10,77)
? ? f1(13,6,9,10,77,3,77,98)
