8가지 유용한 자바스크립트 팁과 요령

우리 모두는 JavaScript가 훌륭하다는 것을 알고 있지만 때때로 솔루션을 찾아야 하는 몇 가지 어려움에 직면합니다.

이 기사에서는 언젠가 필요할 수 있는 몇 가지 요령을 알려 드리겠습니다.

모든 배열 요소를 문자열로 변환

이 예에서는 내장된 javascript 메서드.map()를 사용하여 요소를 반복하고 문자열로 변환합니다.

function allToString(array) {
    return array.map(elm => {
        return Array.isArray(elm) ? allToString(elm) : elm.toString()
    })
}

allToString([1, 2, 3, [4]])
// 👉 [ '1', '2', '3', [ '4' ] ]

숫자 범위 만들기

range() 함수는 지정된 숫자에서 시작하여 지정된 숫자에서 중지하는 일련의 숫자를 반환합니다.

function range(from, to) {
    return Array((to - from) + 1).fill(0).map(() => from++)
}

range(1, 10)
// 👇
// [
//   1, 2, 3, 4,  5,
//   6, 7, 8, 9, 10 
// ]

개체에 속성이 있는지 확인

var obj = {
    a: 1,
    b: 2,
    c: 3
}

var aExists = !!obj['a'] // true
var rExists = !!obj['r'] // false
var uExists = !!obj['u'] // false

개체에서 속성 제거

속성 값과 속성 자체를 모두 삭제하는 키워드delete를 사용합니다.

var obj = {
    name: 'John',
    age: 23,
    country: 'UK'
}

// Usage
delete obj.country;

// 👇
// {
//   name: 'John',
//   age: 23
// }

개체의 빈 문자열을 null 값으로 바꾸기

이 트릭에서는 개체의 키 주위를 반복하고 빈 문자열인 경우 null로 바꿉니다.

var obj = {
    a: '💎',
    b: '✨',
    c: '',
    d: '🔮'
}

function replaceEmpty(object) {
    if (!object || typeof object !== "object") return;

    let newValues = Object.values(object).map(v => v.trim() ? v : null);
    let objectKeys = Object.keys(object);

    for (let i = 0; i < objectKeys.length; i++) {
        object[objectKeys[i]] = newValues[i]
    }

    return object
}

// Usage
replaceEmpty(obj)

// 👇
// {
//     a: '💎',
//     b: '✨',
//     c: null,
//     d: '🔮'
// }

문자열 배열에서 가장 긴 문자열 반환

기본 제공 방법.sort()을 사용하여 배열을 정렬하면 쉽게 만들 수 있습니다. 문자열의 길이에 따라 배열을 내림차순으로 정렬한 다음 배열의 첫 번째 요소를 반환합니다.

var arr = ['Hashnode', 'is', 'cool']

function findLongest(array) {
    return arr.sort((a, b) => b.length - a.length)[0]
}

// Usage
findLongest(arr)

// 👉 "Hashnode"

모든 배열 요소가 동일한지 확인

메서드.every()는 배열의 모든 요소를 ​​확인하고 모두 첫 번째 요소와 같은지 알려줍니다.

var arr1 = [true, true, true]
var arr2 = [false, true, true]
var arr3 = [1, 2, 3]

var check = (array) => new Set(array).size <= 1

// Usage
check(arr1) // true
check(arr2) // false
check(arr3) // false

문자열 반전

이 트릭을 구현하려면 다음 단계를 따르십시오.

.split("")를 사용하여 문자열을 문자 배열로 분할합니다.

    ["H", "a", "s", "h", "n", "o", "d", "e"]

.reverse()를 사용하여 배열을 뒤집습니다.

    ["e", "d", "o", "n", "h", "s", "a", "H"]

이제 .join("")를 사용하여 문자를 다시 문자열로 바꿉니다.

    "edonhsaH"

const reverse = (string) => string.split("").reverse().join("")

// Usage
reverse("Hello, World!") // !dlroW ,olleH
reverse("Hashnode")      // edonhsaH
reverse("ABC")           // CBA

이 기사가 마음에 들면 친구 및 동료와 공유하십시오!

계속 연락하고,

Take a look at my open-source projects