es6中能不能用var声明变量

这篇文章主要讲解了“es6中能不能用var声明变量”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“es6中能不能用var声明变量”吧！

es6能用var声明变量。var是声明变量的一个关键字，使用var关键字声明的变量，其作用域有两种：全局作用域和函数作用域；由于var支持变量提升，所以用var声明的全局变量在整个脚本代码中有效，使用var声明的局部变量在整个函数中有效。

本教程操作环境：windows7系统、ECMAScript 6版、Dell G3电脑。

ES5 只有两种声明变量的方法：var命令和function命令。

ES6 除了添加let和const命令，还有两种声明变量的方法：import命令和class命令。

所以，ES6 一共有 6 种声明变量的方法：

• 用关键字var声明变量

• 用关键字function声明变量

• 用关键字const声明变量

• 用关键字let声明变量

• 用关键字class声明变量

• 用关键字import声明变量

用关键字var声明变量

var是声明变量的一个关键字，声明方法：

var 变量名;

举几个例子：

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

定义变量时，可以一次定义一个或多个变量，若定义多个变量，则需要在变量名之间使用逗号,分隔开，如下例所示：

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

变量定义后，如果没有为变量赋值，那么这些变量会被赋予一个初始值——undefined（未定义）。

变量定义后，可以使用等于号=来为变量赋值，等号左边的为变量的名称，等号右边为要赋予变量的值，如下例所示：

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

此外，也可以在定义变量的同时为变量赋值，如下例所示：

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;

说明：

• var定义的变量可以修改，如果不初始化会输出undefined，不会报错

• var 声明的变量在window上，用let或者const去声明变量，这个变量不会被放到window上

• 很多语言中都有块级作用域，但JS没有，它使用var声明变量，以function来划分作用域，大括号“{}” 却限定不了var的作用域，因此用var声明的变量具有变量提升的效果

• var 声明的变量作用域是全局的或者是函数级的

扩展知识：

let 和 const 关键字声明变量

2015 年以前，JavaScript 只能通过 var 关键字来声明变量，在 ECMAScript6（ES6）发布之后，新增了 let 和 const 两个关键字来声明变量，其中：

• 使用 let 关键字声明的变量只在其所在的代码块中有效（类似于局部变量），并且在这个代码块中，同名的变量不能重复声明；

• const 关键字的功能和 let 相同，但使用 const 关键字声明的变量还具备另外一个特点，那就是 const 关键字定义的变量，一旦定义，就不能修改（即使用 const 关键字定义的为常量）。

注意：IE10 及以下的版本不支持 let 和 const 关键字。

示例代码如下：

let name = "小明";      // 声明一个变量 name 并赋值为“小明”
let age  = 11;          // 声明一个变量 age
let age  = 13;          // 报错：变量 age 不能重复定义
const PI = 3.1415       // 声明一个常量 PI，并赋值为 3.1415
console.log(PI)         // 在控制台打印 PI

var、let和const的作用域

使用 var 声明的变量的作用域有全局作用域和函数作用域；使用 let 和 const 声明的变量有全局作用域、局部作用域和块级作用域。

由于 var 支持变量提升，所以 var 变量的全局作用域是对整个页面的脚本代码有效；而 let 和 const 不支持变量提升，所以 let 和 const 变量的全局作用域指的是从声明语句开始到整个页面的脚本代码结束之间的整个区域，而声明语句之前的区域是没有效的。

同样，因为 var 支持变量提升，而 let 和 const 不支持变量提升，所以使用 var 声明的局部变量在整个函数中有效，而使用 let 和 const 声明的局部变量从声明语句开始到函数结束之间的区域有效。需要注意的是，如果局部变量和全局变量同名，则在函数作用域中，局部变量会履盖全局变量，即在函数体中起作用的是局部变量；在函数体外，全局变量起作用，局部变量无效，此时引用局部变量将出现语法错误。

用关键字function声明变量

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

• 声明了一个名为 add的新变量，并为其分配了一个函数定义

• {}之间的内容被分配给了 add

• 函数内部的代码不会被执行，只是存储在变量中以备将来使用

用关键字class声明变量

关于class，后期我会单独写一篇文章，详细的介绍一下，这里就简单说一下： 首先通过看ES5中的构造函数，然后再用ES6的class去实现：

// 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()); // 小明掉了两根头发，老王说俺也一样！

再来看一下ES6的class写法：

 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

感谢各位的阅读，以上就是“es6中能不能用var声明变量”的内容了，经过本文的学习后，相信大家对es6中能不能用var声明变量这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是亿速云，小编将为大家推送更多相关知识点的文章，欢迎关注！