Maison  >  Article  >  interface Web  >  Es6 peut-il déclarer des variables en utilisant var ?

Es6 peut-il déclarer des variables en utilisant var ?

青灯夜游
青灯夜游original
2022-04-11 16:07:151815parcourir

es6 peut utiliser var pour déclarer des variables. Var est un mot-clé pour déclarer des variables. Les variables déclarées à l'aide du mot-clé var ont deux portées : la portée globale et la portée de la fonction. Puisque var prend en charge la promotion des variables, les variables globales déclarées avec var sont incluses dans l'intégralité du code de script valide. sont valables tout au long de la fonction.

Es6 peut-il déclarer des variables en utilisant var ?

L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.

ES5 n'a que deux façons de déclarer des variables : la commande var et la commande function.

ES6 En plus d'ajouter les commandes let et const, il existe deux façons de déclarer des variables : la commande import et la commande class.

Il existe donc 6 façons de déclarer des variables dans ES6 :

  • Déclarer des variables avec le mot-clé var

  • Déclarer des variables avec le mot-clé function

  • Déclarer des variables avec le mot-clé const

  • Utiliser la clé Utiliser le mot-clé laissez déclarer des variables

  • Utilisez le mot-clé class pour déclarer des variables

  • Utilisez le mot-clé import pour déclarer des variables

Utilisez le mot-clé var pour déclarer des variables

var est un mot-clé pour déclarer des variables, et la méthode de déclaration est :

var 变量名;

Quelques exemples :

var str;  //用来存储字符串
var age;  //用来存储年龄
var prePage;  //用来存储上一页

Lors de la définition d'une variable, vous pouvez définir une ou plusieurs variables à la fois. Si vous définissez plusieurs variables, vous devez utiliser des virgules pour séparer les noms des variables, comme indiqué. dans l'exemple suivant :

var a, b, c;    // 同时声明多个变量

Une fois les variables définies, si aucune valeur n'est attribuée aux variables, alors ces variables se verront attribuer une valeur initiale - non définie (non définie).

Une fois la variable définie, vous pouvez utiliser le signe égal = pour attribuer une valeur à la variable. Le côté gauche du signe égal est le nom de la variable et le côté droit du signe égal est la valeur à prendre. attribué à la variable, comme le montre l'exemple suivant :

var num;    // 定义一个变量 num
num = 1;    // 将变量 num 赋值为 1

De plus, vous pouvez également définir des variables Attribuez des valeurs aux variables en même temps, comme le montre l'exemple suivant :

var num = 1;                // 定义一个变量 num 并将其赋值为 1
var a = 2, b = 3, c = 4;    // 同时定义 a、b、c 三个变量并分别赋值为 2、3、4
// var a = 2,               // 为了让代码看起来更工整,上一行代码也可以写成这样
//     b = 3,
//     c = 4;

Explication :

  • Les variables définies par var peuvent être modifiées. Si elles ne sont pas initialisées, undefined sera affiché et aucune erreur ne sera signalée

  • var Les variables déclarées sur la fenêtre, utilisez let ou const pour déclarer une variable. sur la fenêtre. De nombreux langages ont des portées au niveau du bloc, mais pas JS. Il utilise var pour déclarer les variables et la fonction pour diviser les portées et les accolades "{}" ne peut pas limiter la portée de var, donc les variables déclarées avec. var a pour effet de promouvoir une variable

  • La portée des variables déclarées par var est globale ou au niveau de la fonction

  • Connaissances approfondies :

Les mots-clés let et const déclarent des variables

Avant 2015, JavaScript ne pouvait déclarer des variables que via le mot-clé var. Après la sortie d'ECMAScript6 (ES6), deux nouveaux mots-clés, let et const, ont été ajoutés pour déclarer les variables, où :

Les variables déclarées à l'aide du mot-clé let ne sont valides que dans le mot-clé let. bloc de code dans lequel elles se trouvent (similaire aux variables locales), et dans ce bloc de code, les variables portant le même nom ne peuvent pas être déclarées à plusieurs reprises 

  • clé const La fonction des mots est la même que celle de let, mais les variables sont déclarées en utilisant ; le mot-clé const a également une autre fonctionnalité, c'est-à-dire que les variables définies par le mot-clé const ne peuvent pas être modifiées une fois définies (c'est-à-dire que les variables définies à l'aide du mot-clé const sont des constantes).

  • Remarque : les versions IE10 et inférieures ne prennent pas en charge les mots-clés let et const.

  • L'exemple de code est le suivant :
let name = "小明";      // 声明一个变量 name 并赋值为“小明”
let age  = 11;          // 声明一个变量 age
let age  = 13;          // 报错:变量 age 不能重复定义
const PI = 3.1415       // 声明一个常量 PI,并赋值为 3.1415
console.log(PI)         // 在控制台打印 PI

Portées de var, let et const

Les portées des variables déclarées à l'aide de var incluent la portée globale et la portée de la fonction déclarées à l'aide de let et const ont une portée globale, une portée locale et ; portée du bloc. Étant donné que var prend en charge la promotion de variable, la portée globale de la variable var est valide pour le code de script de la page entière ; alors que let et const ne prennent pas en charge la promotion de variable, donc la portée globale des variables let et const fait référence à la période de l'instruction de déclaration La zone entière entre la fin du code de script de la page entière et la zone avant l'instruction de déclaration n'est pas valide.

De même, comme var prend en charge la promotion de variables, mais que let et const ne prennent pas en charge la promotion de variables, les variables locales déclarées à l'aide de var sont valides tout au long de la fonction, tandis que les variables locales déclarées à l'aide de let et const sont valides du début de l'instruction de déclaration jusqu'au la fin de la zone de fonction est valide. Il convient de noter que si la variable locale et la variable globale ont le même nom, alors dans la portée de la fonction, la variable locale écrasera la variable globale, c'est-à-dire que la variable locale fonctionnera dans le corps de la fonction en dehors du corps de la fonction ; , la variable globale fonctionnera et la variable locale fonctionnera. La variable n'est pas valide et une erreur de syntaxe se produira lors du référencement des variables locales.

Déclarez une variable avec le mot-clé function

function add(a) {
  var sum = a + 1;
  return sum;
}

déclare une nouvelle variable nommée add et lui attribue une définition de fonction

  • Le contenu entre {} est affecté à add

  • Le code à l'intérieur de la fonction sera ne pas être exécuté, il est simplement stocké dans des variables pour une utilisation future

  • Utilisez la classe de mots-clés pour déclarer des variables

À propos de la classe, j'écrirai un article séparé plus tard pour la présenter en détail, parlons-en brièvement ici : Tout d'abord, regardez le constructeur dans ES5, puis utilisez les classes ES6 pour l'implémenter :

// ES5写法 :
  function fun ( x, y ){
    this.x = x;
    this.y = y;
  };
  fun.prototype.GetHair = function(){
    return `${this.x}掉了两根头发,${this.y}说俺也一样!`;
  };
  let setHair = new fun('小明','老王');
  console.log(setHair.GetHair()); // 小明掉了两根头发,老王说俺也一样!
Regardons la méthode d'écriture de la classe ES6 :

 class Interest {
    constructor( x, y, e, z ){
      this.x = x;
      this.y = y;
      this.e = e;
      this.z = z;
    }
    MyInterest(){
      let arr = [];
      console.log(`我会${[...arr,this.x,this.y,this.e,this.z]}!`);
    }
  }
  let GetInterest = new Interest('唱','跳','rap','篮球');
  console.log(GetInterest.MyInterest());  //我会唱,跳,rap,篮球!

ES6 的class可以看作只是一个语法糖,它的绝大部分功能,ES5 都可以做到,新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已,constructor方法就是构造方法,而this关键字则代表实例对象。也就是ES5 的构造函数Point,对应 ES6 的Point类的构造方法。

用关键字import声明变量

import用于加载文件,在大括号接收的是一个或多个变量名,这些变量名需要与你想要导入的变量名相同。

举个栗子:你想要导入action.js文件中的某一个变量,这个变量里保存了一段代码块,所以你要写成:import { Button } from 'action',这个时候,你就从action.js中获取到了一个叫 Button 的变量,既然获取到了,你就可以对Button里的代码猥琐欲为了

如果想为输入的变量重新取一个名字,import命令要使用as关键字,将输入的变量重命名,比如:

import { NewButton as Button } from 'action.js';

上面的代码表示从action.js文件中,获取一个变量名称叫做Button的代码段,然后你又声明了一个变量 NewButton ,将 Button 保存在 NewButton

【相关推荐:javascript视频教程web前端

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:
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