原生JS:delete、in、typeof、instanceof、void详解
delete、in、typeof、instanceof、void详解
本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript)
delete 运算符用来删除对象的自有属性.
语法:delete expression
- expression 的计算结果应该是一个对象的属性引用,如果不是一个对象的属性引用,那么,delete不会起任何作用,直接返回true。
- 在严格模式中,如果属性是一个不可配置(non-configurable)属性,删除时会抛出异常,非严格模式下返回 false。其他情况都返回 true。
- delete 操作符与直接释放内存(只能通过解除引用来间接释放)没有关系。可查看内存管理页面。
可以使用 delete 操作符来删除一个隐式声明的全局变量,也就是没有使用 var 定义的全局变量
如果 delete 操作符删除成功,则被删除的属性将从所属的对象上彻底消失。然后,如果该对象的原型链上有一个同名属性,则该对象会从原型链上继承该同名属性
删除属性后,属性将从所属的对象上彻底消失,而删除数组元素后,会在数组内留下一个空洞,读取它的值将为undefined,数组长度不变;
delete无法删除:尝试删除无法删除的属性返回false,若删除成功或删除操作不起作用时均返回true
1、内置核心、客户端属性不能删除;
2、用户通过var语句声明的变量不能删除;
3、通过function语句定义的函数和函数参数也不能删除
4、不可配置的属性无法删除
5、不能删除继承来属性,不过可以从原型上直接删掉它
6、有一个例外:eval内的显示声明的属性可以被删除!eval('var a = 1')
- 在ECMAScript 6中,通过 const 或 let 声明指定的(暂时死区) "temporal dead zone" (TDZ) 对 delete 操作符也会起作用。因此,下面的代码将会抛出 ReferenceError。
function foo(){
delete x;
let x;
}
in:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/in
语法:prop in objectName
- prop 一个字符串类型或者symbol类型的属性名,或者数组索引。
- objectName 需要检测的对象(必须是一个对象,不能是原始类型)比如,可以是一个String包装对象,但不能是一个字符串原始值。
- 它会遍历objectName的所有属性(含继承属性、键为 Symbols 类型的属性)
- 如果你使用 delete 运算符删除了一个属性,则 in 运算符对所删除属性返回 false
- 如果你只是将一个属性的值赋值为 undefined,而没有用 delete 删除它,则 in 运算仍然会返回true。
- 如果一个属性是从原型链上继承来的,in 运算符也会返回 true。
typeof 运算符用来判断给定对象的类型.
语法:typeof operand
- operand 是一个表达式,表示对象或原始值,其类型将被返回。返回一个字符串,指示未经计算的操作数的类型
- operand无论引用的是什么类型的对象,只要带引用,它都返回 "object"
- 在 JavaScript 最初的实现中,JavaScript 中的值是由一个表示类型的标签和实际数据值表示的。对象的类型标签是0。由于 null 代表的是空指针(大多数平台下值为0x00),因此,null的类型标签也成为了0,typeof null就错误的返回了"object"。在ES6中仍然未被修复
- 对正则表达式字面量的类型判断在某些浏览器中不符合标准:
typeof /s/ === 'function'; // Chrome 1-12 , 不符合 ECMAScript 5.1
typeof /s/ === 'object'; // Firefox 5+ , 符合 ECMAScript 5.1
- 在 IE 6, 7 和 8 中,大多数的宿主对象是对象,而不是函数,例如:typeof alert === 'object'
typeof 可能的返回值:
类型 |
结果 |
Undefined |
"undefined" |
Null (引用了空指针) |
"object" (见下方) |
Boolean字面量 |
"boolean" |
Number字面量 |
"number" |
String字面量 |
"string" |
Symbol (ECMAScript 6 新增) |
"symbol" |
宿主对象(由JS环境提供) |
Implementation-dependent |
函数对象 ( [[Call]] 在ECMA-262条款中实现了) |
"function" |
任何其他对象(带引用) |
"object" |
语法:obj instanceof constructor
- instanceof 运算符判断一个对象是否是另一个对象的实例。返回true或false
- instanceof 运算符用来检测 constructor.prototype 是否存在于参数 obj 的原型链上(或者说:检测obj的原型链上是否存在constructor.prototype )
// 判断 foo 是否是 Foo 类的实例 , 并且是否是其父类型的实例
function Aoo(){}
function Foo(){}
Foo.prototype = new Aoo();//JavaScript 原型继承
var foo = new Foo();
console.log(foo instanceof Foo)//true
console.log(foo instanceof Aoo)//true
- 需要注意的是,如果表达式 obj instanceof Foo 返回true,则并不意味着该表达式会永远返回ture,因为Foo.prototype属性的值有可能会改变,改变之后的值很有可能不存在于obj的原型链上,这时原表达式的值就会成为false。
- 另外一种情况下,原表达式的值也会改变,就是改变对象obj的原型链的情况,虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的__proto__魔法属性,是可以实现的。比如执行obj.__proto__ = {}之后,obj instanceof Foo就会返回false了。
它会对给定的表达式进行求值,然后直接返回 undefined。
语法:void expression
- void 运算符通常只用于获取 undefined 的原始值,一般使用 void(0)(等同于 void 0)
- 在使用立即执行的函数表达式时,可以利用 void 运算符让 JavaScript 引擎把一个函数识别成函数表达式而不是函数声明(语句)。效果等同于给整个函数加个'( )'
void function foo() {
var a =1;
var biz = function () {return a;};
biz();
}();
- 当用户点击一个以 javascript: URI 时,浏览器会对冒号后面的代码进行求值,然后把求值的结果显示在页面上,这时页面基本上是一大片空白,这通常不是我们想要的。只有当这段代码的求值结果是 undefined 的时候,浏览器才不会去做这件傻事,所以我们经常会用 void 运算符来实现这个需求。虽然这么做是可行的,但利用 javascript: 伪协议来执行 JavaScript 代码是不推荐的,像下面这样:
<a href="javascript:void(0);">
这个链接点击之后不会做任何事情,如果去掉 void(),
点击之后整个页面会被替换成一个字符 0。
</a>
<a href="javascript:void(document.body.style.backgroundColor='green');">
点击这个链接会让页面背景变成绿色。
</a>
原生JS:delete、in、typeof、instanceof、void详解的更多相关文章
- 原生JS获取元素宽高实践详解
开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...
- 【转】void 详解
void关键字的使用规则: 1. 如果函数没有返回值,那么应声明为void类型: 2. 如果函数无参数,那么应声明其参数为void: 3. 如果函数的参数可以是任意类型指针,那么应声明其参数为void ...
- JS JSOP跨域请求实例详解
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.这篇文章主要介绍了JS JSOP跨域请求实例详解的相关资料,需要的朋友可以参考下 ...
- Net is as typeof 运行运算符详解 net 自定义泛型那点事
Net is as typeof 运行运算符详解 概述 在了解运行运算符的前提我们需要了解什么是RTTI ,在任何一门面向对象的语言中,都有RTTI这个概念(即 运行时). RTTI(Run-Ti ...
- 【面试题】JS第七种数据类型Symbol详解
JS第七种数据类型Symbol详解 点击打开视频讲解更加详细 一.什么是Symbol? Symbol是ES6中引入的一种新的基本数据类型,用于表示一个独一无二的值.它是JavaScript中的第 七种 ...
- 最详尽的 JS 原型与原型链终极详解,没有「可能是」。(一)
最详尽的 JS 原型与原型链终极详解,没有「可能是」.(一) 第二篇已更新,点击进入第三篇已更新,点击进入
- JS中的函数节流throttle详解和优化
JS中的函数节流throttle详解和优化在前端开发中,有时会为页面绑定resize事件,或者为一个页面元素绑定拖拽事件(mousemove),这种事件有一个特点,在一个正常的操作中,有可能在一个短的 ...
- Node.js中环境变量process.env详解
Node.js中环境变量process.env详解process | Node.js API 文档http://nodejs.cn/api/process.html官方解释:process 对象是一个 ...
- 转载 JS组件Bootstrap Select2使用方法详解
JS组件Bootstrap Select2使用方法详解 作者:懒得安分 字体:[增加 减小] 类型:转载 时间:2016-01-26我要评论 这篇文章主要为大家介绍了JS组件Bootstrap Sel ...
随机推荐
- android知识点随笔
android project中Manifest.xml中的<uses-sdk>标签元素决定的. 此标签包含如下3个属性: android:minSdkVersion —— 此属性决定你的 ...
- OpenCASCADE General Transformation
OpenCASCADE General Transformation eryar@163.com Abstract. OpenCASCADE provides a general transforma ...
- Web API接口之Geolocation
0.关于Geolocation Geolocation,地理位置API.用于获取用户的位置信息.它不算是现有的HTML5标准的“直系”成员,但是是W3C的一个标准.它几乎就是一个真正的JavaScri ...
- C语言之通过冒泡排序浅谈编程思想
写这篇博文的目的是想起到抛砖引玉的作用,还请大牛们留下一些先进的思想,让小菜学习一下.下面入正题. 复习C语言怎么能少的了冒泡呢,记得刚学C语言那会,感觉冒泡排序真的太复杂了,理解不大了,嗯!还是当时 ...
- 为什么WebSphere好好的,他就不干活了?
“修理不好用的WebSphere,有时候要看运气.”这个是我接触过很过有历史的运维工程师经常说的一个梗;研发人员也经常说这个程序在我这里运行好好的,怎么到你那就不灵了?问题是你的,你自己解决. 声明一 ...
- objective-c 语法快速过(7)编译器特性ARC
ARC(是编译器特性) ARC是自iOS 5之后增加的新特性,完全消除了手动管理内存的烦琐,编译器会自动在适当的地方插入适当的retain.release.autorelease语句.你不再需要担心内 ...
- ASP.NET的session操作方法总结
在开发ASP.NET程序时,需要对相关数据进行缓存,缓存较多的主要是用户的身份信息,现提供几个对session操作较为常用的方法: 1.添加session,对设置对应的时间: /// <summ ...
- PHP运行及语句
php开发网页需要存放在wamp根目录下的www文件夹中才可运行成功.同时wamp要处于运行状态. 无站点情况下打开方式: 网址栏中输入:localhost/文件名称 代码规范: 用<?php ...
- Angularjs CURD
前言 基于一个手机端的项目使用了angularjs,硬着头皮去用,有很多的疑问还需要一一去验证,刚开始总是感觉找不到北,总是感觉有很多概念,而且似乎ng既夹杂MVC又夹杂MVVM的思想, 忙里偷闲敲了 ...
- HTML中使用javascript解除禁止input输入框代码:
转:表单中Readonly和Disabled的区别 参考资料: disabled和readonly区别: 参考博文1地址:http://blog.csdn.net/symgdwyh/article/d ...