# JavaScript中的这些骚操作，你都知道吗？

## 数组去重 🐻

### 双层`for`循环去重

``````function unique(arr) {
for (var i = 0; i < arr.length; i++) {
for (var j = i + 1; j < arr.length; j++) {
if (arr[i] == arr[j]) {
arr.splice(j, 1);
j--;
}
}
}
return arr;
}

### 利用`indexOf`去重

``````function unique(arr) {
if (!Array.isArray(arr)) {
console.log("type error!");
return;
}
var array = [];
for (var i = 0; i < arr.length; i++) {
if (array.indexOf(arr[i]) === -1) {
array.push(arr[i]);
}
}
return array;
}

``````function unique(arr) {
if (!Array.isArray(arr)) {
console.log("type error!");
return;
}
return Array.from(new Set(arr));
}

## 数组转化为对象（`Array to Object`）🦑

``````var obj = {};
var arr = ["1","2","3"];
for (var key in arr) {
obj[key] = arr[key];
}
console.log(obj)

Output:
{0: 1, 1: 2, 2: 3}

``````const arr = [1,2,3]
const obj = {...arr}
console.log(obj)

Output:
{0: 1, 1: 2, 2: 3}

## 合理利用三元表达式 👩‍👦‍👦

``````const isGood = true;
let feeling;
if (isGood) {
feeling = 'good'
} else {
}
console.log(`I feel \${feeling}`)

Output:
I feel good

``````const isGood = true;
const feeling = isGood ? 'good' : 'bad'
console.log(`I feel \${feeling}`)

Output:
I feel good

## 转换为数字类型（`Convert to Number`）🔢

``````const age = "69";
const ageConvert = parseInt(age);
console.log(typeof ageConvert);

Output: number;

``````const age = "69";
const ageConvert = +age;
console.log(typeof ageConvert);

Output: number;

## 转换为字符串类型（`Convert to String`）🔡

``````let a = 123;

a.toString(); // '123'

``````let a = 123;

a + ""; // '123'

## 性能追踪 🥇

``````let start = performance.now();
let sum = 0;
for (let i = 0; i < 100000; i++) {
sum += 1;
}
let end = performance.now();
console.log(start);
console.log(end);

## 合并对象（`Combining Objects`）🌊

``````const obj1 = { a: 1 }
const obj2 = { b: 2 }
console.log(Object.assign(obj1, obj2))

Output:
{ a: 1, b: 2 }

``````const obj1 = { a: 1 }
const obj2 = { b: 2 }
const combinObj = { ...obj1, ...obj2 }
console.log(combinObj)

Output:
{ a: 1, b: 2 }

## 短路运算(`Short-circuit evaluation`) 🥅

``````if (isOnline) {
postMessage();
}
// 使用&&
isOnline && postMessage();

// 使用||
let name = null || "森林";

## 数组扁平化（`Flattening an array`）🍓

### 递归

``````var arr = [1, [2, [3, 4]]];

function flatten(arr) {
var result = [];
for (var i = 0, len = arr.length; i < len; i++) {
if (Array.isArray(arr[i])) {
result = result.concat(flatten(arr[i]));
} else {
result.push(arr[i]);
}
}
return result;
}

console.log(flatten(arr));

### `reduce`

``````var arr = [1, [2, [3, 4]]];

function flatten(arr) {
return arr.reduce(function (prev, next) {
return prev.concat(Array.isArray(next) ? flatten(next) : next);
}, []);
}

console.log(flatten(arr));

``````let arr = [1, [2, 3, [4, [5]]]];
arr.flat(3); // [1,2,3,4,5]

## 求幂运算 🍜

``````console.log(Math.pow(2, 10));

`ES7`中引入了指数运算符`**``**`具有与`Math.pow()`一样的计算结果。

``````console.log(2 ** 10); // 输出1024

## 浮点数转为整数（`Float to Integer`）🦊

``````console.log(~~6.95); // 6
console.log(6.95 >> 0); // 6
console.log(6.95 << 0); // 6
console.log(6.95 | 0); // 6
// >>>不可对负数取整
console.log(6.95 >>> 0); // 6

## 截断数组

``````let array = [0, 1, 2, 3, 4, 5];
array.length = 3;
console.log(array);

Output: [0, 1, 2];

## 获取数组中的最后一项 🦁

``````let arr = [0, 1, 2, 3, 4, 5];
const last = arr[arr.length - 1];
console.log(last);

Output: 5;

``````let arr = [0, 1, 2, 3, 4, 5];
const last = arr.slice(-1)[0];
console.log(last);

Output: 5;

## 美化你的`JSON` 💄

• `json`: 必须，可以是数组或`Object`
• `replacer`: 可选值，可以是数组，也可以是方法
• `space`: 用什么来进行分隔

## `Object.create(null)` 🐶

`Vue``Vuex`的源码中，作者都使用了`Object.create(null)`来初始化一个新对象。为什么不用更简洁的`{}`呢？ 我们来看下`Object.create()`的定义：

``````Object.create(proto,[propertiesObject])

• `proto`:新创建对象的原型对象
• `propertiesObject`:可选。要添加到新对象的可枚举（新添加的属性是其自身的属性，而不是其原型链上的属性）的属性。

## 拷贝数组 🐿

### `Array.slice`

``````const arr = [1, 2, 3, 4, 5];
const copyArr = arr.slice();

### 展开操作符

``````const arr = [1, 2, 3, 4, 5];
const copyArr = [...arr]

### 使用 `Array` 构造函数和展开操作符

``````const arr = [1, 2, 3, 4, 5];
const copyArr = new Array(...arr)

### `Array.concat`

``````const arr = [1, 2, 3, 4, 5];
const copyArr = arr.concat();

## 避免多条件并列 🦀

``````if (status === 'process' || status === 'wait' || status === 'fail') {
doSomething()
}

### `switch case`

``````switch(status) {
case 'process':
case 'wait':
case 'fail':
doSomething()
}

### `includes`

``````const enum = ['process', 'wait', 'fail']
if (enum.includes(status)) {
doSomething()
}

## `Object.freeze()` 🃏

`Vue` 的文档中介绍数据绑定和响应时，特意标注了对于经过 `Object.freeze()` 方法的对象无法进行更新响应。 `Object.freeze()` 方法用于冻结对象，禁止对于该对象的属性进行修改。