今天开始ES5与ES6的研究。

1、什么是ES5与ES6?

  就是ECMAScript的第五个版本与第六个版本,那么问题来了,什么是ECMAScript?首先它是一种由Ecma国际通过ECMA-262标准化的脚本程序设计语言,又被称为JavaScript,但其实JavaScript是ECMA-262标准的实现与扩展(说了那么多其实它就是JavaScript的核心语言标准),具体的名字由来及历史可以参照ECMAScript百度百科。学习ECMAScript可以对JavaScript语言中的复杂特性有比较深入的了解。

2、ECMAScript 语言中的实际类型共有六种。

  分别为UndefinedNullBooleanNumberString 和 Object

  Undefined:它只有一个值Undefined,如果一个变量没有通过赋值操作指定一个值,那么该变量的值是 undefined

  Null :也只有一个值 null

  Boolean有两个值 true 和 false

  Number始终使用 64 位双精度浮点数来表示数值,Number 类型的值的个数是 264-253+3。个数后面的“+3”表示的是 Number 类型的 3 个特殊值,分别是NAN、+Infinity  -InfinityNaN 的含义是“不是一个数字(Not-A-Number)”。在代码中可以直接通过“NaN”的方式来引用这个值。代码中与数值相关的计算的结果也可能是 NaN。一般来说,对于 ECMAScript 语言中的操作符,如果其中一个操作数为 NaN,那么计算结果为NaN。当需要判断一个变量引用 a 是否为 NaN 时,只需要判断 a !== a 是否为 true 即可。+Infinity 和 -Infinity 分别表示正无穷大和负无穷大,可以在代码中直接引用,也可能是某些数值运算的结果。如运算“3 / 0”的结果是 Infinity。除了这 3 个特殊值之外,剩下的数值中一半是正数,一半是负数。数值 0 也有正数和负数两种形式,称为正 0 和负 0,分别用 +0 和 -0 来表示。

   String :它的处理也比较简单。任何有限长度的 16 位无符号整数的有序序列都是 String 类型的值。当 String 类型对象中包含的是文本数据时,序列中的每个元素的值是 UTF-16 格式的代码单元的值,对应于 Unicode 中的代码点。

  Object:是一个对象,本身是一个函数,因此“typeof Object”表达式的值是functionObject 函数既可以直接调用,也可以作为构造函数来创建新的对象。  

3、 Object.defineProperty 函数的使用示例
var obj = {};
Object.defineProperty(obj, 'val', {}); // 创建一个新属性,特性为默认值
obj.val = 1; Object.defineProperty(obj, 'CONSTANT', {value : 32, writable : false}); // 创建一个只读属性
obj.CONSTANT = 16; // 对属性的修改是无效的,但是不会抛出错误 Object.defineProperty(obj, "newVal", {enumerable: true});
for (var key in obj) {
console.log(key); // 可以枚举出 newVal
} var initValue = 0;
Object.defineProperty(obj, "initValue", {
get : function() {
return initValue;
},
set : function(val) {
if (val > 0) {
initValue = val;
}
}
});

4、通过赋值操作创建新属性

var obj = {val : 1};
obj.newVal = "Hello"; Object.seal(obj);
Object.defineProperty(obj, 'anotherVal', {}); // 抛出 TypeError 错误

5、函数

  函数在ES中有着特殊的地位,很多功能都是基于函数实现的,可谓是无所不能,函数可以通过三种方式来创建:第一种是使用构造函数 Function,第二种是使用函数声明,第三种是使用函数表达式。

6、构造函数案例

 function calculate(expr) {
return new Function("return " + expr).apply();
} calculate("3 * (2 + 4)");

7、构造函数案例  

function calculate(expr) {
return new Function("return " + expr).apply();
} calculate("3 * (2 + 4)");

8、bind函数的使用

  
var obj = {
name : "alex"
}; function func() {
console.log(this.name);
} var func1 = func.bind(obj);
func1(); // 输出 alex function add(a, b) {
return a + b;
} var addBy5 = add.bind(this, 5);
addBy5(3); // 值为 8,只有一个形式参数

数组

9、Array.prototype 中函数的使用示例

var array = [1, 2, 3, 4, 5];
array.indexOf(3); // 值为 2
array.lastIndexOf(4); // 值为 3
array.every(function(value, index, arr) {
return value % 2 === 0;
}); // 值为 false
array.some(function(value, index, arr) {
return value % 2 === 0;
}); // 值为 true
array.forEach(function(value, index, arr) {
console.log(value);
});
array.map(function(value, index, arr) {
return value * 2;
}); // 值为 [2, 4, 6, 8, 10]
array.filter(function(value, index, arr) {
return value % 2 === 0;
}); // 值为 [2, 4]
array.reduce(function(preValue, value, index, arr) {
return preValue + value;
}); // 值为 15
array.reduceRight(function(preValue, value, index, arr) {
return preValue * value;
}); // 值为 120

JSON

10、JSON 对象的 parse 函数的使用示例

var jsonStr = '{"a":1, "b":2, "c":3}';
JSON.parse(jsonStr); JSON.parse(jsonStr, function(key, value) {
return typeof value === 'number' ? value * 2 : value;
}); // 结果为 {a:2, b:4, c:6} JSON.parse(jsonStr, function(key, value) {
return typeof value === 'number' && value % 2 === 0 ? undefined : value;
}); // 结果为 {a:1, b:3}

11、JSON 对象中 stringify 函数的使用示例

var user = {
name : 'Alex',
password : 'password',
email : 'alex@example.org'
}; JSON.stringify(user);
JSON.stringify(user, ['name']); // 输出结果为“{"name":"Alex"}”
JSON.stringify(user, function(key, value) {
if (key === 'email') {
return '******';
}
if (key === 'password') {
return undefined;
}
return value;
}); // 输出结果为“{"name":"Alex","email":"******"}”
JSON.stringify(user, null, 4);

严格模式

ECMAScript 规范第五版的一个重要新特性是引入了代码执行时的严格模式。在严格模式下,对于 ECMAScript 代码执行时的限制更多。某些使用方式在严格模式下是不允许的。这有利于避免一些潜在的问题,提高代码的鲁棒性。一般来说,框架需要可以在严格模式下能正确运行,而一般的应用程序则可以选择是否使用严格模式。通过在 ECMAScript 代码的最开始使用 "use strict" 或 'use strict' 就可以声明这段代码需要运行在严格模式下

12、严格模式下 this 的值

"use strict";
function func() {
console.debug(typeof this); // 输出为 number
} func.apply(10);

ES6

 ES6是一次重大的版本升级,与此同时,由于ES6秉承着最大化兼容已有代码的设计理念,你过去编写的JS代码将继续正常运行。事实上,许多浏览器已经支持部分ES6特性,并将继续努力实现其余特性。这意味着,在一些已经实现部分特性的浏览器中,你的JS代码已经可以正常运行。如果到目前为止你尚未遇到任何兼容性问题,那么你很有可能将不会遇到这些问题,浏览器正飞速实现各种新特性。但是对于初学者来说,应该先学ES5标准,在这个基础上学习ES6,作为提升。

ES6增加了一些新特性,具体可以参照http://www.cnblogs.com/Wayou/p/es6_new_features.html

  

ES5与ES6的研究的更多相关文章

  1. React入门 (1)—使用指南(包括ES5和ES6对比)

    前言 本篇会简明扼要的介绍一下React的使用方法.代码会用JSX+ES5和JSX+ES6两种方式实现. React简介 React来自Facebook,于2013年开源.至今不断修改完善,现在已经到 ...

  2. ES5和ES6中对于继承的实现方法

    在ES5继承的实现非常有趣的,由于没有传统面向对象类的概念,Javascript利用原型链的特性来实现继承,这其中有很多的属性指向和需要注意的地方. 原型链的特点和实现已经在之前的一篇整理说过了,就是 ...

  3. JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)

    写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...

  4. JavaScript面向对象轻松入门之封装(demo by ES5、ES6、TypeScript)

    本章默认大家已经看过作者的前一篇文章 <JavaScript面向对象轻松入门之抽象> 为什么要封装? 封装(Encapsulation)就是把对象的内部属性和方法隐藏起来,外部代码访问该对 ...

  5. JavaScript面向对象轻松入门之多态(demo by ES5、ES6、TypeScript)

    多态(Polymorphism)按字面的意思就是"多种状态",同样的行为(方法)在不同对象上有不同的状态. 在OOP中很多地方都要用到多态的特性,比如同样是点击鼠标右键,点击快捷方 ...

  6. JavaScript、ES5和ES6的介绍和区别

    JavaScript由三部分组成: ECMAScript(核心) DOM(文档对象模型) BOM (浏览器对象模型) ES5(ECMAScript第五个版本) strict模式 严格模式,限制一些用法 ...

  7. ES5和ES6那些你必须知道的事儿(三)

    ES5和ES6那些你必须知道的事儿 ES6新增的东西 一.块级作用域:关键字let,常量const let与var的区别: a.不会进行变量声明提升 b.变量不允许被重复定义 c.变量不允许被删除 d ...

  8. ES5与ES6的小差异

    ES5与ES6的小差异 变量的定义 ES6与ES5的区别 ES5: <script> console.log(username); var username; var username = ...

  9. React Native的语法之ES5和ES6

    原文地址:http://www.devio.org/2016/08/11/React-Native%E4%B9%8BReact%E9%80%9F%E5%AD%A6%E6%95%99%E7%A8%8B- ...

随机推荐

  1. C#中转换函数Convert、Parse、TryParse、(int) 的区别

    Convert.Parse.TryParse.(int) 三个函数都是将值转换成整数,但是四者之间各有异同,开发人员可以根据情况选用最合适的.以下解释均经过高人验证,希望对大家有所帮助. 1 (int ...

  2. Android studio在新窗口中打开新项目

  3. shutdown函数

    #include <sys/socket.h> int shutdown(int sockfd, int howto); 返回:若成功则为0,若出错则为- (1)该函数的行为依赖于howt ...

  4. 神奇的Content-Type——在JSON中玩转XXE攻击

    大家都知道,许多WEB和移动应用都依赖于Client-Server的WEB通信交互服务.而在如SOAP.RESTful这样的WEB服务中,最常见的数据格式要数XML和JSON.当WEB服务使用XML或 ...

  5. luogu 3538/bzoj 2795 Poi2008 哈希+质数结论

    题意:给定一个子串,询问一些子区间内的最短循环节(循环节是越短条件约束越多) 开始一看那就哈希处理然后暴力枚举循环节,然后按照循环节长度暴力向后比较,本地测试40,洛谷60 #include<b ...

  6. java实现数据缓存

    摘抄自java并发实战 有时候需要对数据缓存.用Map缓存数据比较合适.但是由于对吞吐量,一致性,计算性能的要求,对数据进行缓存的设计还是需要慎重考虑的. 一.利用HashMap加同步 (1)说明 把 ...

  7. Kali Linux之web安全扫描器skipfish使用

    0x00.skipfish简介 谷歌公司出品的开源web程序评估软件. skipfish特点:CPU资源占用低,扫描速度快,每秒可以轻松处理2000个请求,误报率低. 1x00.skipfish使用 ...

  8. [C++]Linux之进程间通信小结【待完善】

    [此博文,待日后完善] 进程通信方式: 1.管道通信(匿名管道/命名管道) 2.消息队列 3.共享内存 4.信号量 1.管道通信 无名管道用于具有亲缘关系进程间的通信管道是半双工的,数据只能单向流动( ...

  9. 例:判断是不是自有属性hasOwnProperty方法

    自有属性和共有属性: 自有属性:直接保存在对象本地的属性 共有属性:保存在原型对象中,被所有子对象共享的属性 获取时:都可用对象.属性方法 赋值时:自有属性,必须:对象.属性 = 值 共有属性,必须: ...

  10. Mysql-5.7.20-winx64绿色版安装步骤

    Mysql-5.7.20-winx64绿色版安装步骤 1. 下载 mysql-5.7.20-winx64.zip 2.解压 解压到指定目录: C:\AppDate\mysql-5.7.20-winx6 ...