前端知识小总结

 

1. 类型强制转换
1.1.1 string强制转换为数字

a = '32' * 1 
a = '32' / 1 
a = + '32' 

 

1.1.2 数字强制转换为string

a = 32 + ''
a = String(32)
a = (32).toString()

1.2 使用Boolean过滤数组中的所有假值
1.2.1

const compact = arr => arr.filter(Boolean)
compact([0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34])

同下

[0, 1, false, 2, '', 3, 'a', 'e' * 23, NaN, 's', 34].filter(ite=>{return ite})

1.3 三元运算符

let s = a ? 'a为true' : 'a为false';

1.4 短路运算符

let param1 = expr1 && expr2
let param2 = expr1 || expr2

1.6 取整 | 0

1.3 | 0 // 1
-1.9 | 0 // -1

1.7 判断奇偶数 & 1

const num=3;
!!(num & 1)    // true
!!(num % 2)    // true

2. 函数
2.1 函数默认值

func = (l, m = 3, n = 4 ) => (l * m * n);
func(2) //output: 24

2.2 强制参数

mandatory = ( ) => {
　　throw new Error('Missing parameter!');
}
foo = (bar = mandatory( )) => { // 这里如果不传入参数，就会执行manadatory函数报出错误
　　return bar;
}

2.3 惰性载入函数,或者称为一次性函数，只执行一次便会被其子函数覆盖
第一次运行之后就会覆写这个方法，下一次再运行的时候就不会执行判断了。当然现在只有一个判断，如果判断很多，分支比较复杂，那么节约的资源还是可观的。

function foo(a,b){
　　console.log(1)
　　if(a !== b){
　　　　console.log('aaa')
　　}else{
　　　　console.log('bbb')
　　}
}

 

// 优化后

function foo(a,b){
　　console.log(2)
　　if(a != b){
　　　　foo = function(){
　　　　　　console.log('aaa')
　　　　}
　　}else{
　　　　foo = function(){
　　　　　　console.log('bbb')
　　　　}
　　}
　　return foo();
}
function foo(a,b){
　　console.log(2)
　　foo = function(){
　　　　console.log('3')
　　}
　　return foo();
}

3. 代码复用
3.1 Object [key]
简化示例（原）

function validate(values) {
　　if(!values.first)
　　　　return false;
　　if(!values.last)
　　　　return false;
　　return true;
}
console.log(validate({first:'Bruce',last:'Wayne'})); // true
（新）
const validate = (schema, values) => {
for(field in schema) {
　　if(schema[field].required) {
　　　　if(!values[field]) {
　　　　　　return false;
　　　　}
　　}
}
return true;
}
console.log(validate({first:'Bruce',last:'Wayne'}, {first:'Bruce',last:''})); // false
console.log(validate({first:'Bruce',last:'Wayne'}, {first:'Bruce',last:'Wayne'})); // true

4. 数字
4.1 精确到指定位数的小数

const round = (n, decimals = 0) => Number(`${Math.round(`${n}e${decimals}`)}e-${decimals}`)
round(1.345, 2) // 1.35

4.2 数字补0操作

const addZero2 = (num, len = 2) => (`${num}`).padStart(len , '0')
addZero2(32,4) // 0032

4.3 保留小数点后n位小数

(12.34567).toFixed(2) //12.35

5. 数组
5.1 使用解构来交换参数数值

[param1, param2] = [param2, param1];

 

1. //添加‘，’号

1.1添加任意位置‘，’号分割

function getCorrect(v,n=3){
　　 return (v + '').length > n ? v.replace(/(\d{n})/g,function (m,m1) { return m1 + ','; }) : v
}

1.2数字千分位分割

function getCorrect(v) {
    return parseInt(v).toLocaleString();
}