코딩 효율성을 향상시키기 위해 js 구문의 10가지 일반적인 방법을 요약합니다.-JS 튜토리얼-php.cn

코딩 효율성을 향상시키기 위해 js 구문의 10가지 일반적인 방법을 요약합니다.

零下一度

풀어 주다： 2017-05-17 18:01:32

원래의

1580명이 탐색했습니다.

서문

일과 생활의 변화로 인해 최근 기사 작성 빈도가 조금 줄어들고 있어 정말 죄송합니다. 곧 속도가 느려질 것이라고 믿으며 천천히 회복하고 있으며 지속적인 관심과 지원에 감사드립니다.

이 글에서는 JavaScript 코드를 작성할 때의 몇 가지 방법과 기술을 주로 공유합니다. 때로는 모든 길이 로마로 통하지만 항상 최단 경로가 있을 수 있습니다. 다음 JavaScript 기술을 통해 모든 사람의 코드가 "복잡하고 단순화되고 단순화되고 세련"될 수 있기를 바랍니다.

잘 배워서 활용하세요

1. new Set()

ES6에서 새로운 데이터가 제공되는 걸 아시는 분도 계실 텐데요. 구조는 Set이지만 유연하게 활용하실 수 있는 분들은 많지 않을 것 같습니다. Set 데이터 구조를 사용하면 배열을 쉽게 중복 제거할 수 있습니다. 예를 들면 다음과 같습니다.

let arr = [1, 2, 2, 3];
let set = new Set(arr);
let newArr = Array.from(set); // Array.from方法可以将 Set 结构转为数组。

console.log(newArr); // [1, 2, 3]

로그인 후 복사

2. Object.ass()

Object.ass()도 다음에서 제공됩니다. ES6 객체의 확장 메소드는 다음과 같이 객체를 병합하고 복사하는 데 사용할 수 있습니다:

let obj1 = {a: 1};
let obj2 = {b: 2};
let obj3 = Object.assign({}, obj1, obj2);

console.log(obj3); // {a: 1, b: 2}

로그인 후 복사

3.map()

맵 메소드는 배열을 탐색하는 데 사용되며 반환값이 있습니다. 각 항목이 작동되고 새 배열이 생성되는 경우도 있습니다.

let arr3 = [1, 2, 3, 4, 5];

let newArr3 = arr3.map((e, i) => e * 10); // 给数组每一项乘以10

console.log(newArr3); // [10, 20, 30, 40, 50]

로그인 후 복사

4.filter()

filter와 같이 코드를 단순화하기 위해 for 및 forEach 루프를 대체할 수 있습니다. 이름에서 알 수 있듯이 순회 배열에도 사용되는 메서드는 배열을 필터링하고, 각 요소 다음에 콜백 함수 를 트리거하고, 판단을 통해 현재 항목을 유지하거나 제거하고, 마지막으로 새 배열을 반환하는 것입니다. as:

let arr4 = [1, 2, 3, 4, 5];

let newArr4 = arr4.filter((e, i) => e % 2 === 0); // 取模，过滤余数不为0的数

console.log(newArr4); // [2，4]

로그인 후 복사

5.some()

some 메소드는 배열을 순회하고 각 요소가 조건을 충족하는 한 콜백 함수를 트리거하는 데 사용됩니다. 그렇지 않으면 다음과 같이 || 비교와 유사하게 false를 반환합니다.

let arr5 = [{result: true}, {result: false}];

let newArr5 = arr5.some((e, i) => e.result); // 只要一个为true，即为true

console.log(newArr5); // true

로그인 후 복사

6.every()

모든 메서드는 배열을 순회하고 각 요소 다음에 콜백 함수를 트리거하는 데 사용됩니다. . 한 요소가 조건을 충족하지 않는 한 false를 반환하고, 그렇지 않으면 && 비교와 유사하게 true를 반환합니다(예:

let arr6 = [{result: true}, {result: false}];

let newArr6 = arr6.every((e, i) => e.result); // 只要一个为false，即为false

console.log(newArr6); // false

로그인 후 복사

7 ~~<🎜). >~ 기호는 JavaScript에서 비트 부정을 수행하는 데 사용되며, ~~는 Invert를 두 번 수행한다는 의미이며,

비트 연산

의 연산 값은 정수여야 하며, 결과도 정수이므로 비트 연산은 자동으로 정수가 되며, ParseInt와 유사하게 소수 부분을 교묘하게 제거할 수 있습니다. 예:

let a = 1.23;
let b = -1.23;

console.log(~~a); // 1
console.log(~~b); // -1

로그인 후 복사

8 || > || 연산자를 사용하면

변수

에 대한 기본값을 설정할 수 있습니다. 예:

let c = 1;
let d = c || 2; // 如果c的值为true则取存在的值，否则为2

console.log(d); // 1

로그인 후 복사

9...Operator...Operator는 ES6에서 배열을 분해하는 데 사용되는 방법으로 다음과 같이 배열의 매개변수를 빠르게 얻는 데 사용할 수 있습니다.

let [num1, ...nums] = [1, 2, 3];

console.log(num1); // 1
console.log(nums); // [2, 3]

로그인 후 복사

10.

삼항 연산

연산자

이 연산자 다음과 같이 조용히 작성하면 if else 작성을 단순화할 수 있습니다.

let e = true,
    f = &#39;&#39;;

if (e) {
    f = &#39;man&#39;;
} else {
    f = &#39;woman&#39;;
}

// 等同于
e ? f = &#39;man&#39; : f = &#39;woman&#39;;

로그인 후 복사

결론

이 기사에는

에서 코딩 효율성을 향상시키는 10가지 일반적인 방법만 나열되어 있습니다. JavaScript 구문