广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >es6中能不能用var声明变量
  • 484
分享到

es6中能不能用var声明变量

2024-04-02 19:04:59 484人浏览 泡泡鱼
摘要

这篇文章主要讲解了“es6中能不能用var声明变量”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“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声明变量这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

--结束END--

本文标题: es6中能不能用var声明变量

本文链接: https://www.lsjlt.com/news/97271.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • es6中能不能用var声明变量
    这篇文章主要讲解了“es6中能不能用var声明变量”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“es6中能不能用var声明变量”吧! ...
    99+
    2022-10-19
  • es6中怎么用关键字var声明变量
    这篇文章将为大家详细讲解有关es6中怎么用关键字var声明变量,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。用关键字var声明变量var a ;  /...
    99+
    2022-10-19
  • css里能不能用var变量
    本篇内容主要讲解“css里能不能用var变量”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“css里能不能用var变量”吧! css里...
    99+
    2022-10-19
  • javascript声明变量不用var的方法有哪些
    本篇内容主要讲解“javascript声明变量不用var的方法有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“javascript声明变量不用var的方法有...
    99+
    2022-10-19
  • javascript变量声明是否必须用var
    这篇文章将为大家详细讲解有关javascript变量声明是否必须用var,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。javascript中,变量声明不是必须用var,还...
    99+
    2022-10-19
  • es6声明变量要不要初始化
    这篇文章主要介绍“es6声明变量要不要初始化”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“es6声明变量要不要初始化”文章能帮助大家解决问题。 ...
    99+
    2022-10-19
  • 如何使用es6声明变量
    本篇文章给大家分享的是有关如何使用es6声明变量,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。 声明变量的方法:1...
    99+
    2022-10-19
  • es6中怎么用关键字import声明变量
    小编给大家分享一下es6中怎么用关键字import声明变量,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!用关键字import声明...
    99+
    2022-10-19
  • es6中怎么用关键字class声明变量
    小编给大家分享一下es6中怎么用关键字class声明变量,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!用关键字class声明变量...
    99+
    2022-10-19
  • es6中怎么用关键字let声明变量
    小编给大家分享一下es6中怎么用关键字let声明变量,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!用关键字let声明变量let&...
    99+
    2022-10-19
  • es6中怎么用关键字const声明变量
    这篇文章主要为大家展示了“es6中怎么用关键字const声明变量”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“es6中怎么用关键字const声明变量”这篇文章吧...
    99+
    2022-10-19
  • es6中怎么用关键字function声明变量
    这篇文章主要介绍了es6中怎么用关键字function声明变量,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。用关键字function声明变量...
    99+
    2022-10-19
  • javascript使用var声明变量的问题怎么解决
    这篇文章主要介绍了javascript使用var声明变量的问题怎么解决的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇javascript使用var声明变量的问题怎么解决文章都会...
    99+
    2022-10-19
  • JavaScript变量能在声明之前使用吗
    这篇文章主要介绍了JavaScript变量能在声明之前使用吗的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript变量能在声明之前使用吗文章都会有所收获,下面我们一...
    99+
    2022-10-19
  • ES6中如何使用let声明变量以及let loop机制
    这篇文章主要为大家展示了“ES6中如何使用let声明变量以及let loop机制”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“ES6中如何使用let声明变量以及...
    99+
    2022-10-19
  • ES6中let变量声明以及特性的示例分析
    这篇文章主要介绍了ES6中let变量声明以及特性的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。let 变量声明以及特性声明变量&n...
    99+
    2022-10-19
  • 详解Golang中变量的不同声明方式
    详解Golang中变量的不同声明方式在Golang中,变量的声明方式多种多样,每一种声明方式都有其特点和用途。下面将详细介绍Golang中变量的不同声明方式,并附上相应的代码示例。var声明法:var 是Golang中最常见的变量声明方式之...
    99+
    2023-12-23
    Golang中变量声明方式有多种
  • sql中怎么使用declare声明变量
    在SQL中,可以使用DECLARE语句来声明变量。DECLARE语句用于在存储过程、函数或触发器中声明变量。DECLARE语句的语法...
    99+
    2023-08-08
    sql declare
  • 怎么在JavaScript中以不同的方式声明变量
    本篇内容主要讲解“怎么在JavaScript中以不同的方式声明变量”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“怎么在JavaScript中以不同的方式声明变量...
    99+
    2022-10-19
  • javascript中用哪个关键字声明变量
    这期内容当中小编将会给大家带来有关javascript中用哪个关键字声明变量,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。javascript中声明变量的关键字是var、let和const。var声明的变...
    99+
    2023-06-15
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作