ES5和ES6那些你必须知道的事儿

ES5新增的东西

二、对象方法

  1、Object.getPrototypeOf(object)

    返回对象的原型

function Pasta(grain, width) {
this.grain = grain;
this.width = width;
} var spaghetti = new Pasta("wheat", 0.2); var proto = Object.getPrototypeOf(spaghetti); console.log(proto)

     输出:

  2、Object.create

    用法:Object.create(prototype, descriptors)
   prototype

      必需。  要用作原型的对象。  可以为 null

   descriptors

      可选。  包含一个或多个属性描述符的 JavaScript 对象。

      “数据属性”是可获取且可设置值的属性。

      数据属性描述符包含 value 特性,

      以及 writableenumerable 和 configurable 特性。

      如果未指定最后三个特性,则它们默认为 false

   返回:一个具有指定的内部原型且包含指定的属性(如果有)的新对象

var newObj = Object.create(null, {
size: {
value: "large",
enumerable: true
},
shape: {
value: "round",
enumerable: true
}
}); document.write(newObj.size + "<br/>");
document.write(newObj.shape + "<br/>");
document.write(Object.getPrototypeOf(newObj)); // Output:
// large
// round
// null
  3、Object.getOwnPropertyNames
    方法返回对象的所有自身属性的属性名(包括不可枚举的属性)组成的数组,但不会获取原型链上的属性。
    即对象的所有key值
 
  4、Object.defineProperty
     方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。
     用法:Object.defineProperty(obj, prop, descriptor)
     obj:要在其上定义属性的对象。
     prop:要定义的key。
     descriptor:要定义的key对应的value。
 
  5、Object.getOwnPropertyDescriptor
     返回对象指定的key对应的value
     Object.getOwnPropertyDescriptor(obj, prop)
     obj:要在其上获取属性的对象。

     prop:要获取的key。
 
  6、Object.defineProperties
     Object.defineProperties(obj, props)
     obj: 将要被添加属性或修改属性的对象
    props: 该对象的一个或多个键值对定义了将要为对象添加或修改的属性的具体配置
var obj = new Object();
Object.defineProperties(obj, {
name: {
value: '张三',
configurable: false,
writable: true,
enumerable: true
},
age: {
value: 18,
configurable: true
}
}) console.log(obj.name, obj.age) // 张三, 18
  7、Object.keys
     Object.keys(obj)
     一个表示给定对象的所有可枚举属性的字符串数组。
     即对象所有key值组合成的数组。
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']
  8、Object.preventExtensions / Object.isExtensible
     应该使该对象不可扩展/应该检查的对象
     可防止将新属性添加到对象中
 
  9、Object.seal / Object.isSealed
     将要被密封的对象/判断一个对象是否被密封
 
  10、Object.freeze / Object.isFrozen
    方法可以冻结一个对象,冻结指的是不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性、可配置性、可写性。该方法返回被冻结的对象。
    方法判断一个对象是否被冻结

三、 strict模式(严格模式)

  “use strict”

  将"use strict"放在脚本文件的第一行,则整个脚本都将以"严格模式"运行。

  严格模式影响范围

    •   变量:  var、delete、变量关键字
    •   对象: 只读属性、 对象字面量属性重复申明
    •   函数:参数重名、arguments对象、申明
    •   其他:this、eval、关键字...

  

  设立"严格模式"的目的,主要有以下几个:错误检测、规范、效率、安全、面向未来

    - 消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;

    - 消除代码运行的一些不安全之处,保证代码运行的安全;

    - 提高编译器效率,增加运行速度;

    - 为未来新版本的Javascript做好铺垫。

  将"use strict"放在函数体的第一行,则整个函数以"严格模式"运行。

function strict(){
"use strict";
return "这是严格模式。";
}
function notStrict() {
return "这是正常模式。";
}

  具体体现:

    a、变量都必须先用var命令显示声明,然后再使用

    b、严格模式不能对变量调用 delete 操作符

    c、不用保留字做 变量名 或 参数名

    d、为只读属性赋值报错

    e、严格模式下参数名不能重复

    f、只能在脚本的顶级和在函数内部申明函数,if for等语句中申明函数会导致语法错误    

    g、严格模式下抑制this

四、Array.isArray() 

  用于确定传递的值是否是一个 Array

Array.isArray([1, 2, 3]);
// true
Array.isArray({foo: 123});
// false
Array.isArray("foobar");
// false
Array.isArray(undefined);
// false
// 下面的函数调用都返回 true
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
// 鲜为人知的事实:其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype); // 下面的函数调用都返回 false
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray({ __proto__: Array.prototype });

  instanceof 和 isArray

当检测Array实例时, Array.isArray 优于 instanceof,因为Array.isArray能检测iframes.

ES5和ES6那些你必须知道的事儿(二)的更多相关文章

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

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

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

    ES5和ES6那些你必须知道的事儿 ES5新增的东西 一.数组方法 1.forEach     用途:遍历,循环 对于空数组不会执行回调函数 //用法 array.forEach( function( ...

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

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

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

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

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

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

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

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

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

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

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

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

  9. ES5与ES6的小差异

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

随机推荐

  1. QCon2019全球软件开发大会广州站即将来袭

    QCon广州2019|全球软件开发大会 会议时间:2019-05-25 08:00至 2019-05-28 18:00结束 会议地点: 广州  广州万富希尔顿酒店  中国广州市白云区云城东路515-5 ...

  2. a标签和p标签不能设置margin

    经常会发现正常div的属性在a标签上或者p标签上都不管用,这是因为a标签和p标签都不是盒子模型. 例如: <div style="margin-top:5px;">&l ...

  3. jquery对复选框(checkbox)的操作(精华)

    @{ Layout = null;} <!DOCTYPE html> <html><head> <meta name="viewport" ...

  4. Java代码质量改进之:同步对象的选择

    在Java中,让线程同步的一种方式是使用synchronized关键字,它可以被用来修饰一段代码块,如下: synchronized(被锁的同步对象) { // 代码块:业务代码 } 当synchro ...

  5. nginx的启动、停止、重载配置、验证配置

    [1]启动 启动nginx系统方式: (1)命令 nginx -c /usr/local/nginx/conf/nginx.conf 说明:-c 参数指定运行nginx系统的自定义配置文件. 若加:使 ...

  6. 网站app被劫持怎么办?HTTPDNS阿里云域名防劫持, DNSPod 移动解析服务 D+

    网站app被劫持怎么办?HTTPDNS阿里云域名防劫持, DNSPod 移动解析服务 D+ HTTPDNS_移动开发_域名解析_域名防劫持-阿里云https://www.aliyun.com/prod ...

  7. 连接redis错误:ERR Client sent AUTH, but no password is set

    问题原因:没有设置redis的密码 解决:命令行进入Redis的文件夹: D:\Redis-x64-3.2.100>redis-cli.exe 查看是否设置了密码: 127.0.0.1:6379 ...

  8. React高级教程(es6)——(1)JSX语法深入理解

    从根本上来说,JSX语法提供了一种创建React元素的语法糖,JSX语句可以编译成: React.createElement(component, props, …children)的形式,比如: & ...

  9. three.js 3d三维网页代码加密的实现方法

    http://www.jiamisoft.com/blog/17827-three-js-3dsanweiwangyejiami.html https://www.html5tricks.com/ta ...

  10. js 二维数组 for 循环重新赋值

    javascript 二维数组的重新 组装 var arr = [[1,2],[3,4],[5,6],[7,8]]; var temp = new Array(); for(var i= 0 ;i&l ...