Несколько способов сокращения кода javascript

внешний интерфейс JavaScript

"Это 15-й день моего участия в августовском испытании обновлений. Узнайте подробности события:Испытание августовского обновления"

В этой статье описываются некоторые работы по общим навыкам программирования на JavaScript. Очень полезно, предлагаю попрактиковаться в быстром чтении, помните об этом!

Прежде всего, я рекомендую плагин для VSCode, Quokka.js, Artifact код отладки. Функция плагина - немедленно выполнить код JavaScript или Tymdercript Code, который вы вводите.

image.png

стрелочная функция

Сокращенное правило:

  1. Параметр только один, скобки можно не указывать
  2. Возвращаемое значение только одно, фигурные скобки и возврат можно не указывать
let arr=[1,2,3]

arr.filter((item)=>{
    return item >1
})

//只有一个参数，小括号可以不写
arr.filter(item=>{
    return item>1
})
//返回值只有一个，花括号和return可以不写
arr.filter(item=>item>1)

Освойте общие методы работы с массивами

Освойте распространенные методы работы с массивами, держите их в уме, не смотрите на API, когда их пишете, это может эффективно повысить эффективность кодирования, ведь эти методы используются каждый день

  • every
  • some
  • filter
  • map
  • forEach
  • find
  • findIndex
  • reduce
  • includes

image.png

Освойте общие функции работы со строками

  • trim
  • startsWidth
  • includes
let str="Hello JueJue  "
//包含子串
console.log(str.includes("Hello"))
// 以子串开头
console.log(str.startsWith("Hello"))
// 去除收尾空格
console.log(str.trim())

спред оператор

Очень полезно, вот два сценария использования: Разрушение массива

//数组去重
function removeRepeat(arr){
    return  [...new Set(arr)]
}
//数组求最大值
Math.max(...arr)
Math.min(...arr)

деконструировать объект

//react  用于一次传入多个属性
let props={name:'Ben',age:10,sex:0}
const greeting=<Greeting {...props} />

//组合对象 这种情况可以使用Object.assign代替
let defaultParams={
    pageSize:1,
    pageNumber:10,
    sort:1
}

let reqParams={
    ...defaultParams,
    phone:'15196255885'
}

сокращение объекта

Ключ и значение объекта имеют одно и то же имя, вы можете просто написать ключ и использовать намного меньше кода.

let id,age,sex

let person={
    id,
    age,
    sex
}

присваивание деструктуризации

  • для параметров функции
  • для разрушения объектов

Чуть меньше кода

class Spirit{
    constructor({x=0,y=0,w=10,h=10,rotate=0}){//函数参数结构
        this.x=x
        this.y=y
        this.w=w
        this.h=h
        this.rotate=rotate
    }
    draw(){
        const {x,y,w,h,rotate}=this
        console.log("draw -> x,y,w,h,rotate", x,y,w,h,rotate)
    }
}

Узнайте, как преобразовывать типы данных

Люди, которые пишут JS, обычно не имеют понятия о типах и не очень чувствительны к различиям между Number и String. На самом деле, тип данных JS очень важен. Если вы не обратите внимание, вы можете сделать ошибки, поэтому я Надеюсь, вы помните следующие методы.

Преобразование между числовыми и строковыми типами

Обычно мне нравится использовать конструктор для превращения

Number('001')  //-> 1
String('1')   // ->1

сохранить N за десятичные места

function cutNumber(value,n=2){//默认保留2位小数
    return Number(value).toFixed(n)
}
Категории