JavaScript中一些怪异用法的理解
引言
JavaScript这门语言有些场合的用法还是比较怪异的。这篇文章会尽量将这门语言特有的一些比较特殊的用法收集在一起。就当是平时开发时需要注意的地方吧。
特殊用法收集
1、!!用法
在JavaScript中经常看到判断一个对象是否有某一个属性或者在进行客户端检测的时候会出现!!这个用法。相信大家都看到过var isIE=!!document.all这样的代码把。那为什么需要使用!!呢?
!!作用就在于:如果明确设置了对象中属性的值(非 null/undefined/0/""等值),那么使用!!就可以将该对象中的属性转化为Boolean类型,并且返回true。如果是null/undefined/0/""等值那么使用!!就是返回false。所以!!的使用是将属性或者方法强制转化成Boolean类型。
2、JavaScript中==和===的差异
A、对于string,number等基础类型,==和===是有区别的。
不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,===如果类型不同,其结果就是不等。
B、对于Array,Object等高级类型,==和===是没有区别的
进行“指针地址”比较
C、基础类型与高级类型,==和===是有区别的
对于==,将高级转化为基础类型,进行“值”比较(高级类型典型的如调用toString()后在进行比较)
因为类型不同,===结果为false
3、typeof 操作符和instanceof 操作符
确定一个值是哪一种基本类型可以使用typeof 操作符。确定一个值是哪一种引用类型可以使用instanceof操作符。这些操作符在后续的浏览器特性检测方面很有用。
我在看Mustache.js源代码的时候发现判断一个对象是否是Array有如下的方式。
var objectToString = Object.prototype.toString;
var isArray = Array.isArray || function isArrayPolyfill(object) {
return objectToString.call(object) === '[object Array]';
};
我们知道在判断引用类型的时候我们可以使用instanceof操作符,但是在一些特殊情况下,可能会出现问题。例如:
注意点!
使用instaceof和construcor,被判断的array必须是在当前页面声明的!比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array == object.constructor;会返回false;
原因:
1、array属于引用型数据,在传递过程中,仅仅是引用地址的传递。
2、每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array,所对应的构造函数,是子页面的Array对象;父页面来进行判断,使用的Array并不等于子页面的Array;切记,不然很难跟踪问题!
而通过使用toString.call()方法,我们可以避免一些问题。我们来看ECMA 对Object.prototype.toString的解释。
When the toString method is called, the following steps are taken:
1.If the this value is undefined, return "[object Undefined]".
2.If the this value is null, return "[object Null]".
3.Let O be the result of calling ToObject passing the this value as the argument.
4.Let class be the value of the [[Class]] internal property of O.
5.Return the String value that is the result of concatenating the three Strings "[object ", class, and "]".
地址:http://www.ecma-international.org/ecma-262/5.1/#sec-15.2.4.2
下面我们举例来看这方面的内容。请看下面的例子:
var oP = Object.prototype,
toString = oP.toString; console.log(toString.call([123]));//[object Array]
console.log(toString.call('123'));//[object String]
console.log(toString.call({a: '123'}));//[object Object]
console.log(toString.call(/123/));//[object RegExp]
console.log(toString.call(123));//[object Number]
console.log(toString.call(undefined));//[object Undefined]
console.log(toString.call(null));//[object Null]
//....
JavaScript中一些怪异用法的理解的更多相关文章
- JavaScript中this的用法 及 如何改变this的指向
要懂得JavaScript中this的用法,首先需要知道,JavaScript中的作用域相关知识. var fun = function(){ var flag = 1; console.log(fl ...
- JavaScript中return的用法详解
JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 t ...
- javascript中 try catch用法
javascript中 try catch用法 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2015-08-16我要评论 JS try catch语句一般在什么情况下使用?是必须使 ...
- 从函数调用的角度,探讨JavaScript中this的用法
js函数调用方式大概可分为:函数调用,构造器调用,call或apply,方法调用四种方式.下面结合一些基础概念和实测代码,从函数调用的角度,探讨JavaScript中this的用法. 1. new对函 ...
- JavaScript中this的用法详解
JavaScript中this的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 thi ...
- JavaScript中call、apply个人理解
JavaScript中call.apply个人理解 一句话即通俗的说:call.apply 是为了改变this的状态而存在的 }; } function personInfo(name,age){ t ...
- 在HTML页面中实时获取新消息的方法 “JavaScript中的setInterval用法”
JavaScript中的setInterval用法(资料来源:博主---八神吻你 ) setInterval动作的作用是在播放动画的时,每隔一定时间就调用函数,方法或对象.可以使用本动作更新来自数 ...
- JavaScript 中 this 的用法
在 JavaScript 中,this 是动态绑定,或称为运行期绑定的.一般而言,在Javascript中,this 指向函数执行时的当前对象. 由于其运行期绑定的特性,JavaScript 中的 t ...
- javascript中string的用法总结
javascript中很经常的会用到string类型的变量,对此,总结了几种常用操作或者方法:创建.拼接.子串.大小写转换.判断字符串相等.字符串查找等几种.下面将一一简单描述. 一.js中strin ...
随机推荐
- Win7下完全卸载Oracle 11g的步骤
1 右击“计算机”-->管理-->服务和应用程序-->服务,停掉所有Oracle相关的服务(以Oracle打头的,比如OracleDBConsoleorcl). 2 开始--> ...
- js-JavaScript高级程序设计学习笔记3
第五章 引用类型 1.使用new操作符和Date构造函数创建日期对象. 2.创建特定日期有两个方法--Date.parse()和Date.UTC().后者小时数为0时显示时间是8点,应该是因为本地是东 ...
- JavaWeb学习总结-09 JDBC 学习和使用
一 JDBC相关概念介绍 1.1 数据库驱动 这里的驱动的概念和平时听到的那种驱动的概念是一样的,比如平时购买的声卡,网卡直接插到计算机上面是不能用的,必须要安装相应的驱动程序之后才能够使用声卡和网卡 ...
- React Native 开发之 (06) JSX
一 React 1 React定义 React的GitHub地址是 https://github.com/facebook/react.它的官方介绍是 A JavaScript Library for ...
- 【转载】Linux 与 BSD 有什么不同?
原创:Linux中国 https://linux.cn/article-3186-1.html 原创:LCTT https://linux.cn/article-3186-1.html 本文地址:ht ...
- BZOJ3282: Tree
传送门 又是权限题= =,过了NOIp我就要去当一只权限狗! LCT裸题,get到了两个小姿势. 1.LCA操作应该在access中随时updata 2.Link操作可以更简单 void Link(i ...
- Struts2(一)入门及工作原理
Apache Struts 2 是一种流行的 Java模型 - 视图 - 控制器(MVC)框架,成功地结合了 WebWork和Struts1.x 两种 web 框架. Apache Struts2与S ...
- SSH(Struts Spring Hibernate开发框架)
Spring(Model) Spring的核心思想是IoC和AOP,Spring使得管理对象更加方便,极大的降低组件之间的耦合度,实现了软件各层之间的解耦. Struts(View) 使用Struts ...
- 【原】redux异步操作学习笔记
摘要: 发觉在学习react的生态链中,react+react-router+webpack+es6+fetch等等这些都基本搞懂的差不多了,可以应用到实战当中,唯独这个redux还不能,学习redu ...
- eclipse的一些常见操作
调整字体大小:Window-Preferences-General-Appearance-Colors and Fonts-Basic-Text Font