2021-03-02

JavaScrip腳本語言:

特性:松散(對于開發(fā)者的要求低)

? 如:定義變量嚴禁語言: int a=30氓栈;

松散語言:var a= 30撑柔;

永遠不會認為開發(fā)者寫代碼有問題

分類:ECMAScript:計算機協(xié)會統(tǒng)一標準 只包含了基礎(chǔ)語法部分版本區(qū)別{ECMASrcipt5(包含5)之前ECMASrcipt6(ECMASrcipt2015 簡稱 ES6)包含了所有語言}TypeScript(簡稱TS)微軟出的js語言>js的超級ECMASrcipt(語言基礎(chǔ))

DOM、BOM操作:DOM:操作頁面中的元素對象(標簽){批量創(chuàng)建邏輯交互}

BOM:瀏覽器的操作{上一頁下一頁歷史記錄刷新}webapl{webSocket(及時通訊)音頻播放器游戲(canvas)webVR}

游戲引擎:coco? ? 白鷺? 微信小游戲? ? ? ? ? ?

? ECMASrcipt語言基礎(chǔ)

1.基礎(chǔ)語法:預備知識:(1)語句:通常一行代碼如添加一分號為一條語句使用英文分號分隔

? (2)變量:目的通過一個名字來表示一個可以改變的值定義方式:var空格 變量名=值? 不賦值? var空格 變量名 war:為關(guān)鍵字

變量名:開發(fā)這起的一個名字變量名的命名規(guī)則:不能使用關(guān)鍵字定義變量名不能以數(shù)字開頭不能以特殊符號開頭定義變量名要有意義:駝峰命名法:第一個首字母小寫其他首字母大寫下劃線命名法關(guān)鍵字(是由語言本事提供的名字,有固定意義的。如var就是定義變量的):var? for while if static let等意義:

變量名:開發(fā)者起的名字 外號? 標記值(具體內(nèi)容):數(shù)字 文字(字符串)數(shù)組 對象

(3)2.opp(面向?qū)ο螅㎎S的引入方式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ù)精度丟失

war:為關(guān)鍵字變量名:開發(fā)這起的一個名字變量名的命名規(guī)則:不能使用關(guān)鍵字定義變量名不能以數(shù)字開頭不能以特殊符號開頭定義變量名要有意義:

駝峰命名法:第一個首字母小寫其他首字母大寫下劃線命名法關(guān)鍵字(是由語言本事提供的名字,有固定意義的辽装。如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); 邏輯運算:與(&&):所欲條件都必須滿足才算真的;或(||):兩個條件中只要有一個條件滿足就為真丰涉;非(M厍伞):黑白顛倒,對的就是錯的一死,錯的就是對的肛度。表示為真* 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]="健權(quán)";替換(修改)數(shù)組中的元素:數(shù)組名[下標]=新值;遍歷數(shù)組(把數(shù)組中的元素逐個讀取出來):for循環(huán)峻厚,forEach响蕴;數(shù)組1.屬性:長度:(數(shù)組名:length):數(shù)組中有多少個元素->數(shù)字是多少2.方法在數(shù)組中最后一個位置插入(刪除)數(shù)據(jù):1.插入數(shù)據(jù):數(shù)組名+點+push2.刪除數(shù)組中最后一個;數(shù)組名+點+pop惠桃;在數(shù)組中第一個位置插入(刪除)數(shù)據(jù):1.插入輸入unshift2.刪除數(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.截确实蕖(slice)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)? ? ? ? ? ? DOM1.查詢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.style5.設置元素的屬性(1)dom元素點屬性名=屬性值查詢:dom元素點屬性名(2)dom元素點setAttribute(屬性名)查詢DOM元素點getAttribute(" ")設置屬性:setAttribute·讀取屬性:getAttribute//設置類選擇器的名字.className="ttt"? ? ? ? ? 事件1.鼠標事件(1)點擊事假:onClickdom.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所有事件的先祖MouseEventkeyboardEventfunction 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)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末熙兔,一起剝皮案震驚了整個濱河市悲伶,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌住涉,老刑警劉巖麸锉,帶你破解...
    沈念sama閱讀 217,084評論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異舆声,居然都是意外死亡花沉,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,623評論 3 392
  • 文/潘曉璐 我一進店門媳握,熙熙樓的掌柜王于貴愁眉苦臉地迎上來碱屁,“玉大人,你說我怎么就攤上這事蛾找∶淦ⅲ” “怎么了?”我有些...
    開封第一講書人閱讀 163,450評論 0 353
  • 文/不壞的土叔 我叫張陵打毛,是天一觀的道長柿赊。 經(jīng)常有香客問我俩功,道長,這世上最難降的妖魔是什么碰声? 我笑而不...
    開封第一講書人閱讀 58,322評論 1 293
  • 正文 為了忘掉前任诡蜓,我火速辦了婚禮,結(jié)果婚禮上奥邮,老公的妹妹穿的比我還像新娘万牺。我一直安慰自己,他們只是感情好洽腺,可當我...
    茶點故事閱讀 67,370評論 6 390
  • 文/花漫 我一把揭開白布脚粟。 她就那樣靜靜地躺著,像睡著了一般蘸朋。 火紅的嫁衣襯著肌膚如雪核无。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,274評論 1 300
  • 那天藕坯,我揣著相機與錄音团南,去河邊找鬼。 笑死炼彪,一個胖子當著我的面吹牛吐根,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播辐马,決...
    沈念sama閱讀 40,126評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼拷橘,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了喜爷?” 一聲冷哼從身側(cè)響起冗疮,我...
    開封第一講書人閱讀 38,980評論 0 275
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎檩帐,沒想到半個月后术幔,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,414評論 1 313
  • 正文 獨居荒郊野嶺守林人離奇死亡湃密,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,599評論 3 334
  • 正文 我和宋清朗相戀三年诅挑,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片泛源。...
    茶點故事閱讀 39,773評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡揍障,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出俩由,到底是詐尸還是另有隱情娇跟,我是刑警寧澤红碑,帶...
    沈念sama閱讀 35,470評論 5 344
  • 正文 年R本政府宣布浙垫,位于F島的核電站呈驶,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏碘梢。R本人自食惡果不足惜咬摇,卻給世界環(huán)境...
    茶點故事閱讀 41,080評論 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望煞躬。 院中可真熱鬧肛鹏,春花似錦、人聲如沸恩沛。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,713評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽雷客。三九已至芒珠,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間搅裙,已是汗流浹背皱卓。 一陣腳步聲響...
    開封第一講書人閱讀 32,852評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留部逮,地道東北人娜汁。 一個月前我還...
    沈念sama閱讀 47,865評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像兄朋,于是被迫代替她去往敵國和親掐禁。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,689評論 2 354

推薦閱讀更多精彩內(nèi)容

  • javascrpit 基礎(chǔ)語法 1.語句:通常一行代碼如果添加了分號 認為這是一條語句使用分隔 2.變量:目的:通...
    言術(shù)閱讀 411評論 0 2
  • 1蜈漓、js是什么 js是可以嵌入到html中穆桂,是 基于對象 和 事件驅(qū)動 的 腳本語言 特點: (1)交互性 (2)...
    Sunflower_ca62閱讀 366評論 0 1
  • 基礎(chǔ)語法 預備知識 1.語句 通常一行代碼 如果添加了分號->一條語句 使用;分隔 2.變量...
    355845cfed2b閱讀 286評論 0 0
  • 1.語句 通常一行代碼 如果添加了分號->一條語句 使用融虽;分隔 2.變量 目的 通過一個名字 來表示一個可以改變的...
    青梅姑娘_54de閱讀 404評論 0 1
  • 推薦指數(shù): 6.0 書籍主旨關(guān)鍵詞:特權(quán)享完、焦點、注意力有额、語言聯(lián)想般又、情景聯(lián)想 觀點: 1.統(tǒng)計學現(xiàn)在叫數(shù)據(jù)分析,社會...
    Jenaral閱讀 5,719評論 0 5