> 웹 프론트엔드 > JS 튜토리얼 > 코드를 단순화하는 JavaScript 함수 | 자바스크립트 함수 | 자바스크립트 튜토리얼

코드를 단순화하는 JavaScript 함수 | 자바스크립트 함수 | 자바스크립트 튜토리얼

WBOY
풀어 주다: 2024-07-25 05:13:52
원래의
938명이 탐색했습니다.

JavaScript Functions to Simplify Your Code |  JavaScript Functions | JavaScript Tutorial

JavaScript는 함수형 프로그래밍 언어이며 함수가 중요한 역할을 합니다. 이를 통해 재사용 가능한 코드를 캡슐화하고 특정 작업을 수행할 수 있습니다. 다음은 귀하의 삶을 더 쉽게 만들어 줄 수 있는 몇 가지 기능의 간단한 예입니다.

정규기능

function sum(a, b) {
  return a + b;
}
로그인 후 복사

함수 표현

const sum = function (a, b) {
  return a + b;
};
로그인 후 복사

화살표 기능

const sum = (a, b) => {
  return a + b;
};
// OR
const sum = (a, b) => a + b;
로그인 후 복사

제너레이터 기능

function* indexGenerator() {
  let index = 0;
  while (true) {
    yield index++;
  }
}
const g = indexGenerator();
console.log(g.next().value); // => 0
console.log(g.next().value); // => 1
로그인 후 복사

1부터 n까지의 숫자 배열 만들기

const range = (n) => Array.from({ length: n }, (_, i) => i + 1);
console.log(range(10)); 
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
로그인 후 복사

단계별로 1부터 n까지의 숫자 배열 만들기

const range = (n, step = 1) => Array.from({ length: n }, (_, i) => i * step);
console.log(range(10, 2)); // [1, 3, 5, 7, 9]
로그인 후 복사

배열을 만들고 값으로 채우기

const fill = (len, value) => Array(len).fill(value);
console.log(fill(3, 0)); // [0, 0, 0]
로그인 후 복사

배열 섞기

const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());
console.log(shuffleArray([1, 2, 3, 4])); // [3, 2, 1, 4]
로그인 후 복사

배열에서 중복 제거

const removeDuplicated = (arr) => [...new Set(arr)];
console.log(removeDuplicated([1, 2, 3, 3, 4, 4, 5, 5, 6])); 
// Result: [ 1, 2, 3, 4, 5, 6 ]

// OR
const removeDuplicate = (arr) =>
  Object.values(arr.reduce((a, b) => (a[b] ? a : { ...a, [b]: b }), {}));
console.log(removeDuplicate([1, 2, 3, 3])); 
// Result: [ 1, 2, 3, ]
로그인 후 복사

난수 생성

const random = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
console.log(random(1, 10)); // Result: 1 ~ 10
로그인 후 복사

가장 큰 숫자 찾기

const findLargest = (arr) => arr.map((subArr) => Math.max(...subArr));
console.log(
  findLargest([
    [4, 5, 1, 3],
    [13, 27, 18, 26],
    [32, 35, 37, 39],
    [1000, 1001, 857, 1],
  ])
); // [5, 27, 39, 1001]
로그인 후 복사

가장 작은 숫자 찾기

const findSmallest = (arr) => arr.map((subArr) => Math.min(...subArr));
console.log(
  findSmallest([
    [4, 5, 1, 3],
    [13, 27, 18, 26],
    [32, 35, 37, 39],
    [1000, 1001, 857, 1],
  ])
); // [1, 18, 32, 857]
로그인 후 복사

배열에서 임의의 요소 선택

const pick = (arr) => arr[Math.floor(Math.random() * arr.length)];
console.log(pick([1, 2, 3, 4])); // 2
로그인 후 복사

배열을 객체로 변환

const toObject = (arr) => ({ ...arr });
console.log(toObject(["a", "b"])); // { 0: 'a', 1: 'b' }
로그인 후 복사

두 배열의 교차점 찾기

const intersection = (arr1, arr2) => {
  const set = new Set(arr1);
  return arr2.filter((x) => set.has(x));
};
console.log(intersection([1, 2, 3], [2, 3, 4])); // [2, 3]
로그인 후 복사

배열에서 잘못된 값 제거

const compact = (arr) => arr.filter(Boolean);
console.log(compact([0, 1, false, 2, "", 3, "a", "e" * 23, NaN, "s", 34])); // [1, 2, 3, 'a', 's', 34]
로그인 후 복사

문자열 역순

const reverseString = (str) => str.split("").reverse().join("");
console.log(reverseString("hello")); // olleh
로그인 후 복사

문자열 회문인가

const isPalindrome = (str) => str === str.split("").reverse().join("");
console.log(isPalindrome("madam")); // true
로그인 후 복사

객체가 비어 있는지 확인

const isEmpty = (obj) => Object.keys(obj).length === 0;
console.log(isEmpty({})); // true
로그인 후 복사

한 달의 일수 구하기

const getDaysInMonth = (date) =>
  new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
console.log(getDaysInMonth(new Date())); // 31
로그인 후 복사

임의의 색상 생성

const getRandomColor = () =>
  `#${Math.floor(Math.random() * 16777215).toString(16)}`;
console.log(getRandomColor()); // #f0f0f0

// OR
const randomHex = () =>
  `#${Math.floor(Math.random() * 0xffffff)
    .toString(16)
    .padEnd(6, "0")}`;
console.log(randomHex()); // #f0f0f0
로그인 후 복사

이와 같은 더 많은 기능을 보려면 Javascript Quick Functions GitHub 저장소를 확인하세요.

위 내용은 코드를 단순화하는 JavaScript 함수 | 자바스크립트 함수 | 자바스크립트 튜토리얼의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿