Maison interface Web js tutoriel Portée et portée au niveau du bloc en Javascript

Portée et portée au niveau du bloc en Javascript

Dec 09, 2017 am 09:01 AM
javascript js 作用域

Dans cet article, nous vous présenterons la portée et la portée au niveau du bloc en Javascript. La portée est toujours la priorité absolue dans tout langage de programmation, car elle contrôle la visibilité et le cycle de vie des variables et des paramètres. Permettez-moi de vous présenter la portée et la portée au niveau du bloc en Javascript. Les amis qui en ont besoin peuvent s'y référer.

1. Description de la portée au niveau du bloc

Avant d'apprendre la portée des variables JavaScript, nous devons clarifier quelques points :

a. La portée variable de JavaScript est basée sur sa chaîne de portée unique.

b. JavaScript n'a pas de portée au niveau du bloc.

c. Les variables déclarées dans la fonction sont définies tout au long de la fonction.

La portée variable de javascript est différente du langage de type C couramment utilisé, comme le code en C# :

static void Main(string[] args)
{
   if(true)
   {
    int number=10;
   }
  Console.WriteLine(number);
}
Copier après la connexion

Ce paragraphe Le code ne peut pas être compilé car "le nombre n'existe pas dans le contexte actuel".

Parce que la portée de la variable ici est limitée par des accolades, elle est appelée portée au niveau du bloc.

Dans la portée au niveau du bloc, toutes les variables se trouvent entre les accolades de la définition. Elles peuvent être utilisées dans la plage allant du début de la définition à la fin des accolades. Elles sont inaccessibles en dehors de celle-ci. range, c'est-à-dire

if(true)
{
  int number=10;
  Console.WriteLine(number);
}
Copier après la connexion

Ceci est accessible car la définition et l'utilisation de la variable sont entre les mêmes accolades.

Mais il n'y a pas de concept de portée au niveau du bloc en JavaScript.

2. Portée en javascript

1. Portée des variables limitée par la fonction

En javascript, à l'intérieur de la fonction Les variables définies est accessible à l'intérieur de la fonction, mais n'est pas accessible en dehors de la fonction Code :

<script type="text/javascript">
  var num=function()
  {
   var number=10;
  };
  try{
    alert(number);
  }catch(e)
  {
    alert(e);
  } 
</script>
Copier après la connexion

Lorsque le code est exécuté, une exception, un numéro de variable est. non défini car les variables définies dans une fonction ne peuvent pas être utilisées en dehors de la fonction. Elles peuvent être utilisées arbitrairement au sein de la fonction, même avant l'affectation :

<script type="text/javascript">
 var num=function(){
    alert(number);
    var number=10;
    alert(number);
 };
 try{
   num();
 }catch(e){
  alert(e);
 }
</script>
Copier après la connexion

Après. ce code est exécuté, aucune erreur ne sera générée. Il apparaîtra deux fois, à savoir undefined et 10

2. Le sous-domaine accède au domaine parent

Une fonction peut limiter la portée d'une variable, alors la fonction dans la fonction est un sous-domaine de la portée. Le code du sous-domaine peut accéder aux variables du domaine parent :

<. 🎜>
<script type="text/javascript">
 var func=function(){
    var number=10;
    var sub_func=function(){
      alert(num);
    };
   sub_func();
};
func();
</script>
Copier après la connexion

Le résultat de l'exécution de ce code est 10, mais l'accès au code du domaine parent dans le sous-domaine est également conditionnel

<script type="text/javascript">
 var func=function(){
    var number=10;
    var sub_func=function(){
      var num=20;
      alert(num);
    };
   sub_func();
};
func();
</script>
Copier après la connexion

Ce code a un "var num=20;" de plus que le précédent Ce code est dans le sous-domaine, donc la situation du sous-domaine accédant au domaine parent a changé. 20. À l'heure actuelle, le numéro auquel accède le sous-domaine est une variable du sous-domaine et non du domaine parent. On peut voir qu'il existe certaines règles d'accès lors de l'utilisation de variables en JavaScript, l'interpréteur JavaScript recherche d'abord la définition de la variable dans la portée actuelle. Si c'est le cas, utilisez cette variable. Sinon, recherchez la variable dans la portée actuelle. domaine parent. , et ainsi de suite, jusqu'à ce que la portée de niveau supérieur soit toujours introuvable, une exception « la variable n'est pas définie » sera levée. Le code est le suivant :

<. 🎜>
<script type="text/javascript">
 (function (){
   var num=10;
   (function (){
     var num=20;
     (function(){
     alert(num);
      })();
   })();
  })();
</script>
Copier après la connexion

Ce code Après l'exécution, 20 est imprimé. Si "

" est supprimé, alors 10 est imprimé. De plus, si "

" est supprimé, une erreur non définie se produira. var num=20var num=10

Ce qui suit est une introduction à la portée JS et à la portée au niveau du blocLa portée est toujours la chose la plus importante dans tout langage de programmation Heavy. car il contrôle la visibilité et le cycle de vie des variables et des paramètres. En parlant de cela, comprenez d’abord deux concepts : la portée au niveau du bloc et la portée de la fonction.


Qu'est-ce que la portée au niveau du bloc ? Tout ensemble d'instructions entre accolades ({ et }) appartient à un bloc. Toutes les variables qui y sont définies sont invisibles en dehors du bloc de code.


La portée de la fonction est facile à comprendre (*^__^* Les paramètres et variables définis dans la fonction ne sont pas visibles en dehors de la fonction).


La plupart des langages de type C ont une portée au niveau des blocs, mais pas JS. Veuillez consulter la démo ci-dessous :


//C语言 
#include <stdio.h> 
void main() 
{ 
  int i=2; 
  i--; 
  if(i) 
  { 
    int j=3; 
  } 
  printf("%d/n",j); 
}
Copier après la connexion

Lorsque vous exécutez ce code, l'erreur "utiliser une variable non définie :j" apparaîtra. Comme vous pouvez le voir, le langage C a une portée au niveau du bloc car j est défini dans le bloc d'instruction if, il est donc inaccessible en dehors du bloc.


Comment se comporte JS ? Regardons une autre démo :

functin test(){ 
 for(var i=0;i<3;i++){   
 } 
 alert(i); 
} 
test();
Copier après la connexion

Exécutez ce code et une fenêtre contextuelle apparaîtra. apparaît "3", on voit qu'en dehors du bloc, la variable que j'ai définie dans le bloc est toujours accessible. En d'autres termes, JS ne prend pas en charge la portée au niveau du bloc, il prend uniquement en charge la portée de la fonction et les variables définies n'importe où dans une fonction sont visibles n'importe où dans la fonction.

那么我们该如何使JS拥有块级作用域呢?是否还记得,在一个函数中定义的变量,当这个函数调用完后,变量会被销毁,我们是否可以用这个特性来模拟出JS的块级作用域呢?看下面这个DEMO:

  function test(){ 
 (function (){ 
 for(var i=0;i<4;i++){ 
 } 
 })(); 
 alert(i); 
} 
test();
Copier après la connexion


这时候再次运行,会弹出"i"未定义的错误,哈哈,实现了吧~~~这里,我们把for语句块放到了一个闭包之中,然后调用这个函数,当函数调用完毕,变量i自动销毁,因此,我们在块外便无法访问了。

JS的闭包特性is the most important feature((*^__^*) 大家懂的)。在JS中,为了防止命名冲突,我们应该尽量避免使用全局变量和全局函数。那么,该如何避免呢?不错,正如上文demo所示,我们可以把要定义的所有内容放入到一个

(function (){ 
//内容 
})();
Copier après la connexion

相关推荐:

详解JavaScript作用域和闭包

js的解析顺序作用域严格模式的解析

JavaScript作用域与闭包的分析讲解

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Commandes de chat et comment les utiliser
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Utilisation de la structure typedef en langage C Utilisation de la structure typedef en langage C May 09, 2024 am 10:15 AM

typedef struct est utilisé en langage C pour créer des alias de type de structure afin de simplifier l'utilisation des structures. Il crée un alias pour un nouveau type de données sur une structure existante en spécifiant l'alias de la structure. Les avantages incluent une lisibilité améliorée, la réutilisation du code et la vérification du type. Remarque : La structure doit être définie avant d'utiliser un alias. L'alias doit être unique dans le programme et valide uniquement dans le périmètre dans lequel il est déclaré.

Comment résoudre la variable attendue en Java Comment résoudre la variable attendue en Java May 07, 2024 am 02:48 AM

Les exceptions de valeur attendue des variables en Java peuvent être résolues en : initialisant les variables ; en utilisant des valeurs par défaut ; en utilisant des contrôles et des affectations et en connaissant la portée des variables locales ;

Avantages et inconvénients des fermetures en js Avantages et inconvénients des fermetures en js May 10, 2024 am 04:39 AM

Les avantages des fermetures JavaScript incluent le maintien d'une portée variable, l'activation du code modulaire, l'exécution différée et la gestion des événements ; les inconvénients incluent les fuites de mémoire, la complexité accrue, la surcharge de performances et les effets de chaîne de portée.

Que signifie inclure en C++ Que signifie inclure en C++ May 09, 2024 am 01:45 AM

La directive de préprocesseur #include en C++ insère le contenu d'un fichier source externe dans le fichier source actuel, en copiant son contenu à l'emplacement correspondant dans le fichier source actuel. Principalement utilisé pour inclure des fichiers d'en-tête contenant les déclarations nécessaires dans le code, telles que #include <iostream> pour inclure des fonctions d'entrée/sortie standard.

Pointeurs intelligents C++ : une analyse complète de leur cycle de vie Pointeurs intelligents C++ : une analyse complète de leur cycle de vie May 09, 2024 am 11:06 AM

Cycle de vie des pointeurs intelligents C++ : Création : Les pointeurs intelligents sont créés lors de l'allocation de mémoire. Transfert de propriété : Transférer la propriété via une opération de déménagement. Libération : la mémoire est libérée lorsqu'un pointeur intelligent sort de la portée ou est explicitement libéré. Destruction d'objet : lorsque l'objet pointé est détruit, le pointeur intelligent devient un pointeur invalide.

Les définitions de fonctions et les appels en C++ peuvent-ils être imbriqués ? Les définitions de fonctions et les appels en C++ peuvent-ils être imbriqués ? May 06, 2024 pm 06:36 PM

Peut. C++ autorise les définitions et les appels de fonctions imbriquées. Les fonctions externes peuvent définir des fonctions intégrées et les fonctions internes peuvent être appelées directement dans la portée. Les fonctions imbriquées améliorent l'encapsulation, la réutilisabilité et le contrôle de la portée. Cependant, les fonctions internes ne peuvent pas accéder directement aux variables locales des fonctions externes et le type de valeur de retour doit être cohérent avec la déclaration de la fonction externe. Les fonctions internes ne peuvent pas être auto-récursives.

Il existe plusieurs situations dans lesquelles cela indique en js Il existe plusieurs situations dans lesquelles cela indique en js May 06, 2024 pm 02:03 PM

En JavaScript, les types de pointage de this incluent : 1. Objet global ; 2. Appel de fonction ; 3. Appel de constructeur 4. Gestionnaire d'événements 5. Fonction de flèche (héritant de this). De plus, vous pouvez définir explicitement ce que cela désigne à l'aide des méthodes bind(), call() et apply().

La différence entre let et var en vue La différence entre let et var en vue May 08, 2024 pm 04:21 PM

Dans Vue, il existe une différence de portée lors de la déclaration de variables entre let et var : Scope : var a une portée globale et let a une portée au niveau du bloc. Portée au niveau du bloc : var ne crée pas de portée au niveau du bloc, let crée une portée au niveau du bloc. Redéclaration : var permet de redéclarer les variables dans la même portée, ce qui n'est pas le cas.

See all articles