Rumah  >  Artikel  >  hujung hadapan web  >  JavaScript: Parameter Lalai, Operator Spread, Parameter Rehat dan Pemusnahan!

JavaScript: Parameter Lalai, Operator Spread, Parameter Rehat dan Pemusnahan!

WBOY
WBOYasal
2024-08-09 09:21:51296semak imbas

JavaScript: Default Parameters, Spread Operator, Rest Parameters, and Destructuring!

Param Lalai

Kami boleh menambah nilai lalai terus dalam senarai parameter kami

function rollDie(numSides = 6) {
  return Math.floor(Math.random() * numSides) + 1;
}

Di sini, kita perlu berhati-hati untuk pesanan. Parameter lalai seharusnya hanya berlaku pada penghujung selepas mana-mana parameter yang tidak mempunyai lalai:

function greet(person, msg = 'Hey there', punc = '!') {
  return `${msgs}, ${person}${punc}`;
}

Sebar

Sintaks Spread membenarkan lelaran seperti tatasusunan untuk dikembangkan di tempat di mana sifar atau lebih argumen (untuk panggilan fungsi) atau elemen (untuk literal tatasusunan) dijangka, atau ungkapan objek untuk dikembangkan di tempat di mana sifar atau lebih banyak pasangan nilai kunci (untuk literal objek) dijangka. - MDN

Kami boleh menggunakan operator spread pada tatasusunan:

console.log(Math.max(1, 2, 3, 4, 5, 2)); // 5
const nums = [4, 3, 53, 3, 5, 2, 4, 920, 3, 5, 2];
console.log(Math.max(...nums)); // 920

Kita boleh menggunakan operator spread untuk menyusun tatasusunan:

const cats = ['Fluffy', 'Zane', 'Jim'];
const dogs = ['Doggo', 'Sir Barks A Lot'];
const allPets = [...cats, ...dogs, 'Goldy'];
console.log(allPets); //['Fluffy', 'Zane', 'Jim', 'Doggo', 'Sir Barks A Lot', 'Goldy']

Kita boleh menggunakan spread untuk menyalin sifat dari satu objek ke objek lain:

const feline = {
  legs: 4,
  family: 'Felidae',
};
const canine = {
  family: 'Canine',
  furry: true,
};

const dog = { ...canine, isPet: true };
console.log(dog); // {family: 'Canine', furry: true, isPet: true}

// Note, order matters - the last property takes precidence:
const catDog = { ...feline, ...canine };
console.log(catDog); // {legs: 4, family: 'Canine', furry: true}

Sebarkan pada tatasusunan dan rentetan menggunakan indeks sebagai nilai utama:

let newObj = { ...[2, 4, 6, 8] };
console.log(newObj); // {0: 2, 1: 4, 2: 6, 3: 8}

let anotherObj = { ...'Hello' };
console.log(anotherObj); //{0: 'H', 1: 'e', 2: 'l', 3: 'l', 4: 'o'}

Contoh penggunaan spread yang lebih nyata ialah jika kita ingin menambahkan data pada borang:

const dataFromForm = {
  email: 'jim@jimelm.com',
  password: '1234',
  username: 'jimelm',
};

const person = { ...dataFromForm, id: 2134, isAdmin: false };
console.log(person); // {email: 'jim@jimelm.com', password: '1234', username: 'jimelm', id: 2134, isAdmin: false}

Rehat Params

Rehat adalah bertentangan dengan penyebaran. Ia memerlukan sekumpulan parameter yang dihantar ke dalam fungsi dan menggabungkannya ke dalam tatasusunan. Beberapa contoh termasuk:

function sum(...nums) {
  return nums.reduce((total, el) => total + el);
}

function raceResults(gold, silver, ...everyoneElse) {
  console.log(`Gold metal goes to ${gold}`);
  console.log(`Silver metal goes to ${silver}`);
  console.log(`And thanks to: ${everyoneElse}`);
}

Memusnahkan

Memusnahkan Tatasusunan

Berikut ialah contoh memusnahkan tatasusunan:

const scores = [999, 888, 777, 666, 555, 444];

const [gold, silver, bronze, ...otherScores] = scores;
console.log(gold); // 999
console.log(silver); // 888
console.log(bronze); // 777
console.log(otherScores); // [666, 555, 444]

Memusnahkan Objek

Di sini kita akan memusnahkan objek:

const user = {
  email: 'marryelm@what.com',
  password: '134jsdf',
  firstName: 'Marry',
  lastName: 'Elm',
  born: 1927,
  died: 2091,
  city: 'Hayward',
  state: 'CA',
};

const { email, state, city } = user;
console.log(email); // marryelm@what.com
console.log(state); // CA
console.log(city); // Hayward

const { born: birthYear } = user;
console.log(birthYear); // 1927

Kami boleh memberikan nilai lalai pembolehubah kami seperti berikut:

const user2 = {
  email: 'stacy@what.com',
  firstName: 'stacy',
  lastName: 'kent',
  born: 1984,
  city: 'Boise',
  state: 'ID',
};

const { city, state, died } = user2;
console.log(died); // undefined

const { city, state, died = 'N/A' } = user2;
console.log(died); // N/A

Memusnahkan Parameter

Kami juga boleh memusnahkan dalam parameter fungsi:

const user2 = {
  email: 'stacy@what.com',
  firstName: 'stacy',
  lastName: 'kent',
  born: 1984,
  city: 'Boise',
  state: 'ID',
};

function fullName({ firstName, lastName = '???' }) {
  return `${firstName} ${lastName}`;
}

Kami juga mengira kemusnahan dalam fungsi panggil balik:

const movies = [
  {
    title: 'Indiana Jones',
    score: 77,
    year: 1994,
  },
  {
    title: 'Star Trek',
    score: 94,
    year: 1983,
  },
  {
    title: 'Deadpool',
    score: 79,
    year: 2001,
  },
];

let ratings = movies.map(({ title, score }) => {
  return `${title} is rated ${score}`;
});

console.log(ratings); // ['Indiana Jones is rated 77', 'Star Trek is rated 94', 'Deadpool is rated 79']

Atas ialah kandungan terperinci JavaScript: Parameter Lalai, Operator Spread, Parameter Rehat dan Pemusnahan!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn