모든 자바스크립트 개발자가 알아야 할 초보자를 위한 9가지 트릭

JavaScript를 처음 배우기 시작했을 때 다른 사람의 코드, 코드 챌린지 웹사이트, 그리고 내가 따르는 튜토리얼 이외의 모든 곳에서 발견한 모든 시간 절약 팁을 기록해 두었습니다.

유난히 훌륭하거나 유익하다고 생각되는 9가지 제안을 엄선해 드리겠습니다. 이 게시물은 초보자를 대상으로 하지만 숙련된 JavaScript 개발자도 이 목록에서 유용한 정보를 찾을 수 있기를 바랍니다.

구조 분해 할당 구문

JavaScript 개체에서 관련 정보를 추출하는 쉽고 효율적인 방법입니다.

이 구문을 사용하면 한 줄로 변수를 변경하거나 반환된 개체에서 관련 특성만 구문 분석하는 것과 같은 다양한 트릭을 사용할 수 있습니다.

const company = {
  products: ['phone', 'laptop', 'camera'],
}
const { 0: phone, 2: camera } = company.products

console.log(camera) //camera
console.log(phone) //phone

배열의 크기 변경

작업 중인 배열의 길이를 변경하면 초과 요소가 제거됩니다. 어레이를 비우는 데에도 사용할 수 있습니다.

const array = [1, 2, 3, 4, 5]

console.log(array.length)
//5

array.length = 3
console.log(array.length)
//3

스프레드 연산자

확산 연산자를 사용하여 배열과 객체를 얕은 복사할 수 있습니다!!!!

또한 각 인스턴스를 힘들게 반복하고 병합하는 대신 배열을 연결하거나 개체를 한 줄로 병합하는 훌륭한 기술입니다.

const array = [1, 2, 3, 4, 5]
const company = {
  founder: 'John Doe',
}

console.log({ ...company, emp: 10 }) //{founder:"John Doe",emp:10}
console.log([...array, 6]) //[1,2,3,4,5,6]

배열 정렬

const array = [1, 5, 7, 9, 6, 3]

console.log(array.sort((a, b) => a - b)) //[1,3,5,6,7,9]
console.log(array.sort((a, b) => b - a)) //[9,7,6,5,3,1]

코드를 실행하는 데 걸리는 시간 찾기

time 메서드는 타이머 이름을 입력으로 받아들이고 timeEnd를 호출할 때 동일한 타이머 이름이 제공될 것으로 기대합니다.

timeEnd 메서드는 두 함수 호출 사이의 경과 시간(밀리초)을 보여줍니다.

console.time('timer')
for (let i = 0; i < 1e7; i++);
console.timeEnd('timer')

10진수를 2진수로 변환

정수를 Binary, Hexa 또는 Octa 값으로 변환하고 싶습니다..

이것이 자바스크립트 방식입니다!!

const num = 10

console.log(num.toString(2)) //10
console.log(num.toString(8)) //12
console.log(num.toString(16)) //a

console.log를 반복해서 작성할 필요가 없습니다.

console.log를 반복해서 작성하는 데 지쳤습니다.

더 이상은 아닙니다. 콘솔 로그를 줄이고 코딩 속도를 높이는 방법을 알아보세요.

const c= console.log.bind()

c(455)
// 455

잘못된 값 필터링

배열에서 잘못된 값을 필터링해야 하는 경우가 있습니까?

0, 정의되지 않음, null, false, ""와 같은 거짓 값은 다음 방법을 사용하여 간단히 무시할 수 있습니다.

const arr=[1,2,'',false]

arr.filter(Boolean)
// [1,2]

버튼 수정

Pressable 래퍼를 사용하십시오. Touchable/Highlight 구성 요소와 유사하지만 더 많은 사용자 지정이 가능합니다.

몇 가지 프레스 기능은 다음과 같습니다.
onPressIn은 프레스가 활성화될 때 호출됩니다.
누르기 제스처가 비활성화되면 onPressOut이 호출됩니다.