平常開發經常使用技巧與方法

CSS部分

盒子邊傾斜

clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%);

禁止點擊事件/鼠標事件「穿透」

div * {
    pointer-events: none;   /*連接啊，點擊事件啊，都沒有效果了*/ 
}

用來控制元素在移動設備上使用滾動回彈效果

.main{
    -webkit-overflow-scrolling: touch;
}

可解決在IOS中使用overflow:auto 造成的滾動條，滾動不流暢的狀況

文字漸變效果

.text-gradient{
    background-image: linear-gradient(135deg, deeppink, deepskyblue);
    -webkit-background-clip: text;
    color: transparent;
}

css三角形

#triangle-up {

 width: 0;

 height: 0;

 border-left: 50px solid transparent;

 border-right: 50px solid transparent;

 border-bottom: 100px solid red;

}

JS部分

JavaScript中檢測數組的方法

(1)、typeof操做符

這種方法對一些經常使用的類型檢查沒有問題，但對array和null 都判斷爲object
(2)、instanceof操做符

這個操做符是檢測對象的原型鏈是否指向構造函數的prototype對象的
(3)、對象的constructor屬性

const arr = []

console.log(arr.constructor === Array) // true

(4)、Object.prototype.toString

const arr = []

console.log(Object.prototype.toString.call(arr) === '[object Array]') // true

(5)、Array.isArray()

經常使用的字符串操做

1. 字符串轉化toString()
2. 字符串分隔split()
3. 字符串替換replace()
4. 獲取長度length
5. 查詢子字符串 indexOf
6. 返回指定位置的字符串或字符串編碼 charAt charCodeAt
7. 字符串匹配 match
8. 字符串拼接concat
9. 字符串的切割或提取slice() substring() substr()
10. 字符串大小寫轉化 toLowerCase toUpperCase
11. 字符串去空格 trim() 用來刪除字符串先後的空格

其中第9中三者的區別以下：
（1）slice(), 參數能夠是負數，負數表示從字符串最後一個位置開始切割到對應結束位置
（2）substring()，參數不可爲負數，切割第一個位置到第二個位置的字符串
（3）substr()， 參數不可爲負數，第一個參數是開始位置，第二個參數爲切割的長度
字符串去重
const str = '11122223333'
const arr = str.split('')
const uniqueStr = [...new Set(arr)].join('')

經常使用的數組操做

一、Array.map()
此方法是將數組中的每一個元素調用一個提供的函數，結果做爲一個新的數組返回，並無改變原來的數組
二、Array.forEach()
此方法是將數組中的每一個元素執行傳進提供的函數，沒有返回值，注意和map方法區分
三、Array.filter()
此方法是將知足條件的元素做爲一個新數組返回
四、Array.every()
此方法將數組全部元素進行判斷返回一個布爾值，若是全部元素都符合判斷條件，則返回true，不然返回false
五、Array.some()
此方法將數組全部元素進行判斷返回一個布爾值,若是有一個元素知足判斷條件，則返回true，全部元素都不知足則返回false
六、Array.reduce()
此方法爲全部元素調用返回函數
七、Array.push()
在數組最後面添加新元素
八、Array.shift()
刪除數組第一個元素
九、Array.pop()
刪除數組最後一個元素
十、Array.unshift()
在數組最前面增長元素
十一、Array.isArray()
判斷是否爲一個數組
十二、Array.concat()
數組拼接
1三、Array.toString()
數組轉化爲字符串
1四、Array.join()
數組轉化爲字符串，並用第一個參數做爲鏈接符
1五、Array.splice(開始位置，刪除個數，元素)