Cara meneruskan daftar ke fungsi dalam javascript

Pada artikel ini, kita akan melihat bagaimana javascript melewati referensi atau nilai bekerja dan perbedaan antara kedua metode tersebut

Daftar isi

• Pengantar javascript lewat referensi dan lewat nilai
• Javascript lulus dengan referensi
• Javascript melewati nilai
• Kata-kata Perpisahan

Pengantar javascript lewat referensi dan lewat nilai

Sebelum terjun ke fungsi javascript pass by reference atau pass by value, penting untuk memahami perbedaan antara primitif dan objek

Nilai-nilai primitif

Ini adalah nilai paling dasar yang dapat dipikirkan seseorang, yang meliputi, undefined, null, boolean, string, dan angka. Nilai primitif diteruskan oleh nilai dalam javascript

Sedangkan semua objek (termasuk fungsi) dilewatkan dengan referensi dalam javascript

Mari kita pahami apa itu pass by reference dan pass by value sebelum melihat contoh

Javascript lulus dengan referensi

Dalam Pass by Reference, suatu fungsi dipanggil dengan langsung meneruskan referensi/alamat variabel sebagai argumen. Mengubah argumen di dalam fungsi memengaruhi variabel yang dikirimkan dari luar fungsi. Dalam objek dan array Javascript dilewatkan dengan referensi

//javascript pass by reference function callByReference(varObj) { console.log("Inside Call by Reference Method"); varObj.a = 100; console.log(varObj); } let varObj = { a: 1 }; console.log("Before Call by Reference Method"); console.log(varObj); callByReference(varObj) console.log("After Call by Reference Method"); console.log(varObj); }

Keluaran

Before Call by Reference Method {a: 1} Inside Call by Reference Method {a: 100} After Call by Reference Method {a: 100} _

Javascript melewati nilai

Dalam javascript pass by value, fungsi dipanggil dengan langsung meneruskan nilai variabel sebagai argumen. Oleh karena itu, bahkan mengubah argumen di dalam fungsi tidak memengaruhi variabel yang dikirimkan dari luar fungsi

Penting untuk dicatat bahwa dalam javascript, semua argumen fungsi selalu diteruskan dengan nilai. Yaitu, JavaScript menyalin nilai dari variabel yang lewat ke dalam argumen di dalam fungsi

//javascript pass by value function square(x) { x = x * x; return x; } var y = 10; var result = square(y); console.log(y); // 10 -- no change console.log(result); // 100

Penjelasan Kode

Seperti yang Anda lihat di sini, setelah kita meneruskan variabel y ke kotak fungsi, nilai y disalin ke variabel x dengan javascript (karenanya diteruskan dengan nilai)

Perhatikan bahwa meneruskan argumen fungsional dengan nilai tidak berdampak pada variabel asli itu sendiri, seperti saat Anda membuat variabel baru (y dalam kasus ini) dan menetapkannya ke nilai variabel lain (x), tempat lain di memori terpisah . Jadi, berdasarkan nilai, salin nilai variabel asli (a) ke dalam dua tempat terpisah di memori

Di sisi lain, dalam hal ini jika kita melewatkan variabel y dengan referensi, maka nilainya akan berubah menjadi 100, karena dalam referensi, fungsi mengambil variabel asli itu sendiri dan menggunakannya dalam fungsi daripada menggunakan salinan dari

Kata-kata Perpisahan

Saat membandingkan kedua fungsi, yaitu javascript pass by reference, pass by value, kita dapat melihat bahwa SEMUA objek berinteraksi dengan referensi di Javascript, jadi saat menyetel sama satu sama lain atau meneruskan ke suatu fungsi, semuanya menunjuk ke lokasi yang sama jadi saat Anda mengubah . Ini adalah perbedaan yang mencolok dibandingkan dengan nilai yang diteruskan, di mana fungsi nilai yang diteruskan menyalin nilai ke dalam dua titik terpisah dalam memori secara efektif menjadikannya entitas yang sepenuhnya terpisah meskipun satu awalnya ditetapkan sama dengan yang lain

Dalam Javascript, kita sering menyimpan data sebagai array, dan fungsi yang ingin kita panggil. Terkadang, data dalam array kita persis seperti data yang ingin kita berikan ke suatu fungsi. Untungnya, ada cara dalam Javascript untuk menggunakan array sebagai nilai masukan untuk fungsi. Mari kita lihat bagaimana menggunakan array sebagai parameter fungsi

Cara menggunakan array sebagai parameter fungsi

Ketika kita memiliki fungsi yang ingin kita berikan array, cara paling dasar untuk melakukannya adalah seperti ini

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(numbers[0], numbers[1], numbers[2]);

Tentu saja, ini bisa sangat mengganggu, terutama saat bekerja dengan fungsi yang memiliki daftar properti yang sangat panjang. Dengan demikian, Javascript memberi kita dua cara untuk menggunakan array sebagai parameter fungsi dalam Javascript - apply() dan operator spread

Melewati array ke fungsi dengan operator spread

Cara modern dan termudah untuk meneruskan array ke suatu fungsi adalah dengan menggunakan operator spread. Operator spread (..._) hanya ditambahkan sebelum array. Menggunakan contoh kami sebelumnya, tampilannya seperti ini

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); _

Kita juga bisa langsung menambahkan array ke dalam fungsi, tanpa perlu variabel. Sebagai contoh

let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...[ 1, 2, 3 ]);

Jika Anda ingin mempelajari semua yang dapat dilakukan oleh operator spread, lihat panduan saya di sini

Melewati array ke fungsi menggunakan apply()

Cara lain untuk melakukan ini, adalah dengan menggunakan apply(). Jika Anda tidak terbiasa dengan kasus penggunaan utama apply(), lihat panduan lengkap saya tentang objek Javascript ini di sini

Pada akhirnya, apply() memungkinkan kita mengambil fungsi, dan meneruskan array ke dalamnya. Atribut pertama dari apply() sebenarnya mengacu pada objek

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 0 yang ingin kita gunakan pada fungsi. Argumen kedua adalah larik dari semua parameter untuk fungsi itu. Itu berarti Anda dapat menentukan struktur

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); _0 serta meneruskan array ke fungsi itu sendiri

Ini jelas memiliki beberapa manfaat khusus jika dibandingkan dengan operator spread (...), jadi mungkin lebih cocok tergantung pada apa yang ingin Anda capai. Menggunakan contoh kami sebelumnya, kami dapat melewatkan array ke fungsi kami seperti itu

let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction.apply({}, [ 1, 2, 3 ]); _

Di sini, saya membiarkan objek

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); _0 kosong, jadi jika kita memang menggunakan

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 0 di

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 5, itu akan menjadi objek kosong - itulah argumen pertama dari apply(). Yang kedua adalah larik

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 7, mengacu pada

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 8,

let numbers = [ 1, 2, 3 ] let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...numbers); 9, dan

let myFunction = (x, y, z) => { return x + y + z; } // Returns 6 let getCalculation = myFunction(...[ 1, 2, 3 ]); 0 masing-masing

Bagaimana cara melewatkan array ke fungsi JavaScript?

Bagaimana cara menggunakan fungsi array di JavaScript?

Bagaimana saya bisa melewati banyak parameter dalam fungsi JavaScript?

Apakah ada fungsi pass di JavaScript?