當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

JS每日笔记

發布時間：2024/1/18 javascript 31 豆豆

生活随笔收集整理的這篇文章主要介紹了 JS每日笔记小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

js 簡介

JS是什么

JS是一種運行在客戶端的腳本語言，最早是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增加動態功能
瀏覽器就是一種運行JS腳本語言的客戶端，JS的解釋器被稱為JS引擎，為瀏覽器的一部分

JS 的組成

JavaScript 是由 ECMAScript，DOM 和 BOM 三者組成的。
ECMAScript: 定義了JavaScript 的語法規范,描述了語言的基本語法和數據類型
DOM (Document Object Model): 文檔對象模型
BOM (Browser Object Model): 瀏覽器對象模型

js 的三種書寫方式

行內式（強烈不推薦）

? ? =>a 標簽
? ? =>書寫在 href 屬性上，一定要書寫一個 javascript；一段js 代碼；

=>非a標簽
? ?-> 書寫一個行為屬性，例如：onclick（當點擊在標簽身上的時候）
? ?->直接在屬性值的位置書寫 js 代碼即可?

內嵌式（不太推薦）

=>在html 頁面內書寫一個 script 標簽，把js 代碼書寫在 script標簽內

=>注意

1.script 標簽內的代碼會直接執行，不需要依賴行為 2.script標簽推薦書寫在 head body的末尾

3.一個頁面可以書寫多個script標簽，會按照從上到下依次執行 <body><script>alert('hello world')</script> </body>

外鏈式（推薦）

? ? ? =>把 js 代碼書寫在一個 .js后綴的文件內，在當前 html 文件內以 script 標簽的script 標簽的 src 屬性引入頁面
? ? ? =>注意： 1.script 標簽引入的 js 文件會直接執行，不需要依賴行為
?2.script 標簽書寫在 body 的末尾或者 head 的末尾
?3.一個標簽被當作外鏈式引入js文件后，就不能被當作內嵌式使用了

js 定義變量

?什么是變量？

?變量是計算機內存中存儲數據的標識符，根據變量名稱可以獲取到內存中存儲的數據；
?變量其實就相當于一個容器，內部可以存儲任意類型的數據，使用變量時，用的是內部存儲的數據。

為什么要定義變量？

使用變量可以方便的獲取或者修改內存中的數據

如何定義變量

使用一個 var 的關鍵字進行定義，后面必須加一個空格，空格后面自定義變量名

var a; var b; var c;

變量賦值

變量定義之后，初始時沒有進行賦值，內部有一個默認存儲的值叫 undefined(未定義) 表示內部未賦值，但可以存儲數據了
變量賦值的方式：通過等號 = 賦值，等號右邊的值賦值給左邊的變量 ==（等號在 JS 中叫做賦值號；書寫時，等號 = 兩側習慣書寫一個空格）==

// 變量定義 var a; // 變量賦值 a = 1; // 變量定義并賦值 var b = 2;

使用變量

直接寫變量名即可使用變量；變量在使用前，必須先有定義，如果沒有定義，會出現引用錯誤

變量命名規則（必須遵守，不遵守會報錯）

由字母、數字、下劃線、$符號組成，不能以數字開頭
字母區分大小寫
不能是關鍵字和保留字
關鍵字指的是js中有特殊功能的小詞語，比如var、for等
保留字指的是現在沒有特殊功能，但是將來新語法中有可能作為關鍵字使用

變量命名規范（建議遵守的，不遵守不會報錯）

變量名必須有意義
遵守駝峰命名法

js 數據類型

JS中的值，無論是字面量還是變量，都有明確的類型

數據類型分類(以基本數據類型為主)
- Number 數字類型
  - 不區分整數、浮點數、特殊值，都是 Number 類型
- String 字符串類型
  - 所有的字符串都是 String 類型
- undefined undefined類型
  - ndefined本身就是一個數據，表示未定義，變量只聲明不賦值的時候，值默認是 undefined
- Boolean 布爾類型
  - Boolean 字面量：只有 true 和 false 兩個字面量的值，必須是小寫字母
  - 計算機內部存儲：true 為 1，false 為 0
- null null類型
  - null 本身就是一個數據
  - 從邏輯角度，null 值表示一個空對象指針
  - 如果定義的變量準備在將來用于保存對象，最好該變量初始化為 null
- Object 對象類型（后續課程詳細講解）

數據類型檢測

為什么要有數據類型檢測？
- JS語言是一門動態類型的語言，變量并沒有一個單獨的數據類型，而是會隨著內部存儲數據的變化，數據類型也會發生變化
- 變量的數據類型，與內部存儲數據有關
- 將來使用變量時，需要知道內部存儲的數據是什么類型，避免程序出錯
使用 typeof 的方法進行數據檢測
- 檢測方式：在 typeof 后面加小括號執行，將要檢測的數據放在小括號內部

數據類型轉換(轉數值 / 轉字符串 / 轉布爾)

轉數值

Number(數據)方法

轉型函數Number()可以用于任何數據類型，將其他數據類型轉為數字
字符串：純數字字符串轉為對應數字，空字符串和空白字符串轉為0，非空非純數字字符串轉為NaN
布爾值：true轉為1，false轉為0
undefined：轉為NaN
null：轉為0

parseInt()方法：字符串轉整數方法

對浮點數進行取整操作
- 對數字取整直接舍棄小數部分，只保留整數
將字符串轉為整數數字
- 將字符串轉為整數數字，也包含取整功能
字符串中，必須是純數字字符串或者數字字符開頭的字符串，才能轉換為正常數字，且只取整數部分
如果不是數字打頭的字符串，會轉換為NaN

parseFloat()方法：字符串轉浮點數方法

將字符串轉為浮點數數字
滿足浮點數數字字符必須在字符串開始，如果不在開始返回值都是NaN

轉字符串

變量.toString()方法

String(變量)方法，有些值沒有toString()，這個時候可以使用String()。比如undefined和null

+ 號拼接字符串方式

num + “” ,當 + 兩邊一個操作符是字符串類型，一個操作符是其他類型的時候，會先把其他類型轉換成字符串在進行字符串拼接，返回字符串

轉布爾

Boolean(變量)方法

轉型函數Boolean()可以用于任何數據類型，將其他數據類型轉為布爾類型的值
轉為false：NaN、0、“”空字符串、null、undefined
轉為true：非0 非NaN數字、非空字符串

js 運算符

什么是運算符？
- 也叫操作符，是 JS 中發起運算最簡單的方式，例如： 5 + 6
- 表達式的組成包含操作數和操作符，表達式會得到一個結果，然后用結果參與程序

JS 運算符分類

算數運算符(?+?/?-?/?*?/?/?/?%?)
- 運算順序與數學中的運算順序一致，先乘除取余，后加減，有小括號先算小括號
賦值運算符(?=?/?+=?/?-=?/?*=?/?/=?/?%=?)
比較運算符(?>?/?<?/?>=?/?<=?/?==?/?===?/?!=?/?!==?)
- 比較結果只會返回一個布爾類型值，true 或者 false
邏輯運算符(?&&?/?||?/?!?)
自增自減運算符(?++?/?--?)

運算符優先級從高到低

自增自減運算符++ -- !
算術運算符先* / % 后+ -
比較運算符中的 > >= < <=
比較運算符中的 == != === !==
邏輯運算符先&& 后||
賦值運算符

JS分支語句

JS 代碼是從上往下按照順序依次執行的, 從第一行代碼一直執行到最后一行
如果有一種情況是我有兩段代碼, 我只需要執行其中一個即可, 那么就可以用到分支語句
簡單來說: 分支語句就是根據我們設定好的條件來決定要不要執行某些代碼

if 分支語句

if 分支語句的基本書寫
- 語法:?if (條件) { 想要執行的代碼 }
if (true) {console.log('因為條件是 true 所以我可以打印出來') } /*語法分析:if: 關鍵字,表明后續是一段if分支語句(): 小括號內部填寫條件, 用于決定是否執行后續內容{}: 花括號內部填寫要執行的分支代碼, 如果條件為真, 則會執行 */
if ... else 語句的基本書寫
- 語法:?if (條件) { 條件為真時執行的代碼 } else { 條件為假時執行的代碼 }
if (true) {console.log('因為條件是 true 所以我可以打印出來') } else {console.log('因為條件是 true 所以我不會被打印') } if (false) {console.log('因為條件是 false 所以我不會被打印') } else {console.log('因為條件是 false 所以我可以打印出來') } /*** 語法分析:if: 關鍵字,表明后續是一段if分支語句(): 小括號內部填寫條件, 用于決定是否執行后續內容{}: 花括號內部填寫要執行的分支代碼, 如果條件為真, 則會執行else: 表明前邊條件都為false時,執行后續的花括號內的代碼*/ 復制代碼
if 嵌套語句的基本書寫
- 可以通過?if?和?else if?來設置多個條件進行判斷
- 語法:?if(條件1){條件1為true時執行} else if (條件2){條件2為true時執行}
- 會從頭開始依次判斷條件
- 如果第一個條件為 true 了, 那么就會執行后面的 {} 的內容
- 如果第一個條件為 false, 那么就會判斷第二個條件
- 如果第二個條件也為 false, 那么會依次往后執行
- 注意
- 多個 {} 只會有一個被執行, 一旦有一個條件為 true 了, 后面的就不再判斷了
- 如果所有的條件都為 false, 那么會執行最后的 else {} 分支
- 如果所有的條件都為 false, 且沒有最后的 else {} 分支, 那么當前 if 分支不會有任何代碼段會被執行

switch 分支語句

switch 也是條件判斷語句的一種, 是對于某一個變量的判斷(三個等于號全等的判斷,數據類型不一致時會導致判斷失敗)
- switch 分支語句的基本書寫
switch (要判斷的變量) {case 情況1:情況1執行的代碼break;case 情況2:情況2執行的代碼break;case 情況3:情況3執行的代碼break;default:上述情況都不滿足時執行的代碼 } 復制代碼
- switch 通常是判斷某一個變量等于某一個值的時候使用, 比如用戶輸入一個數字顯示今天周幾, 輸入一個數字顯示今天是幾月
switch 穿透語句的基本書寫
- 從第一個滿足條件的 case 開始
- 如果沒有 break, 一直執行代碼直到遇到一個 break 或者 switch 結束

三元表達式

三元表達式(三元運算/三目運算/三目/問號冒號表達式)
語法：條件？條件正確時執行的代碼：條件不正確時執行的代碼

// 給變量賦值 var num = 1 // 我們暫且規定 num == 1 時代表為男性,
num == 2 時代表為女性
var gender = num == 1 ? '男' : '女' console.log(gender)

# 循環語句

什么是循環語句
- 根據某些給出的條件,重復執行同一段代碼
循環必須要有某些固定的內容組成
- 初始化
- 條件判斷
- 要執行的代碼
- 自身改變

while 循環語句

while，中文叫當…時，其實就是當條件滿足時就執行代碼，一旦不滿足了就不執行了
語法?while (條件) { 滿足條件就會執行 }
因為滿足條件就執行, 所以我們寫的時候一定要注意, 就是設定一個邊界值, 不然就一直循環下去了, 簡稱: 死循環, 電腦卡死的時間根據電腦性能有所不同, 建議不要嘗試

// 1. 初始化條件 var num = 0 // 條件判斷 while (num < 10) {// 3. 要執行的代碼console.log('當前 num 的值是: ', num)// 4. 自身改變num += 1 // 如果沒有這行代碼, 那么自身就沒有改變, 條件將會一直滿足, 代碼也就會一直執行 } 復制代碼

do...while 循環語句

是一個和 while 循環類似的循環
while 會先進行條件判斷, 滿足就執行, 不滿足就直接不執行了
do...while 的循環是先不管條件, 先執行一次, 然后再開始進行條件判斷
語法:?do { 要執行的代碼 } while (條件)

// 1. 初始化 var num = 10; do {// 3. 要執行的代碼console.log('我執行了一次')// 4. 自身改變num += 1 // 2. 條件判斷 } while (num < 10) 復制代碼

for 循環語句

和 while do while 循環都不太一樣的一種循環結構
但道理是和其他兩種一樣的, 都是循環執行代碼的
語法:?for (var i = 0; i < 10; i++) { 要執行的代碼 }

// 把初始化, 條件判斷, 自身改變, 都統一寫在了一起 for (var i = 1; i <= 10; i++) {console.log(i) // 會打印 1~10 } // 初次使用時會覺得有一點繁瑣與不習慣, 但是用起來比較好用復制代碼

流程控制語句

break 關鍵字的應用
- 在循環沒有進行完畢的時候, 因為我設置的條件滿足了, 就直接提前終止循環
- 舉個例子: 我要吃五個包子, 我吃了三個了, 這時候吃飽了吃不下去了, 我就停止了繼續吃包子這件事
- 那么此時要停止循環, 就可以直接使用 break 關鍵字

for (var i = 1; i <= 5; i++) {// 每循環一次,就吃一個包子console.log('我吃了一個包子')// 當 i == 3 的時候, 條件為 true, 執行了 {} 里面的代碼終止循環, 循環就不會繼續向下執行了, 也就沒有 4 和 5 了if (i == 3) {break} } 復制代碼

continue 關鍵字的應用
- 在循環中, 把循環的本次跳過去, 繼續執行后續的循環
- 舉個例子: 還是吃五個包子, 要吃第三個的時候, 第三個掉地上了, 所以就不吃第三個了, 繼續吃第四個和第五個
- 跳過本次循環, 就可以使用 continue 關鍵字

for (var i = 1; i <= 5; i++) {// 當 i == 3 的時候, 執行 {} 里面的代碼// {} 里面有 continue, 那么本次循環后面的代碼就都不執行了// 自動算作 i 為 3 的這一次結束了, 去繼續執行 i == 4 的那次循環if (i == 3) {console.log('這是第三個包子, 掉地下了, 我不吃了')continue}console.log('我吃了一個包子') } 復制代碼

循環嵌套的書寫

循環嵌套其實就是一個循環內部又寫了一個循環

for (var i = 0; i < 3; i++) { // 這個循環稱為外層循環for (var k = 1; k < 4; k++) { // 這個循環稱為內層循環/*** 重點!!!* 兩個循環的循環變量不能相同, 會有沖突*/} }

函數

什么是函數？
- 在 JS 中，函數可以理解為將一段在程序中多次出現的代碼封裝起來的盒子，以便在多個地方調用執行
- 換句話說：函數就是一個內部封裝了部分代碼的盒子，可以在多個位置被調用
函數的使用
- 創建函數（定義函數）
- 調用函數

函數的定義

聲明式定義

function fn() {} /*** 分析：* function：聲明函數的關鍵字，代表接下來這段代碼是一個函數* fn：函數名，調用函數時需要使用，函數名自定義，符合命名規范和見名知意即可（!** 匿名函數時可以不寫）* ()：小括號內存放函數的參數（后續講解）* {}：存放函數代碼，調用函數時，想執行的代碼都寫在內部 */ 復制代碼

賦值式定義

var fn = function () {} 復制代碼

函數的調用

function fn1() {} var fn2 = function () {}fn1() fn2() 復制代碼

聲明式與賦值式的區別

書寫區別
調用區別(賦值式只可以在定義后調用，聲明式定義前后都可以)

// 聲明式 fn1() // 可以執行 function fn1(){// 函數代碼。。。。。。 } fn1() // 可以執行fn2() // 不可以執行（!** 聲明時編程，其實就是相當于將一個函數賦值給一個變量，會有變量的聲明提升，所以在變量聲明前調用時，根據變量聲明提升的規則，此時變量為 undefined ，所以不能被調用） var fn2 = function () {// 函數代碼。。。。。。。。。 } fn2() // 可以執行復制代碼

函數的參數

函數的參數有形參和實參（他們是從左到右的順序一一對應的）
- 形參：在函數聲明時 function 后邊的（）內書寫，每寫一個參數，就相當于在函數內部創建一個變量，其值為函數調用時傳遞的值，只能在函數內部使用，不能在外部使用
- 實參：顧名思義，實際的參數，也就是函數在調用時傳遞的參數

function num () {console.log(1 + 1) } num() // 打印值為 1+1function num (a, b) { // 此處 a b 為形參console.log(a + b) } num(1, 1) // 此處為實參，分別傳遞給 a 和 b num(1, 2) // 此處打印值為 1 + 2 復制代碼

傳參的多與少

// 少傳參數 function num1(a, b, c, d) {console.log(a,b,c,d) } num1(1, 2, 3, 4) // 打印1，2，3，4 num1(1, 2, 4) // 打印1，2，4，undefined 一一對應的少傳實參會打印underfined// 多傳參數 function num2 (a) {console.log(a) } num2(1, 2) // 打印 1 一一對應多出來的實參不接收，不執行復制代碼

函數的返回值

返回值是什么？有什么作用
- 函數內部默認有一個 return 他的值就是函數的返回值，如果函數內部不寫 return 那么函數默認在函數體內部最底部返回一個 undefined
- 如果不想返回 undefined 需要手動在函數內部寫上 return 并且跟上需要返回的值
- 可以中斷函數(返回1 2 3return后面的代碼會終止)
function fun() {console.log(1)console.log(2)console.log(3)return '下面就沒了'console.log(4)console.log(5)} fun() 復制代碼

函數的預解析

什么是預解析
- 在代碼運行前，先全部分析一遍代碼，這個行為叫做預解析（預解釋）
預解析的內容
- 聲明式函數定義
- var 聲明變量

//預解析就是將函數提升 fn()function fn() {console.log('我是函數我被調用了')}提升后變成 function fn(){console.log('我是函數我被調用了')}fn()

??作用域(就是變量可以起作用的范圍)
- ? ? ? ? ?作用域分為兩個
- ? ? ? ? 1.全局作用域（直接在script 標簽內部書寫的代碼）
? ? ? ? 在此作用域創建的變量，我們叫做全局變量，在當前 script 標簽內的哪里都能使用
? ? ? ? ?在 JS中，全局作用域中有一個 ?提前給我們準備好的對象（一種數據格式，）
? ? ? ? ?這個對象叫做window
? ? ? ? ?我們創建的全局變量，只能在當前作用域中使用，超出這個作用域（也就是在函數外邊）去使用，就會找不到變量
? ? ? ? ?
?作用域鏈
- ? ? ? ? ?作用域鏈就是在訪問一個變量的時候, 如果當前作用域內沒有
- ? ? ? ? ?會去自己的父級作用域, 也就是上一層作用域內查找, 如果找到就直接使用, 如果沒有找到繼續向上層查找
- ? ? ? ? ?直到查找到最頂層的全局作用域, 如果找到了直接使用, 如果沒找到報錯提示變量不存在(未定義)
- ? ? ? ? ?我們將這個一層一層向上查找的規律, 叫做作用域鏈

遞歸函數（還是一個函數，在函數內部調用和使用自身）
? ? 和循環差不多
?

function fn(n) {return n * fn(n - 1)}fn(4)//4的階乘

?對象
對象是JS中的一種數據格式，對象在 JS 中的數據類型數據為: 引用數據類型(復雜數據類型)<br>
? ? ? ? 鍵值對 -> key: value
? ? ? 如果對象內部有多個鍵值對, 那么需要使用逗號間隔 <br> ?
? ? ??
? ? ? ? 語法1: var obj = {鍵值對}
? ? ? ? ?
創建對象
? ? ?創建對象 ? 分為兩種方式：
? ? ? ? ? 1.字面量的形式（使用頻率比較高）
? ? ? ? ? 語法;var obj={鍵值對}
? ? ? ? ? 2.內部構造函數的創建
? ? ? ? ? ? ? ? 語法1： var obj1=new Object（）//創建空對象
? ? ? ? ? ? ? ? 語法2： ?var obj2=new ?Object({a : 1, b : 2}) //創建一個具有屬性或者說具有鍵值對的對象
? ? ? ? ? ? ?
? ? ? ?

?例：var obj1 = new Object({a: 10,r: '34',g: 45,d: undefined})console.log(obj1)注意：new ?Object ?的O是大寫 ?，不是小寫

??
對象的操作（增刪改查）
?

?var obj = {a: 12,b: true,v: '123'//}console.log('原始對象： ', obj)//{a: 12, b: true, v: '123'}//點語法增刪改查1.增obj.q = 'afaf'obj.d = 'false'console.log('修改后的值： ', obj)//{a: 12, b: true, v: '123', q: 'afaf', d: 'false'}?2.刪?delete obj.adelete obj.bconsole.log('修改后的值： ', obj)//{v: '123', q: 'afaf', d: 'false'}3.改?obj.a = '34'obj.b = 'false'console.log('修改后的值： ', obj)//{v: '123', q: 'afaf', d: 'false', a: '34', b: 'false'}4.查?console.log(obj.a)//34console.log(obj.v)//123//中括號語法增刪改查obj['f'] = 100obj['g'] = '300'console.log('修改后的值： ', obj)delete obj['a']delete obj['b']console.log('修改后的值： ', obj)obj['a'] = falseobj['b'] = 'qwer'console.log('修改后的值： ', obj)console.log(obj['a'])console.log(obj['b'])console.log('修改后的值： ', obj)

?一般大部分情況下，點語法與中括號語法，作用相同，怎么選擇都可以
? ? ? ? 特殊情況下我們需要中括號語法
? ? ? ? ?1.對象的屬性名，有純數字或者特殊符號(100,'!','@')，這個時候，就只能使用中括號語法
? ? ? ? ?2.如果涉及變量相關的時候，也需要中括號語法
? ?
? ? ?

// 特殊情況var obj = {100: '我的屬性名是純數字 100'// ' ! ': '我的屬性名是特殊符號 !'// '@': '我的屬性名是特殊符號 @'}//此時不能使用點語法，可以使用中括號語法//console.log(obj.100)//console.log(obj.!)//console.log(obj.@)console.log(obj[100])console.log(obj['100'])//console.log(obj[!]) //有問題需要用引號將！包裹console.log(obj['!'])console.log(obj['@'])#?

?for...in 循環遍歷對象
? ? ? ? ? 語法: for (var i in 要遍歷的對象) { 循環要執行的代碼 }
? ? ? ? ? '遍歷對象' 想辦法拿到對象內部所有的屬性名與屬性值? ? ? ?

?var obj = {a: 2,e: 3,c: 4}for (var i in obj) {// console.log(1)// console.log(i) ?// a e c ?這是對象 ?是對象 obj 的所有 ? ? ? 屬性名 / 鍵名 / key// 需求: 打印對象所有的屬性值// console.log(obj) ? ?// 此時打印的是完整的對象, 所以不合適// console.log(obj.i) ?// undefined ?點語法會將后邊的字符當成字符串來使用, 而不是當成變量, 如果相當變量來使用, 那么應該使用中括號語法console.log(obj[i]) // 該對象的所有屬性值}?

?
? ??
?創建數組的方法
? ?分兩種方式
? ? ? ? ? 1.字面量方式
? ? ? ? ? ?語法：var arr =[1, 2, 3, 'qwe', true]
? ? ? ? ? 2.構造函數的方式
? ? ? ? ? ?語法1：var arr = new Array() ?創建一個空對象
? ? ? ? ? ?語法2：var arr = new Array(5)創建一個有長度的數組
? ? ? ? ? ?語法3; ? var arr = new Array(1,2,3)創建一個有內容的數組?
? ? ?
? ? ? ?

//1.字面量的方式var arr = [1, 2, 3, 'qwe', true]console.log(arr)//2. 內置構造函數的方式//2.1創建一個空數組var arr1 = new Array()console.log(arr1)//2.2創建一個有長度的數組var arr2 = new Array(5)console.log(arr2)//2.3創建一個有內容的數組var arr3 = new Array(1, 2, 3, 'qwe', true)console.log(arr3) ?

? ? ? ??
? ? ? ??
? 數組的length 屬性
? ? ? ? ? length翻譯過來就是長度的意思
? ? ? ? ? ? ? ?代表這個數組內，有多少個成員
? ? ? ? ? ? ? 語法： ? 數組名.length
? ?

? 例子：?var arr = [5, 2, 1, 'qwer']var arr1 = [1, 3, 1, 4, 5]console.log(arr.length)//4 長度為4console.log(arr1.length)//5 ? 長度為5??

? ? ? ??
??
?數組的索引(下標)
? ? ? ? 就是指一個數據，在這個數組內排列在第幾個 ?位置上
? ? ? ? 注意： ?在JS 中，索引(下標)是從0開始計如果想要獲取到數組指定位置的值，可以通過下標來獲取

? ? ? ? 語法：數組名[下標] --> 能夠獲取到這個數組中對應下標的成員具體的值
? ?

例子：var arr = ['q', 'w', 'd', 3, 2, 1]// 0 ? ?1 ? 2 ? 3 ?4 ?5console.log(arr[1])//wconsole.log(arr[2])//dconsole.log(arr) ?//?['q', 'w', 'd', 3, 2, 1]

? ??遍歷數組
? ? ? ? ? 想辦法 ?拿到 ?數組每一個成員
? ? ? ? ? 想拿到數組的所有成員，需要先想辦法拿到數組所有的下標
? ? ? ? ? 規律： ?所有數組的下標都是從0開始的， ?然后到 ?數組 .length - 1 結束
? ? ? ??
? ? ?

? var arr = ['a', 'b', 'c', 1, 2, 3]// ? ? ? ? ?0 ? ?1 ? ?2 ? 3 ?4 ?5var arr1 = ['a', 'b', 'c', 1, 2]// ? ? ? ? ? 0 ? ?1 ? ?2 ? 3 ?4console.log(arr)console.log(arr1)for (var i = 0; i < arr.length; i++) {//拿到arr這個數組所有下標//console.log(i) //0 1 2 3 4 5//拿到數組所有的值 ?輸出在控制臺console.log(arr[i]) //a b c 1 2 3}?

? ? ? ??
?冒泡排序：
? ? ?屬于數組排序的算法之一（通過一種算法將一個亂序的數組，調整為指定的排序的數組，從大到小或者從小到大）

選擇排序：
? ? 原理首先從原始數組中找到最小的元素，并把該元素放在數組的最前面，然后再從剩下的元素中尋找最小的元素，放在之前最小元素的后面，直到排序完畢。

數據類型之間的區別（分為兩種）
?1.基本數據類型（簡單數據類型）
?2. 引用數據類型（復雜數據類型）
##### 1. 存儲
? ? ? ? ? ?變量的數據存儲的地方是內存中, 內存分為兩個棧內存, 堆內存
? ? ? ? ? ? 基本數據類型：存儲在棧內存中, 比如: string number undefined null ?boolean
? ? ? ? ? ? 復雜數據類型：將數據本體存放在堆內存中, 比如對象或者數組或者函數
? ? ? ? ? ? 然后將指向該內存的地址, 存放在數組名或者對象名或者函數名中
? ? ? ? ? ? 數組/對象/函數 ?名 ?存放在棧內存中
? 面試題: 數據類型之間有什么區別?
? ? ? ? ? 基本數據類型有哪些, 然后他們存儲的地方是棧內存中
? ? ? ? ? 引用數據類型有哪些, 然后他們數據本體存放的地方是堆內存中, 然后變量名存儲的位置是棧內存中
? ? ? ? ? 基本數據類型內部存儲的是值; 引用數據類型內部存儲的是地址
? ? ? ? ?
##### 2. 賦值
? ? ? ? ? ? ? ? ? ? 基本數據類型: 賦值以后, 兩個變量之間沒有任何關系, 相當于將我自己的某一個東西, 復制一份給你, 然后你的就是你的, 我的就是我的（你的和我的之間沒有任何關系） ? ? ? ? ?
? ? ? ? ? ? ? ? ??
? ? ? ? ? ? ? ? ? ? 復雜數據類型: 因為變量內部存儲的是指向堆內存的地址, 所以在賦值的時候, 其實是將這個地址給到了另外一個變量（兩個地址一樣是你的也是我的）
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 那么相當于這兩個變量存儲的是 ?同一個鑰匙, 所以操作其中一個變量的時候, 會影響另外一個變量

##### 3. 比較
? ? ? ? ? ? ? ? ? ? 基本數據類型: 就是值的比較
? ? ? ? ? ? ? ? ? ? 引用數據類型: 比較的時候比較的是存儲地址

##### 4. 傳參
? ? ? ? ? ? ? ? ? ? 基本數據類型: 將值拷貝一份傳遞給形參, 在函數內修改不會影響外界
? ? ? ? ? ? ? ? ? ? 引用數據類型: 將存儲地址賦值給形參, 在函數內修改會影響外界
? ? ? ? ? ? ? ? ?
數組的常用方法

? 1、push?
? ? ? ?語法：數組.push（數據）
? ? ? ?作用：向數組末尾添加數據
? ? ? ?返回值：追加數據后，數組最新長度（length）
? 2.pop
? ? ? ?語法：數組.pop()
? ? ? ?作用：刪除數組最后一條數據
? ? ? ?返回值：被刪除的數據
? 3.unshift
? ? ? ?語法：數組.unshift(數據)
? ? ? ?作用：像數組開頭添加數據
? ? ? ?返回值：添加數組后，數組最新長度(length)
? 4.shift ?
? ? ? ?語法：數組.shift()
? ? ? ?作用：刪除數組開頭數據
? ? ? ?返回值：被刪除的數據
?5.reverse
? ? ? ?語法：數組.reverse()
? ? ? ?作用：反轉數組
? ? ? ?返回值：反轉后的數組
?6.sort
? ? ? ? 語法1：數組.sort()
? ? ? ? 作用：會將數組轉換為字符串后，一位一位的對比
? ? ? ? 語法2：.sort(function(a,b){return a - b})
? ? ? ? 作用：會按照數組大小升序排列
? ? ? ? ?語法3： ?.sort(function(a,b){return b - a})?
? ? ? ? 作用：會按照數組大小降序排列(不能轉的按照原始數組排列)
? ? ? ? 返回值：排序后的數組
?7.splice
? ? ? ? ?語法1：數組.splice(開始索引，多少個)
? ? ? ? ?作用：截取數組部分內容 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?語法2：數組.splice(開始索引，多少個,插入的數據1，插入的數據2，插入的數據3.......)
? ? ? ? ?作用：截取數組部分內容，并插入新的數據
? ? ? ? ?返回值：截取出來的部分內容 ?組成的數組
?8.slice
? ? ? ? 語法：數組.slice(開始索引，結束索引) ??
? ? ? ? 參數：
? ? ? ? ? ?+包前不包后：包含開始索引位置的數據不包含結束索引的位置的數據 ??
? ? ? ? ? ?+不寫開始索引：默認從0開始；不寫結束索引默認是數組的length
? ? ? ? ? ?+ 參數支持寫負數，表示倒數幾個，其實就是 ?length + 負數
? ? ? ? ?作用：截取數組部分索引
? ? ? ? ?返回值：截取出來的部分內容組成的新數組
? ??
? ? ? ? ?* 面試題：數組中有兩個方法，splice ?和slice，你能描述一下他們兩個的區別嗎？
? ? ? ? ?1.參數含義不同 ? ?介紹一下參數哪里不同
? ? ? ? ?2.splice 會改變原數組，而slice不會
?
?9.concat
? ? ? ? ?語法：原始數組.concat(數組1，數組2，數組3，......，數據1，數據2，.......)
? ? ? ? ?作用：進行數組拼接，把數組...數據之類的小括號內的內容，拼接在原始數組中
? ? ? ? 返回值：拼接好的數組
?10.join
? ? ? ? ?語法：數組.join('連接符')
? ? ? ? ?作用：使用"連接符"，把數組內的每一個數據連接成一個字符串(不寫連接符默認使用，連接)
? ? ? ? ?返回值：連接好的字符串
11.indexOf
? ? ? ? ?語法1：數組.indexOf(要檢查的數據)
? ? ? ? ?作用：從前到后(從左到右)檢查該數據第一次在該數組內出現索引
? ? ? ? ?語法2：數組.indexOf(要檢查的數據，開始索引)
? ? ? ? ?作用：在開始索引的位置，按照從左到右的順序，檢查該數據第一次在該數組內出現的索引
? ? ? ? ?返回值：找到數據的情況下，會將數據第一次出現下標[索引]返回
? ? ? ? ?沒找到的情況下，會直接返回一個 ?-1
? ? ? ? ?備注：開始索引不寫默認是 0
12.lastIndexOf
? ? ? ? 語法1：數組.lastIndexOf (要檢查的數據)?
? ? ? ? 作用：從后向前(從右向左)檢查該數據第一次在該數組內出現索引
? ? ? ? 語法2：數組.lastIndexOf(要檢查的數據，開始索引)
? ? ? ? 作用：在開始索引的位置，按照從右向左的順序，檢查該數據第一次在該數組內出現的索引
? ? ? ? 返回值：找到數據的情況下，返回第一次出現的下標[索引]
? ? ? ??
? ? ? ? 沒找到的情況下，會直接返回一個 ?-1

遍歷數組的常用方法

? 1.forEach
? ? ? ? ? ? ? ?語法：數組.forEach(function(item,index,origin){})
? ? ? ? ? ? ? ?item:數組的每一項 ?的值
? ? ? ? ? ? ? ?index：數組的每一項對應的下標
? ? ? ? ? ? ? ? origin：原始數組(了解即可，一般不會用)
? ? ? ? ? ? ? ? 作用：遍歷數組
? ? ? ? ? ? ? ? 返回值：該方法永遠沒有返回值(undefined)
? ? ? ? ? ? ?2.map
? ? ? ? ? ? ? ? 語法：數組.map(function(item,index,origin){ }) 三個參數的意義與foreach 一樣
? ? ? ? ? ? ?作用：映射數組
? ? ? ? ? ? ? ?返回值：返回一個和原數組長度相同的數組，但是內部數據可以經過我們的映射加工
? ? ? ? ? ? ? ?映射加工：就是在函數內以 return 的形式書寫
? ? ? ? ??
? ? ? ? ? ? ?有一道面試題：數組常用的遍歷方法有一個 forEach和map ，這兩個方法有什么區別？
? ? ? ? ? ? ? ? ? ? ?1.forEach 的作用是來遍歷數組，而map 的作用是用來映射數組
? ? ? ? ? ? ? ? ? ? ?2.forEach沒有返回值，而map是可以有返回值的
? ? ? ? ??
? ? ? ? ? ? ? 3 . filter
? ? ? ? ? ? ? ? ? ?語法：數組.filter(function(item,index,origin){}) ? ? ? ? ? ? 三個參數的意義與foreach 一樣
? ? ? ? ? ? ? ? ? ? 作用：過濾數組
? ? ? ? ? ? ? ? ? ? 返回值：返回一個新數組，內部存儲的值是原始數組過濾出來的部分內容
? ? ? ? ? ? ? ? ? ?過濾條件：過濾條件以return 的形式書寫
? ? ? ? ??
? ? ? ? ? ? ?4.find
? ? ? ? ? ? ? ? ? ?語法：數組.find(function(item,index,origin){}) ? ? ? ? ? ? ? ? ?三個參數的意義與foreach 一樣
? ? ? ? ? ? ? ? ? ?作用：在數組內查找滿足條件的第一項
? ? ? ? ? ? ? ? ? ?返回值：找到的數據，如果沒有找到返回undefined
? ? ? ? ? ? ? ? ? ?查找條件以 return 的形式書寫
? ? ? ? ? ? 5.findIndex
? ? ? ? ? ? ? ? ? ?語法：數組.findIndex(function(item,index,origin){}) ? ? ? ? ? ? ? ? ?三個參數的意義與foreach 一樣
? ? ? ? ? ? ? ? ? ?作用：在數組內查找滿足條件的第一項的下標
? ? ? ? ? ? ? ? ? ?返回值：找到的數據的下標，如果沒有找到返回的是 ?-1
? ? ? ? ? ? ? ? ? ?查找條件以 return 的形式書寫
? ? ? ? ??
? ? ? ? ? ? ? ? 6.some
? ? ? ? ? ? ? ? ? 語法：數組.some(function(item,index,origin){}) ? ? ? ? ? ? ? ? ?三個參數的意義與foreach 一樣
? ? ? ? ? ? ? ? ? ?作用：判斷數組內是否有一個滿足條件
? ? ? ? ? ? ? ? ? ?返回值：一個布爾值 ? true/false
? ? ? ? ? ? ? ? ? ?判斷條件以 return ?形式書寫
? ? ? ? ?
? ? ? ? ? ? ? ?7.every
? ? ? ? ? ? ? ? ? ? 語法：數組.every(function(item,index,origin){}) ? ? ? ? ? ? ? ? ?三個參數的意義與foreach 一樣
? ? ? ? ? ? ? ? ? ? 作用：判斷數組內是否全部滿足條件
? ? ? ? ? ? ? ? ? ? 返回值：一個布爾值 ? true/false
? ? ? ? ? ? ? ? ? ? 判斷條件以 return ?形式書寫
? ? ? ? ? ? ??
? ? ? ? ? ? ? ? 8.reduce
? ? ? ? ? ? ? ? ? ?語法：數組.reduce(function(prev,item,index,origin){},init) ??
? ? ? ? ? ? ? ? ? ? prev:表示初始值或上一次運算的值
? ? ? ? ? ? ? ? ? ? item：表述數組每一項的值
? ? ? ? ? ? ? ? ? ? index：表示數組每一項的下標 [索引] ?
? ? ? ? ? ? ? ? ? ? origin：原始數組
? ? ? ? ? ? ? ? ? ? 作用：用來實現疊加效果
? ? ? ? ? ? ? ? ? ? 返回值：最終疊加的結果
? ? ? ? ? ? ? ? ? 注意：
? ? ? ? ? ? ? ? ? ? ? ?+疊加條件以return 的形式書寫
? ? ? ? ? ? ? ? ? ? ? ?+prev 第一次的值，如果你傳遞了 init，就是init的值，如果沒有傳遞init，那么就是數組[0]的值
? ? ? ? ? ? ? ? ? ? ? ?+如果傳遞了init，循環執行數組.length次，如果沒有傳遞init，循環執行數組.length-1次
? ? ? ??
? ? ? ??
? ?數組塌陷
? ?數組塌陷現象：在對數組進行操作的時候，會使數組的長度產生變化，同時操作的數組那個項的下一個索引會被跳過，從而造成數組的某項會被跳過，這種叫做數組塌陷現象。
? ?解決辦法：就是在對數組某項進行操作之后，手動將索引值 i --,保持數組每一項都被遍歷。
? ?
數學的方法
? ? ? ? ? ?
? ? ? ? ? ? ?在JS 中Math 對象給我們提供了操作數據的一些方法（數學方法）
? ? ? ? ? ? ?1.random
? ? ? ? ? ? ?語法：math.random()
? ? ? ? ? ? ?作用：得到一個隨機數，每次生成的數字都不一樣，但一定是0~1之間的，包含0不包含1，也就是說最大值可能是0.999999999999999
? ? ? ? ??
? ? ? ? ? ? ? 2.round
? ? ? ? ? ? ?語法：Math.round(數字)
? ? ? ? ? ? ?作用：將這個數字(小數)，按照四舍五入變成整數
? ? ? ? ??
? ? ? ? ? ? ? 3.ceil
? ? ? ? ? ? ?語法：Math.ceil(數字)
? ? ? ? ? ? ? 作用：將這個數字(小數)向上取整
? ? ? ? ??
? ? ? ? ? ? ? 4.floor
? ? ? ? ? ? ? ?語法：Math.floor(數字)
? ? ? ? ? ? ? ?作用：將這個數字(小數)向下取整
? ? ? ? ??
? ? ? ? ? ? ? ? 5.abs
? ? ? ? ? ? ? ?語法：Math.abs(數字)
? ? ? ? ? ? ? ?作用：返回這個數字的絕對值
? ? ? ? ??
? ? ? ? ? ? ? ? 6.sqrt
? ? ? ? ? ? ? ? 語法：Math.sqrt(數字)
? ? ? ? ? ? ? ? 作用：求平方根
? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ? ?7.pow
? ? ? ? ? ? ? ? 語法：Math.pow(基數，冪)
? ? ? ? ? ? ? ? 作用：返回基數的幾次冪（幾的幾次方乘積）
? ? ? ? ? ? ?
? ? ? ? ? ? ? ? ?8.max
? ? ? ? ? ? ? ? ? 語法：Math.max(數字1，數字2，數字3.......)
? ? ? ? ? ? ? ? ?作用:返回傳入數字中最大的那一個
? ? ? ? ??
? ? ? ? ? ? ? ? ?9.min
? ? ? ? ? ? ? 語法：Math.min(數字1，數字2，數字3.......)
? ? ? ? ? ? ? ? 作用:返回傳入數字中最小的那一個
? ? ? ? ??
? ? ? ? ? ? ? ? ?10.pI（i是大寫）
? ? ? ? ? ? ? ? 語法：Math.pI
? ? ? ? ? ? ? ? ? 作用：返回π ? //3.1415926
? ? ? ? ?js嚴格模式

? ? ? ? ? 1.聲明變量必須要 var 關鍵字

? ? ? ? ? 2.函數的形參不可以重復
? ? ? ? ? ?對自己書寫的代碼做一個要求
? ? ? ? ? ?寫在script代碼最開始的第一行，寫字符串形式'use strict'

?字符串

創建字符串的方式

? ? ? ? ? ? ?1.字面量的形式創建字符串

? ? ? ? ? ? ? ? ? ? ?var str = '123'

? ? ? ? ? ? ?2.內置構造函數的形式創建字符串

? ? ? ? ? ? ? ? ? ? ?var str = new String() ?

?字符串的length與下標

? ? ? ? ? ? ? ?length與下標的含義與數組中的一樣

? ? ? ? ? ? ? ?length：長度

? ? ? ? ? ? ? ?索引(下標)：獲取到字符串中指定位置的

? ? ? ? ? ? ? ?注意：字符串中通過索引能夠獲取到指定位置的值，只不過獲取到的值是 ?只讀的 (能看不能改)

?字符串的常用方法

? ? ? ? ? ? 1.charAt

? ? ? ? ? ? ? 語法：字符串.charAt(索引)

? ? ? ? ? ? ? 作用：查詢指定下標的值

? ? ? ? ? ? ? 返回值：查詢到的值，如果沒有查詢到就是一個空字符串

? ? ? ? ? ? 2.charCodeAt

? ? ? ? ? ? ? ?語法：字符串.charCodeAt (索引)

? ? ? ? ? ? ? ?作用：查詢指定下標的值 ?對應的十進制碼

? ? ? ? ? ? ? ?返回值：查詢到的值對應的十進制碼，如果沒有查詢到會返回一個NaN

? ? ? ? ? ? 3.toLowerCase ?

? ? ? ? ? ? ? ?語法：字符串.toLowerCase () ?

? ? ? ? ? ? ? ?作用：將這個字符串轉換為小寫

? ? ? ? ? ? ? ?返回值：轉換后的字符串

? ? ? ? ? ? 4.toUpperCase

? ? ? ? ? ? ? ?語法：字符串.toUpperCase ()

? ? ? ? ? ? ? ?作用：將這個字符串轉換為大寫

? ? ? ? ? ? ? ?返回值：轉換后的字符串

? ? ? ? ? ?1.substr

? ? ? ? ? ? ? ? 語法：字符串.substr(開始索引，多少個)

? ? ? ? ? ? ? ? 作用：截取指定的字符串

? ? ? ? ? ? ? ? 返回值：截取到的字符串

? ? ? ? ? ? ? ? 注意：官方說明這個方法將來某一天可能會刪除，所以建議我們使用 ?substring

? ? ? ? ? ? ?2.substring

? ? ? ? ? ? ? ? 語法：字符串.substring(開始索引，結束索引)

? ? ? ? ? ? ? ? 作用：截取指定的字符串

? ? ? ? ? ? ? ? 返回值：截取到的字符串

? ? ? ? ? ? ? ? 注意：

? ? ? ? ? ? ? ? ? ? ? 1.參數包前不包后

? ? ? ? ? ? ? ? ? ? ? 2.結束索引可以不寫，相當于寫了length

? ? ? ? ? ? ?3.slice（建議使用）

? ? ? ? ? ? ? ?語法：字符串.slice(開始索引，結束索引)

? ? ? ? ? ? ? ?作用：截取指定的字符串

? ? ? ? ? ? ? ?返回值：截取到的字符串

? ? ? ? ? ? ? ?注意：

? ? ? ? ? ? ? ? ? ? ? 1.參數包前不包后

? ? ? ? ? ? ? ? ? ? ? 2.結束索引可以不寫相當于寫了length

? ? ? ? ? ? ? ? ? ? ? 3.開始索引可以不寫相當于寫了0

? ? ? ? ? ? ? ? ? ? ? 4.結束索引支持寫負數，相當于length + 負數

? ? ? ? ? ? 1.concat

? ? ? ? ? ? ? ? ?語法：字符串.concat(數據1，數據2，數據3......)

? ? ? ? ? ? ? ? ?作用：將字符串和參數傳遞數據進行拼接

? ? ? ? ? ? ? ? ?返回值：拼接后的字符串

? ? ? ? ? ? 2.indexOf

? ? ? ? ? ? ? ? ? 語法：字符串.indexOf(數據，開始下標)

? ? ? ? ? ? ? ? ? 作用：尋找數據在字符串中的位置

? ? ? ? ? ? ? ? ? 返回值：找到的時候返回下標，找不到返回-1

? ? ? ? ? ? ? ? ? 注意：第二個參數可以不傳遞，默認為0

? ? ? ? ? ? 3.lastIndexOf

? ? ? ? ? ? ? ? 語法：字符串.lastIndexOf(數據，開始索引) ?

? ? ? ? ? ? ? ? 作用：尋找數據在字符串中的位置(從后往前/從右向左) ? ?

? ? ? ? ? ? ? ? 返回值：找到的時候返回下標，找不到返回-1

? ? ? ? ? ? ? ? 注意：第二個參數可以不傳遞，默認為 length-1(字符串最后一個位置) ?

? ? ? ? ? ? 4.split

? ? ? ? ? ? 語法：字符串.split('符號')

? ? ? ? ? ? 作用：在字符串中找到'符號' 然后將這個字符串分割，并放在一個數組內

? ? ? ? ? ? 返回值：一個數組

? ? ? ? ? ? 注意：參數如果傳遞的是空字符串('')會將字符串全部分隔開

1.trim(重點)

? ? ? ? ? ? 語法：字符串.trim()

? ? ? ? ? ? 作用：去掉字符串兩側的空格

? ? ? ? ? ? 返回值：去掉空格后的字符串

? ? ? ? ? ? 2.trimStart ?/trimLeft

? ? ? ? ? ? 語法：字符串.trimStart() ?字符串.trimLeft

? ? ? ? ? ? 作用：去掉字符串開始（左側）的空格

? ? ? ? ? ? 返回值：去掉空格后的字符串

? ? ? ? ? ? 3.trimEnd /trimRight

? ? ? ? ? ? 語法：字符串.trimEnd() ?字符串.trimRight()

? ? ? ? ? ? 作用：去掉字符串結束（右側）的空格

? ? ? ? ? ? 返回值：去掉空格后的字符串

1.includes

? ? ? ? ? 語法：字符串.includes(字符串片段)

? ? ? ? ? 作用：判斷當前字符串中，是否擁有指定字符串片段

? ? ? ? ? 返回值：一個布爾值

? ? ? ? ? ? ? ? ? true --- > 擁有

? ? ? ? ? ? ? ? ? false --- > 沒有

? ? ? ? ?2.startsWith

? ? ? ? ? ?語法：字符串.startsWith(字符串片段) ? ?

? ? ? ? ? ?作用：判斷字符串開頭是不是指定的字符串片段

? ? ? ? ? ?返回值：一個布爾值

? ? ? ? ? ? ? ? ? true --- > 是開頭

? ? ? ? ? ? ? ? ? false --- >不是開頭

? ? ? ? 3.endsWith

? ? ? ? ? ? ?語法：字符串.endsWith(字符串片段)

? ? ? ? ? ? ?作用：判斷字符串結尾是不是指定的字符串片段 ?

? ? ? ? ? ? ?返回值：一個布爾值

? ? ? ? ? ? ? ? ? true --- > 是結尾

? ? ? ? ? ? ? ? ? false --- >不是結尾

? ? ? ? ? ? ? ? ? 163郵箱 ? 以@163.com結尾

? ? ? ? ? 4.replace

? ? ? ? ? ? ? ?語法：字符串.replace('要被替換的字符'，'替換的字符') ?

? ? ? ? ? ? ? ?作用：找到當前字符串中的第一個參數的值，然后將其替換為第二個參數

? ? ? ? ? ? ? ?返回值：替換完成的參數 ? ?

進制轉換與保留小數

1.進制轉換(了解)

? ? ? ? ? ? 1.十進制轉換為其他進制

? ? ? ? ? ? 語法：十進制數字.toString(幾進制)

? ? ? ? ? ? 2.其他進制轉換為十進制

? ? ? ? ? ? 語法：parseInt(數字，將數字視為幾進制的數字然后轉換為10進制的數字)

? ? ? ? 2. 保留小數(掌握)

? ? ? ? ?語法：toFixed(保留幾位小數)，保留小數的時候四舍五入，并且返回的是字符串 ?

?定時器（兩種）

? ? ? ? 1.setInterval ?計時器，每間隔固定的時間執行一次

? ? ? ? ? ? ? ?語法：setInterval(函數，數字/時間)

? ? ? ? ? ? ? ? ? ?函數：每間隔固定的時間要執行的代碼

? ? ? ? ? ? ? ? ? ?數字：間隔的時間，注意單位是毫秒，最小值為4~20

? ? ? ? ?2.setTimeout ?倒計時器，在指定時間到達后，執行一次

? ? ? ? ? ? ? ? ? 語法;setTimeout(函數，數字) ?

? ? ? ? ? ? ? ? ? 函數：在指定時間結束后執行要執行的代碼

? ? ? ? ? ? ? ? ? 數字：間隔的時間，單位也是毫秒 ? ?

? ? ? ? 兩個定時器的返回值與意義

? ? ? ? ? ? ? ?+返回值不區分定時器種類，用于表示你這個定時器是頁面中第幾個定時器

? ? ? ? ? ? ? ?+作用：用來關閉定時器

異步代碼

?簡單的代碼異步執行(這里并不是詳細的，后面會講)

? ? ? ? 這是一道面試題，熟讀并背誦全文

? ? ? ? ? 什么是非異步代碼

? ? ? ? ? ? ? 按照從上往下的順序，從左到右的順序，依次執行每一行代碼

? ? ? ? ? ? ? 如果上一行代碼沒有執行完畢，不會執行下一行代碼

? ? ? ? ?什么是異步代碼

? ? ? ? ? ? ?當代碼遇到異步任務的時候，會把這個代碼放在'異步隊列’ 內等待

? ? ? ? ? ? ?所有的同步代碼執行完畢后，開始執行"異步隊列"內的代碼

? ? ? ? ?簡單來說：代碼在執行的時候，會把這個代碼放在‘異步隊列’內等著，讓后繼續執行直到把所有的同步代碼執行完畢后，再開始執行異步任務

? ? ? ? ? ? 什么是異步任務

? ? ? ? ? ? 兩種定時器都是異步任務

? ? ? ? ? ? 可以理解為：先執行定時器外面的代碼，然后執行定時器里面的

時間對象?

? ? ? 時間對象?

? ? ? ? ? ? ? ? 在JS鐘 Date 給我們提供了操作時間的一些方法，是JS 內置的一個對象

?var str = new Date()console.log(str)

? ?時間對象的參數

? ?創建對象的時候，看可以選擇傳遞函數，也可以不傳遞函數

? ? ? ? ? ? ? ? ?如果需要傳遞參數，分為兩種形式

? ? ? ? ? ? ? ? ? ?1.數字

? ? ? ? ? ? ? ? ? ? ?最少傳遞兩個值，年 ?和月(JS中0-11 代表了 1-12月)

? ? ? ? ? ? ? ? ? ? ?2.字符串

? ? ? ? ? ? ? ? ? ? ?最少值需要傳遞一個參數年份即可（字符串的形式傳遞時月份從 1 開始）

? ? ? ? ? ? ? ? ?不寫參數會返回本地時間的年月日

?獲取時間對象

var time = new Date()

? ? ? ? console.log(time)

? ? ?1.得到時間對象的年份

? ? ? ? var year = time.getFullYear()

? ? ? ? console.log(year)?

? ? ??2.得到時間對象的月份

? ? ? ? var month = time.getMonth()

? ? ? ? console.log(month) //1月-->0

? ? ?3.得到時間對象的日

? ? ? ? var day = time.getDate()

? ? ? ? console.log(day)?

? ? ? 4..得到時間對象的小時

? ? ? ? var hours = time.getHours()

? ? ? ? console.log(hours)

? ? ? 5..得到時間對象的分鐘

? ? ? ? var minutes = time.getMinutes()

? ? ? ? console.log(minutes)

? ? ? 6..得到時間對象的秒數

? ? ? ? var seconds = time.getSeconds()

? ? ? ? console.log(seconds)// 0-59

? ? ? 7.得到時間對象中的 ?一周的第幾天(周日為0，周六為6)

? ? ? ? var days = timer.getDay()

? ? ? ? console.log(days)

? ? ? 8. getTime ?按照 ?格林威治時間來計算從 1970年1月1日0時0分0秒到現在（或指定日期）的毫秒數

? ? ? ? var getTimes = timer.getTime()

? ? ? ? console.log(getTimes)

設置時間對象?

? ? var timer = new Date()

? ? ? ? //設置年

? ? ? ? timer.setFullYear(2001)

? ? ? ? console.log(timer.getFullYear())

? ? ? ? //設置月

? ? ? ? timer.setMonth(3)

? ? ? ? console.log(timer.getMonth())

? ? ? ? //設置日當月第幾天

? ? ? ? timer.setDate(15)

? ? ? ? console.log(timer.getDay())

? ? ? ? // 注意，沒有設置本周的第幾天

? ? ? ? //設置時

? ? ? ? timer.setHours(15)

? ? ? ? console.log(timer.getHours())

? ? ? ? //設置分

? ? ? ? timer.setMinutes(25)

? ? ? ? console.log(timer.getMinutes())

? ? ? ? //設置秒

? ? ? ? timer.setSeconds(35)

? ? ? ? console.log(timer.getSeconds())

? ? ? ? //設置豪秒

? ? ? ? timer.setMilliseconds(999)

? ? ? ? console.log(timer.getMilliseconds())

? ? ? ? //設置到 1970 的總毫秒數

? ? ? ? timer.setTime(12345667)

? ? ? ? console.log(timer.getTime())

認識BOM

?用JS 操作瀏覽器和頁面中的 HTML 元素

? ? ? ? ?BOM

? ? ? ? ?瀏覽器對象模型，其實就是操作瀏覽器的一些能力

? ? ? ? ? ?我們可以操作哪些內容？

? ? ? ? ? ? ?+獲取瀏覽器的相關信息(窗口大小) ? ?

? ? ? ? ? ? ?+操作瀏覽器進行頁面的跳轉

? ? ? ? ? ? ?+獲取瀏覽器的地址欄信息

? ? ? ? ? ? ?+操作瀏覽器的滾動條

? ? ? ? ? ? ?+獲取瀏覽器的版本

? ? ? ? ? ? ?+讓瀏覽器出現一個彈出框

? ? ? ? ? ? ?+........

? ? ? ? ? ? ?BOM 的核心就是 window 對象

? ? ? ? ? ? ? ? ?window 時 JS 內置的一個對象，里面包含著操作瀏覽器的方法

?體驗BOM

?獲取瀏覽器窗口的尺寸

? ? ? ? innerHeight/innerWidth

? ? ? ? ? +作用：獲取到瀏覽器窗口的高度和寬度(包含滾動條)

? ? ? ? ? +語法：window.innerHeight /window.innerWidth

console.log('高度', window.innerHeight)console.log('寬度', window.innerWidth)

? ? ? ? 2.瀏覽器的彈出層（學習的時候會用，實際工作中不會使用）

? ? ? ? ? ? alert

? ? ? ? ? ? prompt

? ? ? ? ? ? confirm

? ? ? ? ? ? ? ? 有一個詢問信息和兩個按鈕

? ? ? ? ? ? ? ? 點擊確定按鈕返回 true

? ? ? ? ? ? ? ? 點擊取消按鈕返回 false ?

var str = confirm('請問你確定進入頁面嗎')console.log(str)

總結

以上是生活随笔為你收集整理的JS每日笔记的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

笔记
js

上一篇：深度学习的可解释性——Striving
下一篇：凡科网JS逆向后跳出的滑块验证（base