[toc]
#### 1.增刪:改變原數組操作
```
push: 返回新數組長度
unshift: 添加至開頭,返回新數組長度
pop: 刪除最后一位,返回刪除的元素
shift: 刪除第一位,返回刪除的元素
```
#### 2.修改:改變原數組
splice(inde, count, value, value),返回被刪除的部分組成的數組
```js
let arr = [1, 2, 3]
// index 為0則為新增
arr.splice(1, 0, 4, 5, 6) // [1, 4, 5, 6, 2, 3]
let res = arr.splice(1, 1)
console.log(arr, res); // [1, 3] , [2]
```
#### 3.獲取子數組,不改變原數組
slice(start, end),左閉又開
```js
let arr = [1, 2, 3, 4, 5]
console.log(arr.slice(1, 3)); // [2,3]
console.log(a.slice(1)) // [2, 3, 4, 5] 只有一個參數且不小于0時,則從此索引開始截取到數組的末尾
console.log(a.slice(1, -1)) // [2, 3, 4] 從第1位截取到倒數第1位
```
數組沒有substr和substring方法,該方法屬于字符串操作
#### 3.查找
indexOf: 返回找到的下標,-1為未找到
lastIndexOf: 從最后開始查找,index值依然從左邊開始計算
includes: 返回 true false
```js
let arr = [1, 2]
arr.includes(2)) // true
```
#### 4.sort排序
+ a-b 從小到大排序
```js
a = [31, 22, 27, 1, 9]
a.sort((a, b) => {
return a - b
})
console.log(a) // [1, 9, 22, 27, 31] 按數值大小正序排列
```
+ b-a 從大到小排序
#### 5.拼接數組
concat,返回新數組,不會改變原數組
```js
let arr = [1, 2, 3]
let arr2 = [4, 5]
console.log(arr.concat(arr2)); // [1, 2, 3, 4, 5]
```
#### 6.數組遍歷
```
forEach((item, index, arr))
map((item, index, arr)):返回新數組
filter((item, index, arr)): 返回符合過濾條件的新數組
```
every:判斷是否每一項都滿足條件,只有全部滿足才會返回 true,有一項不滿足則中斷返回false
some: 只要有一項滿足就會返回 true,some可以中斷
```js
var arr = [1, 2, 3, 4, 5]
var res= arr.every(function (item, index, a) {
return item < 10
})
console.log(res) // true
```
reduce:
```js
let res = arr.reduce((pre, current, index, arr) => {
return pre + current
}, 0)
console.log(res); // 6
```
findIndex:查找滿足條件的第一項的index值
```js
let arr = [1, 2, 3, 4, 5]
let idx = arr.findIndex(item => {
return item > 2
})
console.log(idx); // 2
```
find: 查找滿足條件的第一項 item
```js
let item = arr.find(item => {
return item > 2
})
console.log(item); // 3
```
#### 7.fill 方法
fill(value, start, end) 左閉右開
1.fill修改會修改原數組
```js
let arr2 = [1, 2, 3, 4];
arr2.fill(1, 2); // [1, 2, 1, 1]
```
2.fill創建一個50個內容全為1的數組
```js
const arr3 = new Array(50).fill(1);
console.log(arr3);
```
#### 8. flat 數組拍平
不改變原數組
```js
let arr = [1, 2, [3, 4, [5, 6, 7]]];
console.log(arr.flat()); // 默認拍平一層,不改變原數組 [1, 2, '', 3, 4, Array(3)]
console.log(arr.flat(Infinity)); // 拍平所有
```
- JavaScript
- 1.數組
- 1.數組Api
- 2.判斷是否為數組
- 3.手寫forEach, map, filter, every, some, reduce
- 4.類數組轉化為數組
- 5.reduce實現compose函數
- 7.sort實現與排序
- 2.類型
- 1. let, const, var
- 1. Number 數字
- 3. Boolean 布爾值
- 4. undefined和null
- 2. String 字符串
- 1. 字符串方法
- 2. 操作字符串實例
- 3. startWith&字符串模板
- 5. 類型轉換
- 4.深拷貝與淺拷貝
- 7.Symbol類型
- typeof 和 instanceof
- Set
- Map
- 3.this,原型,原型鏈
- 1.this
- 2.手寫call, apply, bind
- 3.模擬new操作符
- 4.手寫Object.create
- 4.對象
- proxy代理
- defineProperty數據劫持
- 4.模塊化
- 5.http
- ECMAScript
- 0. 調試&兼容性&錯誤處理
- 3. 運算
- 4. 對象(三種引用類型&正則)
- 1. 數組
- 1. 數組的六種遍歷方法
- 2. 數組的增刪查改
- 3. 操作數組(展開、join、排序...)
- 4. 補充五種ES6方法
- 2. 函數
- 3. JSON
- 4. 正則
- 附:正則表達式特殊字符
- 5. 面向對象
- es6的繼承
- 6. 控制語句
- 7. ajax
- 8. promise
- 9. 閉包
- 1. 閉包產生三個相同隨機數
- 2. 閉包實現點贊
- 10.箭頭函數
- _isEmpty
- Object.assign(target, obj, obj)
- Math.ceil, round,
- DOM
- 3.1 節點
- 3.2 DOM操作元素
- 3.3 fragment DOM碎片
- 5. 事件
- BOM
- 1. window
- 2. navigation檢測訪問類型
- 3. screen窗口大小內容大小
- 4. history
- promise
- 1.promise使用
- 2.手寫promise
- 3.手寫promise.all
- 生成器generator
- 1.generator的使用
- 2.簡單實現generator
- 手寫async await
- async/await
- 5.防抖節流
- 難點深入
- 1. 瀏覽器&js特點
- 2. JS堆棧與深淺拷貝
- 3. 詳解a++和++a的區別
- 4. JS&jQuery獲取元素的方法
- 5. NodeList和HTMLCollection區別
- 6. var與let的區別
- 7. this 與 bind call apply
- 8. get與post請求的區別
- 9. 閉包
- Dom demo
- 1. JQuery--頁面點擊切換效果
- 2. JQuery-load實現頭尾封裝
- 3. JS--添加移除屬性名
- 4. jQuery--eq()與index()
- 5. table隔行變色
- 6. 改變函數this的指向
- 7. jQuery each遍歷
- ECMAScript demo
- 1. 斐波那契數列
- 2. 數組去重
- 3. 自調用函數生成隨機數
- 瀏覽器、DOM
- 1.從輸入url到頁面加載的全過程
- 2.http與https
- 3.v8垃圾回收機制
- 4.dom事件
- 5.跨域
- 6.強緩存和協商緩存
- 3.eventloop,宏任務和微任務
- 1.什么是任務
- 2.執行順序例題
- 3.執行順序例題,添加script
- 4.執行順序,多個宏任務
- 4.HTTP
- 1.經典五層模型
- 2.http發展歷史
- 3.http三次握手
- 4.URI,URL,URN
- 1.http協議
- 2.https
- http狀態碼
- 5.script標簽defer和async區別
- cookie
- connect: keep-alive