Heim > Web-Frontend > js-Tutorial > Hauptteil

Statische Objektmethoden – JavaScript-Herausforderungen

Susan Sarandon
Freigeben: 2024-11-04 03:39:01
Original
490 Leute haben es durchsucht

Object static methods - JavaScript Challenges

Sie finden den gesamten Code in diesem Beitrag im Repo Github.


Herausforderungen im Zusammenhang mit objektstatischen Methoden


Object.assign()

/**
 * @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
Nach dem Login kopieren

Object.create()

/**
 * @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"
Nach dem Login kopieren

Object.groupBy()

/**
 * @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}] }
Nach dem Login kopieren

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
Nach dem Login kopieren

Object.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 }
Nach dem Login kopieren

Referenz

  • GreatFrontEnd
  • 26. Implementieren Sie Object.assign() - BFE.dev
  • 94. Implementieren Sie Ihr eigenes Object.create - BFE.dev
  • 116. implementieren Sie Object.is() - BFE.dev
  • 177. Implementieren Sie Object.groupBy() - BFE.dev
  • Object.assign() – MDN
  • Object.create() – MDN
  • Object.fromEntries() – MDN
  • Object.groupBy() - MDN
  • Object.is() – MDN

Das obige ist der detaillierte Inhalt vonStatische Objektmethoden – JavaScript-Herausforderungen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage