摘要：最近復習教程，發現好多沒記住的，特以此記和區別，函數不能帶參數，屬于靜態方法獲取時間戳獲取這個月有多少天，傳入年份和月份獲取這個月最后一天是星期幾獲取這個月第一天是星期幾點字符匹配除回車換行行分隔符和段分隔符以外的所有字符表示匹配一切字符

最近復習 JavaScript 教程，發現好多沒記住的，特以此記~

Dtae() 和 new Date() 區別，Date() 函數不能帶參數，屬于靜態方法

new Date()*1 === new Date().getTime() === Date.now() // 獲取時間戳
new Date(y, m, 0).getDate() // 獲取這個月有多少天，傳入年份和月份
new Date(y, m, 0).getDay() // 獲取這個月最后一天是星期幾
new Date(y, m-1, 1).getDay() // 獲取這個月第一天是星期幾

. 點字符匹配除回車(r)、換行(n) 、行分隔符(u2028)和段分隔符(u2029)以外的所有字符

[^] 表示匹配一切字符，其中包括換行符

str.replace(/2/gi, "1") 第二個參數可以使用美元符號$，用來指代所替換的內容

$&：匹配子字符串
$`：匹配結果前面的文本
$"：匹配結果后面的文本
$n：匹配成功的第n組內容，n是從1開始的自然數。
$$：指代美元符號$。
"hello world".replace(/(w+)s(w+)/, "$2 $1")
// "world hello"
"abc".replace("b", "[$`-$&-$"]")
// "a[a-b-c]c"

console.log(JSON.stringify(obj, null, 2)) 接受三個參數，打印對象格式化

參數一
如果對象的屬性是undefined、函數或 XML 對象，該屬性會被JSON.stringify過濾
如果數組的成員是undefined、函數或 XML 對象，則這些值被轉成null
正則對象會被轉成空對象
忽略對象的不可遍歷的屬性

參數二
接受一個數組，作為第二個參數，指定需要轉成字符串的屬性，只對對象的屬性有效
還可以是一個函數，用來更改JSON.stringify的返回值

參數三
如果是數字，表示每個屬性前面添加的空格（最多不超過10個）
如果是字符串（不超過10個字符），則該字符串會添加在每行前面
JSON.stringify發現參數對象有toJSON方法，就直接使用這個方法的返回值作為參數，而忽略原對象的其他參數

new Error() // 拋出一個錯誤
new SyntaxError() // 語法解析錯誤
new ReferenceError() // 非法或不能識別的引用值，使用未聲明的變量
new TypeError() // 操作類型錯誤，使用自身沒有的方法，let a = 22 a.sort() a 是 Number 類型而非數組
new RangeError() // 數值越界，Maximum call stack，調用一個不終止的遞歸函數，計算的值超出最大范圍
new URIError() // encodeURIComponent() encodeURI() 等URI函數使用錯誤

"a" in ["a", 1] 
for in for of 
arr.push(1, 2, 3)
[1, 2, 3, 4, 5].splice(2) 分離成兩個數組 [1, 2] [3, 4, 5] 

es6 明確把空位轉成 undefined
es5 有的跳過(forEach、filter、reduce、some、every)
map() 會跳過空位，但會保留這個值
join() 和 toString() 會將空位視為 undefined ，而 undefined 和 null 會被處理成空字符串

function rand(num) { 
    let seed = Date() * 1;
    seed = (seed * 9301 + 49297) % 233280; // 為何使用這三個數?
    let rc = seed / (233280.0);
    return Math.ceil(rc * num);
}
rand(10) // 取1~10的隨機數

0 / 0 NaN 
0 / 1 0 
1 / 0 Infinity

es6 分別用前綴 0b 0o 0x 表示 2 8 16 進制

base64 
    0~9 a~z A~Z "+" "/"    10 + 26 + 26 + 2 = 64
    不足補x00(零值字節)，然后在末尾加上1個或2個=號，表示補了多少個零值字節

Number.MAX_SAFE_INTEGER 9007199254740991 表示能夠精確表示的最大整數
Number.MIN_SAFE_INTEGER -9007199254740991 表示能夠精確表示的最小整數

ES6 在 Math 對象上新增了 17 個與數學相關的方法。所有這些方法都是靜態方法，只能在 Math 對象上調用

Math.trunc() // 去除一個數的小數部分，返回整數部分
Math.trunc(4.1) // 4
Math.trunc(-4.1) // -4
Math.hypot(3, 4) // 5 返回所有參數的平方和的平方根
Math.cbrt(8) // 2 計算一個數的立方根

es6 新增指數運算符 2 ** 2 ** 2 => Math.pow(2, 4)
這個運算符的一個特點是右結合，而不是常見的左結合。多個指數運算符連用時，是從最右邊開始計算的。

"hello"[1] // "e" 直接對字符串使用方括號運算符，僅能獲取操作

substring 類似slice，但是使用規則違反直覺，因此不建議使用substring方法，應該優先使用slice

str.charAt() // 下標
str.charCodeAt() // 十進制 Unicode 碼點
String.fromCharCode(97) // 逆操作
str.substr(0, 4) // 從零開始取4個
str[0]
str.concat(str2)
str1.localeCompare(str2) // Unicode 碼點比較大小

參考文章

宏任務                   瀏覽器 Node
I/O                     ?   ?
setTimeout              ?   ?
setInterval             ?   ?
setImmediate            ?   ?
requestAnimationFrame   ?   ?

微任務                   瀏覽器 Node
process.nextTick        ?   ?
MutationObserver        ?   ?
Promise.then            ?   ?

// 性能最好
function add(n) { 
    let res1 = 1;
    let res2 = 1;
    let sum = res2 
    for (let i = 2; i < n; i++) {
        sum = res1 + res2
        res1 = res2 
        res2 = sum 
    }
    return sum
}

// 把算過的存起來
var cache = []
function add(n) { 
    if (n <= 2) {
        cache[n] = 1
        return 1
    }
    if (cache[n] !== undefined) {
        return cache[n]
    }
    cache.push(add(n-1) + add(n-2))
    return cache[n]
}

// 最簡單，但是性能不行
function add() {
    if (n <= 2) {
        return 1
    }
    return add(n-1) + add(n-2)
}

1. 變量必須顯示聲明
2. 禁用 with
3. 進制刪除變量 // delete x => 語法錯誤 
4. 禁用 fn.caller fn.arguments // 報錯 
5. 對象不能有重名的屬性
6. 函數不能有重名的參數
7. 進制八進制表示法 02 

flex-grow flex-shrink flex-basis 放大 縮小占據的空間大小

flex: 0 1 auto; // 默認 
flex: 0 0 auto; // flex: none;
flex: 1 1 auto; // flex: auto;
flex: 1 1 0%; // flex: 1;

AST 抽象語法樹

babel-core 
    通過 babylon 把 es6 解析成 AST
    babel-traverse 對 ATS樹進行遍歷轉譯得到新的 AST樹 
    babel-generator 讀取 AST樹并將其轉換為代碼和源碼映射

對于新的 API、新的屬性，兩種處理方式
    babel-polyfill 把 es6環境整體引入到代碼中
        regenerator-runtime、core-js 

    babel-plugin-transform-runtime 按需引入
        babel-runtime 
            regenerator-runtime、core-js 
        babel-helpers 只引入單個，通過此插件可以把多次引入變成一個，減少代碼體積

把項目看成一個整體，通過給定的主文件，webpack 從這個主文件的入口開始找到項目中的所有依賴文件，然后使用
各種 loader 轉化、插件處理、文件處理，最后打包輸出到一個指定的文件夾中

webpack 打包優化措施

webpack.DllPlugin 拆分固定死的依賴文件，因為不會變化所以可以預先打包好，后面直接引用
HappyPack 多進程，默認開啟三個
babel-loader 開啟緩存 cacheDirectory: true 
exclude include 
noParse: /^(vue|vue-router|vuex|vuex-router-sync|axios)$/
css 用 contenthash
    hash 每次構建都會變
    chunkhash .vue 文件變了就會變
    contenthash 只有 css 變了才會變

function fast(arr) { // 快速排序
    if (arr.length <= 1) { // 終止遞歸條件
        return arr
    }
    
    let index = Math.floor(arr.length / 2) // 獲取中間值下標
    let val = arr.splice(index, 1)[0] // 刪除且獲取返回值
    let left = []
    let right = []

    for (let i = 0, len = arr.length; i < len; i++) { // 數組長度已經發生變化
        if (arr[i] < val) {
            left.push(arr[i]) // 小的放左邊
        } else {
            right.push(arr[i]) // 大的放右邊
        }
    }

    return fast(left).concat([val], fast(right)) // 合并數組
}

function maop(arr) { // 冒泡排序
    for (let i = 0, len = arr.length; i < len - 1; i++) {
        let flag = 0 

        for (let j = 0; j < len - i - 1; j++) {
            if (arr[j] > arr[j+1]) {
                let temp = arr[j]
                arr[j] = arr[j+1]
                arr[j+1] = temp 
                flag = 1
            }
        }

        if (flag === 0) {
            return arr
        }
    }
}