The purpose of this article is to document some of the most practical techniques in development. Here are some of the most impressive ones. If there is a better strange sexual skill, welcome to discuss together supplement.

1. Swap two variables

// Swap two variables, no intermediate variables and applies to value type and reference type swaps
[x, y] = [y, x]
// or
// x = [y,y=x][0]
Copy the code

2. Array stitching

let a = [1.2.3]
let b = [3.4.5]
let c = [6.7] a.push(... b, ... c)// Do not reassign
a = [...a, ...b, ...c]
a = a.concat(b, c)
Copy the code

3. Array deduplication

// Applies to value types and reference types
const a = [1.2.3]
const b = [2.3.4.5]
let arr = [...new Set([...a, ...b])]
Copy the code

4. Array replication

const arr = [1.2.3]
const [...copyArr1] = arr
const copyArr2 = [...arr]
Copy the code

5. Array deconstruction and assignment

const arr = [1.2.3.4.5]
const [a0,...other] = arr
Copy the code

We can use this feature to do string uppercase function

// Uppercase
String.prototype.firstLetter2UpperCase = function () {
    const [letter0, ...otherLetters] = [...this.valueOf()]
    return [letter0.toUpperCase(), ...otherLetters].join(' ')}// Start with a lowercase letter
String.prototype.firstLetter2LowerCase = function () {
    const [letter0, ...otherLetters] = [...this.valueOf()]
    return [letter0.toLowerCase(), ...otherLetters].join(' ')}Copy the code

6. Quickly populate arrays with independent objects

// Each object in the array is a separate object
let arr = new Array(5).fill(' ').map((a)= > ({a:1}))
Copy the code

7. Empty the array

const arr = [1.2.3]
// The most efficient cleanup method
arr.length = 0
Copy the code

8. Union, intersection, and difference sets

const obj = {
    key: 'value'
}
const a = new Set([1.2.4, obj])
const b = new Set([2.3.4, obj])

/ / and set
const union = new Set([...a, ...b])
/ / intersection
const intersect = new Set([...a].filter(item= > b.has(item)))
/ / difference set
const diffrence = new Set([...a].filter(item= >! b.has(item)))console.log([...union])
// [ 1, 2, 4, { key: 'value' }, 3 ]
console.log([...intersect])
// [ 2, 4, { key: 'value' } ]
console.log([...diffrence])
/ / [1]
Copy the code

9. Filter out false values in the array

JS false values are null, undefined, “” (empty string), +0, -0, NaN

[1.' ', {a:1},undefined, {},null, () = > {},0.NaN].filter(Boolean)
// [1, {a:1}, {}, ()=>{}]
Copy the code

10. Set the default values

const defaultObj = {
    x: 22.z: 33
}
const otherSetting = {
    x: 1.y: 2
}
constresult = { ... otherSetting, ... defaultObj,// Default values are at the end
}
// or
// const result = Object.assign({}, otherSetting, defaultObj)
console.log(result === otherSetting, result)
// false { x: 22, y: 2, z: 33 }
Copy the code

11. Integer

1.1 | 0 	/ / 1
1.6 | 0 	/ / 1
1.1 | 0 	// -1
1.6 | 0 	// -1
Copy the code

12. Verify default parameters

function required() {
   	throw new Error('Missing parameter')}function foo(p = require()) {
   	console.log(p)
}
Copy the code

13. Unified operation of multidimensional arrays or deep-level data

The following is an example of a real development scenario: verify that input values of multiple nodes cannot contain invalid characters’ $’

const nodes = [{
      name: 'nodeA'.inputs: [{
        id: 'nodeAinput1'.value: '$asdfas'
      }, {
        id: 'nodeAinput2'.value: 'value'}]}, {name: 'nodeB'.inputs: [{
        id: 'nodeBinput1'.value: '$asdfas'
      }, {
        id: 'nodeBinput2'.value: 'value'}}],]Inputs: // Check all inputs for unified processing, such as value
  const allInputs = nodes.map(node= > node.inputs).flat(Infinity)
  // Find all input with '$'
  const errorInputs = allInputs.filter(input= > input.value.includes('$'))
Copy the code