일상적인 작업에서 우리는 정렬, 검색, 고유 값 찾기, 매개 변수 전달, 값 교환 등과 같은 기능을 작성하므로 여기에 간단한 팁 목록을 정리했습니다!
이러한 방법은JavaScript는 배우고 사용하기에 정말 훌륭한 언어입니다. 주어진 문제에 대해 동일한 솔루션에 도달하는 방법은 여러 가지가 있을 수 있습니다. 이 글에서는 가장 빠른 것들에 대해서만 논의할 것입니다.
확실히 도움이 될 것입니다
.최신 버전은 ECMAScript11(ES2020)이지만 대부분의 JavaScript Hack은 ECMAScript6(ES2015) 이상의 기술을 사용합니다.
==참고==: 아래의 모든 팁은 Google Chrome 콘솔에서 테스트되었습니다.
(예: "", null 또는 0)을 사용하여 특정 크기의 배열을 초기화할 수 있습니다. 이미 1D 배열에 이것을 사용하고 있을 수도 있지만 2D 배열/행렬을 어떻게 초기화합니까?
const 배열 = Array(5).fill('');
// 출력(5) ["", "", "", "", ""]
const 행렬 = Array(5).fill(0).map(()=>Array(5).fill(0));
// 출력(5) [배열(5), 배열(5), 배열(5), 배열(5), 배열(5)]
0: (5) [0, 0, 0, 0, 0]
1: (5) [0, 0, 0, 0, 0]
2: (5) [0, 0, 0, 0, 0]
3: (5) [0, 0, 0, 0, 0]
4: (5) [0, 0, 0, 0, 0]
length: 5 기본적인 수학 연산을 빠르게 찾으려면 reduce 메소드를 사용해야 합니다.
const 배열 = [5,4,7,8,9,2];
array.reduce((a,b) => a+b); // 출력:
array.reduce((a,b) => a>b?a:b); // 출력:
array.reduce((a,b) => a<b?a:b); // 출력: 2
문자열을 정렬하기 위한 내장 메서드 sort() 및 reverse() 가 있지만 숫자나 객체의 배열은 어떻습니까?
숫자와 객체에 대한 오름차순 및 내림차순 정렬 기술을 살펴보겠습니다.
const stringArr = ["Joe", "Kapil", "Steve", "Musk"] stringArr.sort(); // 출력(4) ["Joe", "Kapil", "Musk", "Steve"] stringArr.reverse(); // 출력 (4) ["Steve", "Musk", "Kapil", "Joe"]
const array = [40, 100, 1, 5, 25, 10]; array.sort((a,b) => ab); // 출력(6) [1, 5, 10, 25, 40, 100] array.sort((a,b) => ba); // 출력 (6) [100, 40, 25, 10, 5, 1]
const objectArr = [
{ 이름: 'Lazslo', 성: 'Jamf' },
{ 이름: '돼지', 성: '보딘' },
{ 이름: '해적', 성: '프렌티스' }
];
objectArr.sort((a, b) => a.last_name.localeCompare(b.last_name));
// 출력(3) [{...}, {...}, {...}]
0: {이름: "돼지", 성: "보디네"}
1: {이름: "Lazslo", 성: "Jamf"}
2: {first_name: "해적", 성: "Prentice"}
length: 3 0 , undefined , null , false , "" , '' 와 같은 거짓 값은
const array = [3, 0, 6, 7, ''로 쉽게 생략할 수 있습니다.
, 거짓]; array.filter(Boolean); // 출력 (3) [3, 6, 7]
중첩된 if...else를 줄이거나 대소문자를 전환하려면 기본 논리 연산자 AND/OR 사용하면 됩니다.
함수 doSomething(arg1){
인수1 = 인수1 || 10;
// 아직 설정하지 않은 경우 arg1을 기본값으로 10으로 설정합니다. return arg1;
}
foo = 10으로 놔두세요;
foo === 10 && doSomething();
// if (foo == 10) then doSomething();과 같습니다.
// 출력: 10
foo === 5 || doSomething();
// if (foo != 5) then doSomething(); 과 같습니다.
// 출력: 10 첫 번째로 발견된 인덱스를 반환하는 for 루프 또는 Out/remove를 찾기 위해 배열에서 부울 true/false를 반환하는 최신 includes() 와 함께 indexOf() 사용했을 수 있습니다. 중복. 여기에는 두 가지 더 빠른 방법이 있습니다.
const 배열 = [5,4,7,8,9,2,7,5]; array.filter((item,idx,arr) => arr.indexOf(item) === idx); // 또는 const nonUnique = [...new Set(배열)]; // 출력: [5, 4, 7, 8, 9, 2]
대부분의 경우 변수를 키로 추적하는 카운터 객체 또는 맵을 생성하여 문제를 해결해야 합니다. 빈도/발생을 값으로 추적합니다.
문자열 = '카필라리팍';
const 테이블={};
for(문자열의 문자를 보내세요) {
테이블[char]=테이블[char]+1 || 1;
}
// 출력 {k: 2, a: 3, p: 2, i: 2, l: 2} 및
const countMap = new Map();
for (let i = 0; i < string.length; i++) {
if (countMap.has(string[i])) {
countMap.set(string[i], countMap.get(string[i]) + 1);
} 또 다른 {
countMap.set(string[i], 1);
}
}
// 출력 맵(5) {"k" => 2, "a" => 3, "p" => 2, "i" => 2, "l" => 2} 삼항 연산자 if…elseif…elseif를 사용하면 중첩된 조건문을 피할 수 있습니다
함수 발열(온도) {
반환 온도 > 97 ? '의사를 방문하세요!'
: temp < 97 ? '나가서 놀자!!'
: temp === 97 ? '좀 쉬세요!';
}
// Fever(97) 출력: "푹 쉬세요!"
Fever(100): "Visit Doctor!" 9. for 루프는 for for..infor..in 숫자가 아닌 숫자도 허용하므로 사용하지 마세요.forEach , for...of 요소를 직접 가져옵니다.forEach 도 색인을 제공할 수 있지만 for...of 제공할 수 없습니다.for 및 for...of 배열의 구멍을 고려하지만 다른 2개는 고려하지 않습니다.일반적으로 일상 작업에서는 여러 개체를 병합해야 합니다.
const 사용자 = {
이름: '카필 라구완시',
성별: '남성'
};
const 대학 = {
초등학교: '마니 초등학교',
보조: '라스 중등학교'
};
const 스킬 = {
프로그래밍: '극단',
수영: '평균',
자고 : '프로'
};
const summary = {...사용자, ...대학, ...기술};
// 출력 성별: "남성"
이름: "카필 라구완시"
기본: "마니 초등학교"
프로그래밍: "극단"
보조: "라스 중등학교"
자고 : "프로"
Swimming: "Average" 화살표 함수 표현식은 전통적인 함수 표현식에 대한 간단한 대안이지만 제한 사항이 있으며 모든 상황에서 사용할 수는 없습니다. 어휘 범위(상위 범위)가 있고 자체 범위가 없으므로 this arguments 정의된 환경을 참조합니다.
const 사람 = {
이름: '카필',
이름() {
this.name을 반환합니다.
}
}
person.sayName();
// "Kapil"을 출력 하지만
const person = {
이름: '카필',
이름 말하기 : () => {
this.name을 반환합니다.
}
}
person.sayName();
// 출력 "" 연결 선택적 연결?. 값이 ? 앞에 오면 평가를 중지합니다. 정의되지 않았거나 null이며
정의되지 않음을 반환합니다.
const 사용자 = {
직원: {
이름: "카필"
}
};
사용자.직원?.이름;
// 출력: "카필"
사용자.고용?.이름;
// 출력: 정의되지 않음
사용자.고용자.이름
// 출력: VM21616:1 Uncaught TypeError: 정의되지 않은 의 'name' 속성을 읽을 수 없습니다.
내장 Math.random() 메서드를 사용하여 배열을 스크램블합니다.
const 목록 = [1, 2, 3, 4, 5, 6, 7, 8, 9];
list.sort(() => {
Math.random() - 0.5를 반환합니다.
});
// 출력(9) [2, 5, 1, 6, 9, 8, 4, 3, 7]
// 다시 호출
(9) [4, 1, 7, 5, 3, 8, 2, 9, 6] Null 병합 연산자(??)는 논리 연산자로, 왼쪽 피연산자가 비어 있거나 정의되지 않은 경우 해당 연산자를 반환합니다. 오른쪽 피연산자, 그렇지 않으면 왼쪽 피연산자를 반환합니다.
const foo = null ?? '우리 학교'; // 출력: "내 학교" const baz = 0 ?? 42; // 출력: 0
이 신비한 3개 점은 ... 쉬거나 퍼질 수 있습니다! ?
함수 myFun(a, b, ...manyMoreArgs) {
인수.길이를 반환합니다.
}
myFun("하나", "둘", "셋", "넷", "다섯", "여섯");
// 출력: 6 및
const parts = ['어깨', '무릎']; const 가사 = ['머리', ...부분, '그리고', '발가락']; 가사; //산출: (5) ["머리", "어깨", "무릎", "및", "발가락"]
const search = (arr, low=0,high=arr.length-1) => {
하이 리턴;
}
검색([1,2,3,4,5]);
// 출력: 4 문제를 해결하는 동안 .toPrecision() 또는 .toFixed() 와 같은 내장 메서드를 사용하여 많은 도우미 함수를 구현할 수 있습니다.
const 숫자 = 10; num.toString(2); // 출력: "1010" num.toString(16); // 출력: "a" num.toString(8); // 출력: "12"
let a = 5; b = 8이라고 하자; [a,b] = [b,a] [a,b] // Output(2) [8, 5]
글쎄요, 이것은 완전한 속기 팁은 아니지만 문자열을 어떻게 사용하는지에 대한 좋은 아이디어를 줄 것입니다.
함수 checkPalindrome(str) {
return str == str.split('').reverse().join('');
}
checkPalindrome('나만');
// 출력: true 20. Object.entries(), Object.keys() 및 Object.values()를 사용하여
const obj = { a: 1, b: 2, c: 3 };
Object.entries(obj);
// 출력(3) [배열(2), 배열(2), 배열(2)]
0: (2) ["a", 1]
1: (2) ["b", 2]
2: (2) ["c", 3]
길이: 3
Object.keys(obj);
(3) ["a", "b", "c"]
Object.values(obj);
(3) [1, 2, 3]