> 웹 프론트엔드 > JS 튜토리얼 > 객체 정적 메소드 - JavaScript 과제

객체 정적 메소드 - JavaScript 과제

Susan Sarandon
풀어 주다: 2024-11-04 03:39:01
원래의
530명이 탐색했습니다.

Object static methods - JavaScript Challenges

이 게시물의 모든 코드는 Github 저장소에서 확인하실 수 있습니다.


객체 정적 메소드 관련 과제


객체.할당()

/**
 * @param {any} target
 * @param {any[]} sources
 * @return {object}
 */
function myObjectAssign(target, ...sources) {
  if (target == null) {
    throw Error();
  }

  target = Object(target);

  function merge(keys = [], currSource) {
    for (const key of keys) {
      target[key] = currSource[key];

      if (target[key] !== currSource[key]) {
        throw Error();
      }
    }
  }

  for (const source of sources) {
    if (source == null) {
      continue;
    }

    merge(Object.keys(source), source);
    merge(Object.getOwnPropertySymbols(source), source);
  }

  return target;
}

// Usage example
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);

console.log(target); // => Object { a: 1, b: 4, c: 5 }
console.log(returnedTarget === target); // => true
로그인 후 복사

객체.생성()

/**
 * @param {any} proto
 * @return {object}
 */
function myObjectCreate(proto) {
  function MyConstructor() {}

  MyConstructor.prototype = proto.prototype ?? proto;

  return new MyConstructor();
}

// Usage example
const person = {
  isHuman: false,
  printIntroduction: function () {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  },
};
const me = myObjectCreate(person);
me.name = "Matthew"; // => "name" is a property set on "me", but not on "person"
me.isHuman = true; // Inherited properties can be overwritten
me.printIntroduction(); // => "My name is Matthew. Am I human? true"
로그인 후 복사

객체.그룹별()

/**
 * @param {Array} arr
 * @param {Function} iteratee
 * @return {Array}
 */

function groupBy(arr, iteratee) {
  const result = {};
  const iterateeFn =
    typeof iteratee === "function" ? iteratee : (value) => value[iteratee];

  for (const item of arr) {
    const key = iterateeFn(item);

    if (!Object.hasOwn(result, key)) {
      result[key] = [];
    }
    result[key].push(item);
  }

  return result;
}

// Usage example
console.log(groupBy([6.1, 4.2, 6.3], Math.floor)); // => { '4': [4.2], '6': [6.1, 6.3] }

// Group by string length
console.log(groupBy(["one", "two", "three"], "length"));
// => { '3': ['one', 'two'], '5': ['three'] }

const users = [
  { user: "barney", age: 36 },
  { user: "fred", age: 40 },
];

// Group by a property of the objects
console.log(groupBy(users, "age"));
// => { '36': [{'user': 'barney', 'age': 36}], '40': [{'user': 'fred', 'age': 40}] }
로그인 후 복사

Object.is()

/**
 * @param {any} op1
 * @param {any} op2
 * @return {boolean}
 */

function myObjectIs(op1, op2) {
  if (op1 === op2) {
    return a !== 0 || 1 / a === 1 / b;
  } else {
    return a !== a && b !== b;
  }
}

// Usage example
Object.is(+0, -0); // false
Object.is(NaN, NaN); // true
로그인 후 복사

객체.fromEntries()

/**
 * Creates an object from an array of key-value pairs.
 *
 * @param {Array} pairs - An array of key-value pairs.
 * @returns {Object} - The object composed from the key-value pairs.
 */

// One-line solution
function fromPairs(pairs) {
  return Object.fromEntries(pairs);
}

// Iterative solution
function fromPairs(pairs) {
  const result = {};

  for (const [key, value] of pairs) {
    result[key] = value;
  }

  return result;
}

// Usage example
const pairs = [
  ["a", 1],
  ["b", 2],
  ["c", 3],
];

console.log(fromPairs(pairs)); // => { a: 1, b: 2, c: 3 }
로그인 후 복사

참조

  • 그레이트프론트엔드
  • 26. Object.Assign() 구현 - BFE.dev
  • 94. 자신만의 Object.create 구현 - BFE.dev
  • 116. Object.is() 구현 - BFE.dev
  • 177. Object.groupBy() 구현 - BFE.dev
  • 객체.할당() - MDN
  • Object.create() - MDN
  • Object.fromEntries() - MDN
  • Object.groupBy() - MDN
  • Object.is() - MDN

위 내용은 객체 정적 메소드 - JavaScript 과제의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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