ECMAScript 6 简介

ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

ECMA:国际标准组织

let 和 const 命令

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

{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

上面代码在代码块之中,分别用letvar声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

const声明一个只读的常量。一旦声明,常量的值就不能改变。

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

上面代码表明改变常量的值会报错。

本质

const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。

模板字符串

<script>
    var name = '小明', age = '83';

    // var str = name+"今年"+age+",下午我们去吃鸡";

    var str = `${name}今年${age},下午我们去吃鸡`;
    alert(str)

</script>

  

箭头函数

伪代码: function 函数名(){}  === var 函数名 = ()=>{}

<script>
     // es5 写法
	 function add1(x,y) {
			 	return x+y
			 }

			 alert(add1(1,2));
    // es6 箭头函数
     var add2 = (a,b)=>{

			 	return a+b
			 }

			 alert(add2(2,3));
</script>

字面量方式创建对象以及对象的单体模式

<script>
     var person = {
	 	name:'小明',
	 	age:18,
	 	fav:function() {
	 		// es5的函数中的this指向了当前对象
	 		alert(this.name)
	 	}
	 };

	 person.fav() // 小明
</script>

<script>
    var person2 = {
        name: '小明2',
        age: 18,
        fav: () => {
        // es6注意事项:箭头函数会改变this的指向 父级
        alert(this)
    }
    }

    person2.fav() // [object Window]
</script>

<script>
    //对象的单体模式
    // 使用对象的单体模式解决了this的指向问题

    var person = {
        name: '小明',
        age: 18,
        fav() {
            alert(this.name)
        }
    }

    person.fav() // 小明
</script>

es6中的面向对象

es6使用class 类方式创建

<script>
	class Cat{

		// constuctor 构造器  class方式创建 单体模式之间不要有逗号

		constructor(name,age){
			this.name = name;
			this.age = age

		}
		showName(){
			console.log(this.name)
		}
		showAge(){
			console.log(this.age)
		}

	}

	var c = new Cat('xiaohong',12)
	c.showName()
</script>

阮一峰的es6教程:http://es6.ruanyifeng.com/#docs/intro

ES6 基本语法的更多相关文章

  1. ES6常用语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  2. ECMAScript简介以及es6新增语法

    ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...

  3. ES6新语法

    ES6新语法概览 简介 ES6是JavaScript语言的新一代标准,加入了一些新的功能和语法,正式发布于2015年6月,亦称ES2015:该标准由ECMA(欧洲计算机制造联合会)的第39号技术专家委 ...

  4. ES6新语法的介绍

    对于ES6新语法,阮一峰有一篇文章介绍的挺详细 http://es6.ruanyifeng.com/#docs/destructuring

  5. ES6最新语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  6. ES6新语法之let关键字;有别于传统关键字var的使用

    ES6新语法于2015年发布:而我这个前端小白在17年才接触到.惭愧惭愧!!不过到目前为止,似乎只有FireFox和Chrome对ES6的支持相对良好.不过既然人家ES6已经出来了,还是要跟上技术的潮 ...

  7. 让 Node.js 支持 ES6 的语法

    为了让 Node.js 支持 ES6 的语法, 需要使用 Babel. 安装 es-checker 在使用 Babel 之前 , 我们先检测一下当前 node 对 es6 的支持情况. 在命令行下执行 ...

  8. Vue(1)- es6的语法、vue的基本语法、vue应用示例,vue基础语法

    一.es6的语法 1.let与var的区别 ES6 新增了let命令,用来声明变量.它的用法类似于var(ES5),但是所声明的变量,只在let命令所在的代码块内有效.如下代码: { let a = ...

  9. JavaScript ES6部分语法

    ES6是JavaScript语言的新版本,它也可以叫做ES2015,之前学习的JavaScript属于ES5,ES6在它的基础上增加了一些语法,ES6是未来JavaScript的趋势,而且vue组件开 ...

  10. ES6常用语法简介import export

    ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...

随机推荐

  1. 『TensorFlow』张量拼接_调整维度_切片

    1.tf.concat tf.concat的作用主要是将向量按指定维连起来,其余维度不变:而1.0版本以后,函数的用法变成: t1 = [[1, 2, 3], [4, 5, 6]] t2 = [[7, ...

  2. 下载配置nodeJs,cnpm,webpack,vue-cli等,刚装的系统,所有东西重新配置

    最近重新装了系统,所有的环境都要重新配置了,做个笔记. 安装nodeJs: 可以参照教程:https://www.runoob.com/nodejs/nodejs-install-setup.html ...

  3. encodeURIComponent编码与解码

    问题:JavaScript用encodeURIComponentt编码后无法再后台解码的问题. 目前写法: window.self.location="list.jsp?searchtext ...

  4. 8.5 C++输入相关的成员函数

    参考:http://www.weixueyuan.net/view/6411.html 总结: 输入相关的常用的类成员函数. 1) get函数有三种重载形式:不带参数.带一个参数和带有三个参数. 不带 ...

  5. mybatis foreach 遍历list中的坑

    将jdbc改写为mybatis时,传入的条件为list使用到的标签是<where> .<choose>.<when>.<if>.<foreach& ...

  6. eclipse导入git项目出现There are no resources that can be added or removed from the server错误

    上传到git上的项目因为配置了过滤文件,将.settings文件和.project文件都过滤掉了,settings文件中主要存放的是各种插件配置,约束你可以更好的利用IDE进行编码 因为将这两个文件过 ...

  7. Android开发 ---构建对话框Builder对象,消息提示框、列表对话框、单选提示框、多选提示框、日期/时间对话框、进度条对话框、自定义对话框、投影

    效果图: 1.activity_main.xml 描述: a.定义了一个消息提示框按钮 点击按钮弹出消息 b.定义了一个选择城市的输入框 点击按钮选择城市 c.定义了一个单选提示框按钮 点击按钮选择某 ...

  8. VS--------实用快捷键

    Ctrl + M + O : 折叠所有方法 Ctrl + Tab: 切换不同窗口 ------------------------------开发--------------------------- ...

  9. datatables 行与列的数据获取

    datatables官网: https://datatables.net/reference/api/cells() 获取数据的方式如下 var table = $(selector).DataTab ...

  10. springBoot的数据库操作

    一:操作数据库起步 1.Spring-Data-Jpa JPA定义了对象持久化的标准. 目前实现了有Hibernate,TopLink 2.pom添加依赖 <dependency> < ...