javascript 易错知识点实例小结


Posted in Javascript onApril 25, 2020

本文实例总结了javascript 易错知识点。分享给大家供大家参考,具体如下:

为什么 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(..) 。这样做唯一的缺点就是需要创建一个新对象然后把旧对象抛弃掉,不能直接修改已有的默认对象。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Javascript selection的兼容性写法介绍
Dec 20 Javascript
jQuery对JSON数据进行排序输出的方法
Jun 24 Javascript
深入浅析同源策略和跨域访问
Nov 26 Javascript
JavaScript常用代码书写规范的超全面总结
Sep 11 Javascript
用js实现博客打赏功能
Oct 24 Javascript
javascript中神奇的 Date对象小结
Oct 12 Javascript
关于ES6箭头函数中的this问题
Feb 27 Javascript
vue 做移动端微信公众号采坑经验记录
Apr 26 Javascript
Angular4 反向代理Details实践
May 30 Javascript
微信小程序的mpvue框架快速上手指南
May 15 Javascript
layui递归实现动态左侧菜单
Jul 26 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
Aug 06 Javascript
javascript执行上下文、变量对象实例分析
Apr 25 #Javascript
JavaScript ECMA-262-3 深入解析(二):变量对象实例详解
Apr 25 #Javascript
JavaScript ECMA-262-3 深入解析(一):执行上下文实例分析
Apr 25 #Javascript
使用 Jest 和 Supertest 进行接口端点测试实例详解
Apr 25 #Javascript
javascript 函数的暂停和恢复实例详解
Apr 25 #Javascript
详解ES6 CLASS在微信小程序中的应用实例
Apr 24 #Javascript
Vue中函数防抖节流的理解及应用实现
Apr 24 #Javascript
You might like
资料注册后发信小技巧
2006/10/09 PHP
php在多维数组中根据键名快速查询其父键以及父键值的代码
2011/05/07 PHP
PHP的5个安全措施小结
2012/07/17 PHP
php实现多维数组中每个单元值(数字)翻倍的方法
2015/02/16 PHP
PHP实现文件上传与下载实例与总结
2016/03/13 PHP
Yii框架中用response保存cookie,用request读取cookie的原理解析
2019/09/04 PHP
PHP+Redis事务解决高并发下商品超卖问题(推荐)
2020/08/03 PHP
Google官方支持的NodeJS访问API,提供后台登录授权
2014/07/29 NodeJs
利用Javascript仿Excel的数据透视分析功能
2016/09/07 Javascript
javascript cookie基础应用之记录用户名的方法
2016/09/20 Javascript
如何编写jquery插件
2017/03/29 jQuery
ES6中Array.find()和findIndex()函数的用法详解
2017/09/16 Javascript
vue.js实现三级菜单效果
2019/10/19 Javascript
10分钟学会js处理json的常用方法
2020/12/06 Javascript
jquery实现拖拽小方块效果
2020/12/10 jQuery
python实现在每个独立进程中运行一个函数的方法
2015/04/23 Python
Python标准库defaultdict模块使用示例
2015/04/28 Python
Python基于Tkinter的HelloWorld入门实例
2015/06/17 Python
windows下python安装paramiko模块和pycrypto模块(简单三步)
2017/07/06 Python
python中requests爬去网页内容出现乱码问题解决方法介绍
2017/10/25 Python
PyQT实现多窗口切换
2018/04/20 Python
Python Grid使用和布局详解
2018/06/30 Python
Django框架模板语言实例小结【变量,标签,过滤器,继承,html转义】
2019/05/23 Python
python读取并写入mat文件的方法
2019/07/12 Python
在django中自定义字段Field详解
2019/12/03 Python
基于Tensorflow批量数据的输入实现方式
2020/02/05 Python
Python猜数字算法题详解
2020/03/01 Python
django配置app中的静态文件步骤
2020/03/27 Python
TCP/IP中的TCP和IP分别承担什么责任
2012/04/21 面试题
公司总经理岗位职责
2014/03/15 职场文书
个人委托书怎么写
2014/04/04 职场文书
2015年双拥工作总结
2015/04/08 职场文书
高中英语教学反思范文
2016/03/02 职场文书
话题作文之呼唤
2019/12/18 职场文书
Golang Gob编码(gob包的使用详解)
2021/05/07 Golang
Python实现批量自动整理文件
2022/03/16 Python