Dapatkah fungsi dalam mengakses javascript variabel luar?

JavaScript memungkinkan pengembang untuk mendefinisikan fungsi di dalam fungsi lain, sebuah teknik yang dikenal sebagai fungsi bersarang. Fungsi bersarang dapat berguna dalam berbagai situasi, termasuk mengatur kode ke dalam blok logis, meningkatkan keterbacaan fungsi besar, dan membuat metode pribadi yang hanya dapat diakses di dalam fungsi yang memuatnya.

Pada artikel ini, kita akan menjelajahi dasar-dasar fungsi bersarang di JavaScript, termasuk sintaksnya, perbedaannya dari fungsi tradisional, dan cara menggunakannya secara efektif dalam kode Anda

Menggunakan fungsi bersarang di JavaScript

Dalam JavaScript, suatu fungsi dapat didefinisikan di dalam fungsi lain. Fungsi seperti itu disebut fungsi bersarang atau fungsi dalam. Fungsi bersarang memiliki akses ke variabel dan parameter fungsi luar, serta ke variabel dan fungsi global. Mereka dapat digunakan untuk mengatur dan menyusun kode Anda, dan untuk menghindari konflik penamaan

Fungsi orang tua dan anak

Kita dapat memiliki fungsi bersarang di mana kita memiliki fungsi induk - fungsi luar - dan fungsi anak - fungsi dalam - di mana fungsi Berikut adalah contoh fungsi bersarang di JavaScript di mana kita menambahkan satu ke argumen fungsi luar dan

function outerFunction(x) {
    let y = x + 1;

    function innerFunction(z) {
        let w = z + y;
        return w;
    }

    return innerFunction;
}

let result = outerFunction(1)(2);
console.log(result);

Keluaran

4

Dalam contoh ini, fungsi luar outerFunction() mengambil argumen tunggal x dan mendefinisikan variabel lokal y. Fungsi luar juga mendefinisikan fungsi dalam

4

4

4

4

Fungsi luar mengembalikan fungsi dalam sebagai hasilnya. Ini berarti bahwa fungsi dalam adalah penutupan, yaitu fungsi yang mempertahankan akses ke variabel dan parameter fungsi luar bahkan setelah fungsi luar menyelesaikan eksekusinya.

BACA JUGA. Telusuri di Objek JSON Secara Rekursif di JavaScript [SOLVED]

Untuk memanggil fungsi dalam, Anda perlu memanggil fungsi luar terlebih dahulu, lalu memanggil fungsi dalam sebagai properti dari hasil fungsi luar. Ini dikenal sebagai metode chaining

Iklan

Pada contoh di atas, kita memanggil fungsi luar dengan argumen

4

4

4

4

Fungsi tingkat yang sama

Kita dapat memiliki banyak fungsi dalam lingkungan JavaScript tertentu atau tingkat cakupan global, dan kita mungkin perlu memanggil salah satu fungsi tersebut di dalam fungsi lain. Untuk menggambarkan hal ini, kita dapat membuat tiga fungsi -

4

4

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

4

4

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

Keluaran

2548.0396799999994

Dalam kode ini, fungsi

4

4

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

BACA JUGA. Menggunakan try catch finally di Node. js [Praktik Terbaik]

Fungsi anonim batin

Pendekatan lain yang dapat kita lihat dengan fungsi bersarang di JavaScript menggunakan fungsi anonim di dalam suatu fungsi. Fungsi anonim akan berfungsi sebagai fungsi dalam di dalam fungsi luar. Untuk lebih memahami, mari kita ilustrasikan fungsi luar -

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

function outer(a) {
    return function (b) {
        return a / b;
    };
}

console.log(outer(3)(5));

Keluaran

0.6

Kode ini menunjukkan penggunaan fungsi bersarang, di mana fungsi anonim dalam didefinisikan dan dikembalikan oleh fungsi

2548.0396799999994

function add(a, b) {
    return a + b;
}

function divide(a, b) {
    return a / b;
}

function stat(a, b) {
    let adx = add(a, b);
    let dex = divide(a, b);

    return (adx * dex) ** b;
}

console.log(stat(3, 5));

Bagaimana nesting memengaruhi ruang lingkup?

Fungsi yang ditentukan di tingkat atas kode Anda memiliki cakupan global, sedangkan fungsi yang ditentukan di dalam fungsi lain memiliki cakupan lokal. Mari kita periksa contoh ini

Iklan

var migrating = true;
var fly = function(num) {
    var sound = "Flying";
    function wingFlapper() {
        console.log(sound)
    }
    for (var i = 0; i < num; i++) {
        wingFlapper();
    }
};
function quack(num) {
    var sound = "Quack";
    var quacker = function() {
        console.log(sound)
    };
    for (var i = 0; i < num; i++) {
        quacker();
    }
}
if(migrating) {
    quack(4);
    fly(4)
}

Mari visualisasikan ini sebagai gambar untuk memahami dampak ruang lingkup

Di sini semua yang didefinisikan di tingkat atas kode memiliki cakupan global. Jadi

2548.0396799999994

2548.0396799999994

2548.0396799999994

2548.0396799999994

BACA JUGA. Contoh Metode pop Array JavaScript

2548.0396799999994

2548.0396799999994

2548.0396799999994

2548.0396799999994

2548.0396799999994

2548.0396799999994

Perhatikan bahwa aturan kapan Anda bisa merujuk ke suatu fungsi adalah sama di dalam suatu fungsi seperti di tingkat atas. Artinya, dalam suatu fungsi, jika Anda menentukan fungsi bertingkat dengan

function outer(a) {
    return function (b) {
        return a / b;
    };
}

console.log(outer(3)(5));

function outer(a) {
    return function (b) {
        return a / b;
    };
}

console.log(outer(3)(5));

Ringkasan

Fungsi bersarang dapat berguna dalam beberapa situasi. Misalnya, Anda dapat menggunakannya untuk membuat fungsi utilitas yang hanya diperlukan dalam konteks tertentu. Anda juga dapat menggunakannya untuk mengenkapsulasi logika kompleks dan menyembunyikannya dari kode lainnya

Iklan

Perlu diingat bahwa fungsi bersarang dapat berdampak negatif pada kinerja kode Anda karena membuat cakupan baru dan menambahkan overhead ke pemanggilan fungsi. Anda harus menggunakannya dengan bijaksana dan hanya jika diperlukan

BACA JUGA. Hapus Elemen dari Set di JavaScript [SOLVED]

Fungsi bersarang dapat membantu Anda mengatur dan menyusun kode Anda, dan dapat memberikan cara ampuh untuk membuat penutupan dan merangkum logika kompleks

Bisakah fungsi dalam mengakses variabel luar?

Bisakah fungsi JavaScript mengakses variabel luar?

Bisakah Anda mengakses variabel di dalam fungsi JavaScript?

Bisakah Anda mengakses variabel di dalam suatu fungsi?