Pelajari pembolehubah global javascript dengan kemahiran me_javascript

1. Gunakan objek global sesedikit mungkin

Masalah dengan pembolehubah global ialah semua kod dalam aplikasi JavaScript dan halaman web anda berkongsi pembolehubah global ini, mereka hidup dalam ruang nama global yang sama, jadi apabila dua bahagian program yang berbeza mentakrifkan nama yang sama tetapi mempunyai fungsi yang berbeza Apabila menggunakan. pembolehubah global, konflik penamaan tidak dapat dielakkan.

Lazimnya halaman web mengandungi kod yang tidak ditulis oleh pembangun halaman, contohnya:

• Pustaka JavaScript pihak ketiga
• Kod skrip pengiklan
• Kod skrip penjejakan dan analisis pengguna pihak ketiga
• Berbagai jenis widget, bendera dan butang

Sebagai contoh, skrip pihak ketiga mentakrifkan pembolehubah global yang dipanggil hasil kemudian, juga mentakrifkan pembolehubah global bernama hasil dalam fungsi anda. Hasilnya ialah pembolehubah terkemudian menimpa yang sebelumnya, dan skrip pihak ketiga tiba-tiba sendawa!

Kerana jika anda secara tidak sengaja mengubah suai pembolehubah global di suatu tempat dalam kod, ia akan menyebabkan ralat dalam modul lain yang bergantung pada pembolehubah global. Selain itu, punca ralat sukar untuk dinyahpepijat dan dicari.

Selain itu, objek tetingkap mesti digunakan untuk menjalankan halaman web, dan enjin penyemak imbas perlu melintasi sifat tetingkap sekali lagi, menyebabkan prestasi berkurangan.

• Pembolehubah global ialah pautan antara modul yang berbeza hanya boleh mengakses fungsi yang disediakan oleh satu sama lain melalui pembolehubah global
• Jangan gunakan pembolehubah global apabila anda boleh menggunakan pembolehubah tempatan

var i,n,sum//globals
function averageScore(players){
 sum =0;
 for(i = 1, i = player.length; i<n; i++){
  sum += score(players[i]);
 }
 return sum/n;
}

Pastikan pembolehubah ini setempat dan gunakannya sebagai sebahagian daripada kod yang perlu menggunakannya.

function averageScore(players){
var i,n,sum;
 sum =0;
 for(i = 1, i = player.length; i<n; i++){
  sum += score(players[i]);
 }
 return sum/n;
}

Dalam penyemak imbas, kata kunci ini akan menghala ke objek tetingkap global
Ruang nama global JavaScript juga didedahkan sebagai objek global yang boleh diakses dalam skop global program, yang berfungsi sebagai nilai awal kata kunci ini. Dalam pelayar web, objek global terikat pada pembolehubah tetingkap global. Menambah atau mengubah suai pembolehubah global secara automatik mengemas kini objek global.

this.foo; //undefined
foo ="global foo"; //"global foo"
this.foo; //"global foo"

Begitu juga, mengemas kini objek global akan mengemas kini ruang nama global secara automatik:

var foo ="global foo";
this.foo; //"global foo"
this.foo ="changed";
foo; //"changed"

Dua cara untuk menukar objek global, mengisytiharkannya melalui kata kunci var dan menetapkan atribut pada objek global (melalui kata kunci ini)

Gunakan objek global untuk melakukan pengesanan ciri (Pengesanan Ciri) untuk persekitaran berjalan semasa Contohnya, ES5 menyediakan objek JSON untuk mengendalikan data JSON, kemudian anda boleh menggunakan if (this.JSON) untuk menentukan sama ada persekitaran berjalan semasa. menyokong JSON

if(!this.JSON){
 this.JSON ={
  parse:...,
  stringify:...
 }
}

2. Bagaimana untuk mengelakkan pembolehubah global

Kaedah 1: Cipta hanya satu pembolehubah global.

MYAPP.stooge = {
 "first-name": "Joe",
 "last-name": "Howard"
};

MYAPP.flight = {
 airline: "Oceanic",
 number: 815,
 departure: {
  IATA: "SYD",
  time: "2004-09-22 14:55",
  city: "Sydney"
 },
 arrival: {
  IATA: "LAX",
  time: "2004-09-23 10:42",
  city: "Los Angeles"
 }
};

Kaedah 2: Gunakan mod modul

var serial_maker = function ( ) {

// Produce an object that produces unique strings. A
// unique string is made up of two parts: a prefix
// and a sequence number. The object comes with
// methods for setting the prefix and sequence
// number, and a gensym method that produces unique
// strings.

 var prefix = '';
 var seq = 0;
 return {
  set_prefix: function (p) {
   prefix = String(p);
  },
  set_seq: function (s) {
   seq = s;
  },
  gensym: function ( ) {
   var result = prefix + seq;
   seq += 1;
   return result;
  }
 };
}( );

var seqer = serial_maker( );
seqer.set_prefix = 'Q';
seqer.set_seq = 1000;
var unique = seqer.gensym( ); // unique is "Q1000"

Mod modul yang dipanggil ialah untuk mencipta fungsi, yang merangkumi pembolehubah persendirian dan objek istimewa Kandungan objek istimewa ialah pembolehubah persendirian boleh diakses menggunakan fungsi penutupan, dan akhirnya mengembalikan objek istimewa.

Pertama sekali, kaedah dua bukan sahaja boleh digunakan sebagai pembolehubah global, tetapi juga boleh digunakan untuk mengisytiharkan pembolehubah global secara tempatan. Kerana walaupun anda mengubah suai seqer di tempat yang tidak diketahui, ralat akan dilaporkan serta-merta kerana ia adalah objek, bukan rentetan.

Kaedah 3: Sifar pembolehubah global

Sifar pembolehubah global sebenarnya adalah kaedah pemprosesan pembolehubah tempatan yang diterima pakai untuk menyesuaikan diri dengan bahagian kecil kod tertutup dan hanya sesuai untuk digunakan dalam beberapa senario khas. Yang paling biasa ialah skrip bebas sepenuhnya yang tidak boleh diakses oleh skrip lain.
Untuk menggunakan pembolehubah global sifar, anda perlu menggunakan fungsi pelaksanaan segera Penggunaannya adalah seperti berikut.

( function ( win ) {

 'use strict' ;
 var doc = win.document ;
 //在此定义其他的变量并书写代码
} )

3. Pembolehubah global yang tidak dijangka

Disebabkan oleh dua ciri JavaScript, adalah sangat mudah untuk mencipta pembolehubah global secara tidak sedar. Pertama, anda boleh menggunakan pembolehubah tanpa mengisytiharkannya; kedua, JavaScript mempunyai konsep global tersirat, yang bermaksud bahawa sebarang pembolehubah yang anda tidak isytiharkan menjadi harta objek global. Rujuk kod di bawah:

function sum(x, y) {
 // 不推荐写法: 隐式全局变量
 result = x + y;
 return result;
}

Hasil dalam kod ini tidak diisytiharkan. Kod ini masih berfungsi dengan baik, tetapi selepas memanggil fungsi tersebut, anda akan mendapat ruang nama global tambahan, yang boleh menjadi punca masalah.

Peraturan praktikal adalah untuk sentiasa menggunakan var untuk mengisytiharkan pembolehubah, seperti yang ditunjukkan oleh fungsi sum() yang dipertingkatkan:

function sum(x, y) {
 var result = x + y;
 return result;
}

Satu lagi contoh balas untuk mencipta pembolehubah global tersirat ialah menggunakan rantaian tugas untuk pengisytiharan var separa. Dalam coretan berikut, a ialah pembolehubah tempatan tetapi b ialah pembolehubah global, yang mungkin bukan yang anda mahukan:

// 反例，勿使用
function foo() {
 var a = b = 0;
 // ...
}

此现象发生的原因在于这个从右到左的赋值，首先，是赋值表达式b = 0，此情况下b是未声明的。这个表达式的返回值是0，然后这个0就分配给了通过var定义的这个局部变量a。换句话说，就好比你输入了：

var a = (b = 0);
如果你已经准备好声明变量，使用链分配是比较好的做法，不会产生任何意料之外的全局变量，如：

function foo() {
 var a, b;
 // ... a = b = 0; // 两个均局部变量
}

然而，另外一个避免全局变量的原因是可移植性。如果你想你的代码在不同的环境下（主机下）运行，使用全局变量如履薄冰，因为你会无意中覆盖你最初环境下不存在的主机对象

  总是记得通过var关键字来声明局部变量

 使用lint工具来确保没有隐式声明的全局变量

以上就是对javascript的全局变量介绍，希望对大家的学习有所帮助。