javascript practical writing summary

To Boolean type

`!!'a'`

With two negations, you can cast to Boolean type.

Transfer Number type

```  // String Convert to Number
console.log(+'45');
// Date output timestamp
console.log(+new Date);```

parseInt

~~, which also converts strings to numeric types. Round down.

```  // ~~Convert string to numeric type, round down
console.log(~~3.14159); //3
console.log(~~'5.678'); //5
console.log(-2.33 | 0 );  //-2
console.log(2.33 >> 0 ); //2```

The principle is that ~ is an operation called bitwise negation, which will return the inverse of the value. Two negations are the original number. |Is a bit operator. If one of the two bits is 1, the result will be 1. Otherwise, it will be 0. >>Operator performs a signed shift right operation. All binary operations. The reason is that the number in JavaScript is of double type, which needs to be converted to int when operating in place.

Hex

Hexadecimal operation. It's actually a Array.prototype.toString(16) Usage of
It must be the color of CSS to see the word.

It can be random

`console.log((~~(Math.random()*(1<<24))).toString(16)); `

«
Shift left operation, shift the value binary to the left
Explain the above 1 < < 24 operation
In fact, 1 moves 24 bits left. 000000000000000000000001 moved 24 bits to the left and became 100000000000000000000

Short circuit expression, discard if else

Reverse example:

```if () {
// ...
} else if () {
// ...
} else {
// ...
}```

Use|and & & to simplify if else. Sometimes the if else pattern can be simplified by using the!! operator. For example:

```let a = b || 1;//b It's true, a=b;b False, a=1;
let c = b && 1;//b It's true, c=1;b False, c=b;
// use!!Symbol
let isValid = !!(value && value !== 'error');```

Another undefined

`let data = void 0; // undefined`

Keep the decimal point of the specified number of digits

```let num = 2.443242342;
num = num.toFixed(4); //"2.4432"```

Note that the toFixed() method returns a string rather than a number.

Single line write a rating component

```let rate1 = 1;
let star1 = "★★★★★☆☆☆☆☆".slice(5 - rate1, 10 - rate1);//"★☆☆☆☆"
console.log(star1);
let rate2 = 2;
let star2 = "★★★★★☆☆☆☆☆".slice(5 - rate2, 10 - rate2);//"★★☆☆☆"
console.log(star2);
let rate3 = 3;
let star3 = "★★★★★☆☆☆☆☆".slice(5 - rate3, 10 - rate3);//"★★★☆☆"
console.log(star3);
let rate4 = 4;
let star4 = "★★★★★☆☆☆☆☆".slice(5 - rate4, 10 - rate4);//"★★★★☆"
console.log(star4);
let rate5 = 5;
let star5 = "★★★★★☆☆☆☆☆".slice(5 - rate5, 10 - rate5);//"★★★★★"
console.log(star5);```

Money formatting

```let cash = '1234567890'
let num = cash.replace(/\B(?=(\d{3})+(?!\d))/g, ',');//"1,234,567,890"
console.log(num);

//Irregular elegant implementation
function formatCash(str) {
return str.split('').reverse().reduce((prev, next, index) => {
return ((index % 3) ? next : (next + ',')) + prev
})
}
let num2 = formatCash(cash);//"1,234,567,890"
console.log(num2);```

Deep copy of standard JSON

```let a = {
a1: 1,
b1: { c: 1, d: 2 }
};
let b=JSON.parse(JSON.stringify(a));
console.log(b);//{a1: 1, b1: {...}}```

Array de duplication

Using Set to remove weight and compare cattle in ES6

```let array=[1, "1", 2, 1, 1, 3];
//Extended operator(...)Internal use for...of loop
let arr1 = [...new Set(array)];//(4) [1, "1", 2, 3]
console.log(arr1);

//utilize Array.from take Set Structure to array
let arr2 = Array.from(new Set(array));//(4) [1, "1", 2, 3]
console.log(arr2);```

Get the maximum and minimum values in the array

Math.max Method can find the maximum number of given parameters.

```console.log(Math.max('1','2','3.1','3.2'));//3.2
console.log(Math.min(1,0,-1));//-1```

But if it's an array, it can't be called like this. The apply method is used. Function.apply() is an OOP feature of JS, which is generally used to simulate the purpose of inheriting and extending this. All functions have the method of "apply" (scope chain, parameter). When the scope chain is null, it defaults to the above. The "parameter" of this function receives an array.

```let arr = ['1','2','3.1','3.2',0,-1];
//use apply method
console.log(Math.max.apply(null, arr));//3.2
console.log(Math.min.apply(Math, arr));//-1
//Using extended operators
console.log(Math.max(...arr));//3.2
console.log(Math.min(...arr));//-1```

IIFE

```(function(arg) {
// do something
})(arg)```

The practical value is to prevent the overall pollution.

Event

Write a counter

By creating a closure, encapsulate the times in it, and then return the function.

```<html>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<body>
<button class="foo">click me</button>
</body>
</html>

<script>

let foo = document.querySelector('.foo')