为什么 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. IPEndPoint

    .NET框架用IPEndPoint 对象来表示一个特定的IP地址和端口的组合,应用该对象的场景多是在讲socket绑定到本地地址或者将socket绑定到非本地地址.

  2. word-break:break-all; 和 word-wrap:break-word 换行

    word-break:break-all; 和 word-wrap:break-word;两种写法都是让英文句子在父级宽度不够的情况下换行. 两个属性都同样是让文字换行,但存在着细微的区别,大部分时候 ...

  3. 2018.08.06bzoj1251: 序列终结者(非旋treap)

    传送门 平衡树板子题. 直接fhqtreap打区间标记就行了. 代码: #include<bits/stdc++.h> #define N 50005 using namespace st ...

  4. cordova 选择图片并上传到服务器

    js navigator.camera.getPicture(function(imageURI){ var url=apiUrl+"/upload.aspx"; //alert( ...

  5. Spring MVC之@RequestMapping 传递数组

    1.前台: var param = {titles:['col1','col2','col3']}; $.ajax({url:url, type:"post", data:para ...

  6. derective示例

    1.指令的定义 .directive('haproxySetting', [ function () { return { restrict: 'AEC', scope: { haproxy: '=' ...

  7. HDU 3247 Resource Archiver (AC自动机+BFS+状压DP)

    题意:给定 n 个文本串,m个病毒串,文本串重叠部分可以合并,但合并后不能含有病毒串,问所有文本串合并后最短多长. 析:先把所有的文本串和病毒都插入到AC自动机上,不过标记不一样,可以给病毒标记-1, ...

  8. Event事件冒泡和事件捕获

    <!doctype html> <html lang="en"> <head> <meta charset="gb2312&qu ...

  9. 201709012工作日记--一台电脑创建两个Github账户上传代码

    1. 在一台主机上面使用多个GitHub账号 有时候,我们需要将个人账号和公司账号区分,这时候我们就会需要在一台电脑上使用2个不同的git账号. 2. 上传文件 http://blog.csdn.ne ...

  10. Spring mvc,jQuery和JSON数据交互

    一.实验环境的搭建 1.Spring mvc jar. 导入spring mvc运行所需jar包.导入如下(有多余) 2.json的支持jar 3.加入jQuery. 选用jquery-3.0.0.m ...