为什么 typeof null === 'object'

原理是这样的,不同的对象在底层都表示为二进制,在JavaScript中二进制前三位都为0的话会被判断为 object 类型, null 的二进制表示是全0,自然前三位也是0,所以执行 typeof 时会返回“ object ”。

对象属性的存在性

如 myObject.a 的属性访问返回值可能是 undefined ,但是这个值有可能是属性中存储的 undefined ,也可能是因为属性不存在所以返回 undefined 。那么如何区分这两种情况呢?

var myObject = {
a:2
}; // 方案一
("a" in myObject); // true
("b" in myObject); // false // 方案二
myObject.hasOwnProperty( "a" ); // true
myObject.hasOwnProperty( "b" ); // false // 方案三
Object.prototype.hasOwnProperty.call(myObject, 'b')

对象继承的三种方法

参考如下代码:

		function Foo(name) {
this.name = name;
} Foo.prototype.myName = function() {
console.log(this.name)
} function Bar(name, label) {
Foo.call(this, name);
this.label = label;
} // 方法1
Bar.prototype = Object.create(Foo.prototype) // 方法2
Bar.prototype = Foo.prototype; // 方法3
Bar.prototype = new Foo(); //Bar.prototype.constructor = Bar; Bar.prototype.sayName = function() {
console.log(this.name)
} var b = new Foo('fayin') b.sayName()

上例中,三种方法都可以使 Bar 继承 Foo.prototype 上的方法,但它们之间又有微妙的差别:

Object.create(..) 会凭空创建一个“新”对象并把新对象内部的 [[Prototype]] 关联到你指定的对象(本例中是 Foo.prototype )。

Bar.prototype = Foo.prototype 并不会创建一个关联到 Bar.prototype 的新对象,它只是让 Bar.prototype 直接引用 Foo.prototype 对象。因此当你执行类似 Bar.prototype.myLabel = ... 的赋值语句时会直接修改 Foo.prototype 对象本身。

Bar.prototype = new Foo() 的确会创建一个关联到 Bar.prototype 的新对象。但是它使用了 Foo(..)的“构造函数调用”,如果函数 Foo 有一些副作用(比如写日志、修改状态、注册到其他对象、给 this 添加数据属性,等等)的话,就会影响到 Bar() 的“后代”,后果不堪设想。

结论

因此,要创建一个合适的关联对象,我们必须使用 Object.create(..) 而不是使用具有副作用的 Foo(..) 。这样做唯一的缺点就是需要创建一个新对象然后把旧对象抛弃掉,不能直接修改已有的默认对象。

javascript 易错知识点合集的更多相关文章

  1. JavaScript易错知识点

    JavaScript易错知识点整理1.变量作用域上方的函数作用域中声明并赋值了a,且在console之上,所以遵循就近原则输出a等于2. 上方的函数作用域中虽然声明并赋值了a,但位于console之下 ...

  2. JavaScript易错知识点整理

    前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一 ...

  3. JavaScript 易错知识点整理

    本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一些ES ...

  4. JavaScript易错知识点整理[转]

    前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一 ...

  5. JS易错知识点

    JAVASCRIPT易错知识点整理 前言 本文是学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由 ...

  6. JavaScript易错点转载

    前言 本文是我学习JavaScript过程中收集与整理的一些易错知识点,将分别从变量作用域,类型比较,this指向,函数参数,闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解,其中也涉及了一 ...

  7. Java易错知识点(1) - 关于ArrayList移除元素后剩下的元素会立即重排

    帮一个网友解答问题时,发现这样一个易错知识点,现总结如下: 1.易错点: ArrayList移除元素后,剩下的元素会立即重排,他的 size() 也会立即减小,在循环过程中容易出错.(拓展:延伸到所有 ...

  8. JavaScript易错点

    JavaScript知识点1.变量作用域   var a = 1;function test() {    var a = 2;     console.log(a); // 2} test();   ...

  9. 【牛客 错题集】Linux系统方面错题合集

    前言:牛客Linux322道全部刷完,有些题目较老,甚至考核5系统,现在7都出来了几年了 = = 还有些题目解析的很好部分也摘录了进来.很多涉及嵌入式开发的选择题同样的摘录的作为了解使用 ------ ...

随机推荐

  1. Laravel 本地化定义

    1.配置本地化语言Laravel 的本地化语言配置项位于config/app.php: [php] view plain copy 'locale' => 'zh',//当前语言 'fallba ...

  2. 连接数据库-stone

    # -*- coding:utf-8 -*- import pymysql class mysql: def __init__(self, host, port, dbuser, dbpwd, dbn ...

  3. 旅游类APP原型模板分享——爱彼迎

    这是一款专为游客提供全球范围内短租服务的APP,可以让你不论出门在外或在家附近都能开展探索之旅,并且还可以获取世界各地独特房源.当地体验及好去处等相关信息. 这款APP层级清晰简明,此原型模板所用到的 ...

  4. servlet填充Response时,数据转换之content-type

    在Http请求中,我们每天都在使用Content-type来指定不同格式的请求信息,但是却很少有人去全面了解content-type中允许的值有多少,这里将讲解Content-Type的可用值. 1. ...

  5. 《Just for Fun》---读后感

    <Just for Fun>本书是Linux之父林纳斯自传,书名的意思是:只是为了好玩.主要是讲了林纳斯的人生经历,以及Linux的诞生过程.Linux从一个终端仿真器到一个世界瞩目的操作 ...

  6. Devexpress VCL Build v2013 vol 14.1.3 发布

    我修,我修,修修修. New Major Features in 14.1 What's New in VCL Products 14.1 Breaking Changes To learn abou ...

  7. 2018.09.30 bzoj4025: 二分图(线段树分治+并查集)

    传送门 线段树分治好题. 这道题实际上有很多不同的做法: cdq分治. lct. - 而我学习了dzyo的线段树分治+并查集写法. 所谓线段树分治就是先把操作分成lognlognlogn个连续不相交的 ...

  8. 2018.09.27 hdu5564Clarke and digits(数位dp+矩阵快速幂)

    传送门 好题啊. 我只会写l,rl,rl,r都很小的情况(然而题上并没有这种数据范围). 但这个dp转移式子可以借鉴. 我们用f[i][j][k]f[i][j][k]f[i][j][k]表示当前在第i ...

  9. 2018.08.22 NOIP模拟 shop(lower_bound+前缀和预处理)

    Shop 有 n 种物品,第 i 种物品的价格为 vi,每天最多购买 xi 个. 有 m 天,第 i 天你有 wi 的钱,你会不停购买能买得起的最贵的物品.你需要求出你每天会购买多少个物品. [输入格 ...

  10. 使用ASI传递post表单..参数是数组

    你可以使用addPostValue方法来发送相同name的多个数据(梦维:服务端会以数组方式呈现): ASIFormDataRequest *request = [ASIFormDataRequest ...