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 相关文章推荐
又一个小巧的图片预加载类
May 05 Javascript
JQuery页面的表格数据的增加与分页的实现
Dec 10 Javascript
javascritp添加url参数将参数加入到url中
Sep 25 Javascript
javascript实现按回车键切换焦点
Feb 09 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
jquery表单插件Autotab使用方法详解
Jun 24 Javascript
js中 计算两个日期间的工作日的简单实例
Aug 08 Javascript
实例讲解JavaScript中call、apply、bind方法的异同
Sep 13 Javascript
通过bootstrap全面学习less
Nov 09 Javascript
关于javascript事件响应的基础语法总结(必看篇)
Dec 26 Javascript
bmob js-sdk 在vue中的使用教程
Jan 21 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
Oct 30 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
用PHP实现Ftp用户的在线管理的代码
2007/03/06 PHP
用PHP实现小写金额转换大写金额的代码(精确到分)
2012/01/10 PHP
利用php绘制饼状图的实现代码
2013/06/07 PHP
phpstorm配置Xdebug进行调试PHP教程
2014/12/01 PHP
ECshop 迁移到 PHP7版本时遇到的兼容性问题
2016/02/15 PHP
JavaScript 字符串乘法
2009/08/20 Javascript
jquery实现盒子下拉效果示例代码
2013/09/12 Javascript
javascript查找字符串中出现最多的字符和次数的小例子
2013/10/29 Javascript
javascript实现uploadify上传格式以及个数限制
2015/11/23 Javascript
分享两段简单的JS代码防止SQL注入
2016/04/12 Javascript
javascript实现不同颜色Tab标签切换效果
2016/04/27 Javascript
全面解析JavaScript里的循环方法之forEach,for-in,for-of
2020/04/20 Javascript
jQuery Select下拉框操作小结(推荐)
2016/07/22 Javascript
JS实现一次性弹窗的方法【刷新后不弹出】
2016/12/26 Javascript
js获取指定时间的前几秒
2017/04/05 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
微信小程序实现分享到朋友圈功能
2018/07/19 Javascript
JavaScript常用工具方法封装
2019/02/12 Javascript
vscode配置vue下的es6规范自动格式化详解
2019/03/20 Javascript
[03:00]2014DOTA2国际邀请赛 Titan淘汰潸然泪下Ohaiyo专访
2014/07/15 DOTA
python关键字and和or用法实例
2015/05/28 Python
python连接数据库的方法
2017/10/19 Python
Python sklearn KFold 生成交叉验证数据集的方法
2018/12/11 Python
Python pycharm 同时加载多个项目的方法
2019/01/17 Python
python实现批量处理将图片粘贴到另一张图片上并保存
2019/12/12 Python
关于Pytorch的MNIST数据集的预处理详解
2020/01/10 Python
python关于倒排列的知识点总结
2020/10/13 Python
python 爬虫之selenium可视化爬虫的实现
2020/12/04 Python
Html5新增标签有哪些
2017/04/13 HTML / CSS
HTML5拖拽文件上传的示例代码
2021/03/04 HTML / CSS
优秀幼教自荐信
2014/02/03 职场文书
公安派出所所长四风问题个人对照检查材料
2014/10/04 职场文书
国际贸易实训报告
2014/11/05 职场文书
爱岗敬业事迹材料
2014/12/24 职场文书
朋友聚会开场白
2015/06/01 职场文书
Python实战之大鱼吃小鱼游戏的实现
2022/04/01 Python