温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

es6新增的声明方法怎么用

发布时间:2022-04-11 09:07:10 来源:亿速云 阅读:186 作者:iii 栏目:编程语言

本文小编为大家详细介绍“es6新增的声明方法怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6新增的声明方法怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

新增声明方法:1、let,用于声明变量,语法“let 变量名=值”;2、const,用于声明常量,语法“const 常量名=值”;3、class,用于声明类,语法“class 类名{...}”;4、import,用于声明静态加载的输入变量。

本文操作环境:windows10系统、Vue2.9.6版,DELL G3电脑。

es6新增的声明方法有什么

声明变量在ES5之前有两种:第一种是声明变量和常量的 “ var ”。第二种是声明函数的 “ function ”。在ES6中,声明变量的方法一下子扩充了到了 6 种,总结如下:

声明变量或常量:var 、let(ES6新增) 、const (ES6新增);

声明函数变量:function ;

声明类:class(ES6新增);

声明 ‘ 静态加载 ’ 输入变量:import (ES6新增);

在我们学习这几个新增的方法之前,还需要知道几个ES6新定义的概念:

1,let和const

定义:

let: ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的块级作用域内有效。

const:ES6新增了const命令,声明一个只读的常量。一旦声明,常量的值就不能改变。同let一样声明的变量只在块级作用域内有效;

特点差异:

相同:都不存在变量提升,所以只能声明后再使用,不声明使用会报错;

都有暂时性死区(TDZ),这也解释了为什么不声明变量就使用会报错;

都不允许重复声明;

不同:const声明的变量是 “ 不可改变 ” 的变量,所以在声明变量时必须直接赋值,常量赋值后不能改变值,否则报错;

注意:上边我们说的const声明的变量不可改变是针对 “常量” 我理解是“ 基本数据类型 ”,比如字符串,数值,布尔值等等。并不是指的所有数据类型,当我们用const声明的变量是引用数据类型时,是可以改变值的。

这里就说到了const保存的内容的真正含义:const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。

但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。

用法:

// let 用法
let a = '123';
 
// const 用法
const b = '456'

2,class

定义:ES6 的class可以看作只是一个语法糖,它的绝大部分功能,ES5 都可以做到,新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

(class定义类,其实是很重要的一个知识,这里只是简单的学习一下它的最最最基本的用法,也是作为一个引子。深入的学习我们会在后续记录)

用法:

// 基本方法定义一个类
class Point{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
 
    toString(){
        return '( '+ this.x +','+ this.y +')';
    }
}
 
var point = new Point(2,3)
point.toString(); // (2,3)
 
 
// 表达式的方法定义一个类
let person = new class {
  constructor(name) {
    this.name = name;
  }
 
  sayName() {
    console.log(this.name);
  }
}('张三');
 
person.sayName(); // "张三"

3,import

用法:

使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块。

// main.js
import { firstName, lastName, year } from './profile.js';
 
function setName(element) {
  element.textContent = firstName + ' ' + lastName;
}

上面代码的import命令,用于加载profile.js文件,并从中输入变量。import命令接受一对大括号,里面指定要从其他模块导入的变量名。大括号里面的变量名,必须与被导入模块(profile.js)对外接口的名称相同。如果想为输入的变量重新取一个名字,import命令要使用as关键字,将输入的变量重命名。

import { lastName as surname } from './profile.js';

读到这里,这篇“es6新增的声明方法怎么用”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

es6
AI