JavaScript 面向对象编程(四)的常用方法、属性总结
面向对象的属性、方法、操作符总结,都是干货。想深入掌握面向对象的程序设计模式,必须掌握一下知识点。下列知识点注重于实现,原理还请借鉴《javascript高级程序设计》 (基于javascript高级程序设计,总结出来的实用,常用方法属性和操作符)
1、标识构造函数对象实例的类型(构造函数的属性和操作符)
对象实例.constructor == 构造函数对象
在前面例子的最后,person1 和 person2 分别保存着 Person 的一个不同的实例。这两个对象都有一个 constructor(构造函数)属性,该属性指向 Person,如下所示。
1 alert(person1.constructor == Person); //true
2 alert(person2.constructor == Person); //true
对象实例 instanceof 对象
提到检测对象类型 instanceof 操作符更可靠,我们创建的所有对象既是object实例也是构造函数的实例。可以使用instanceof来验证
1 alert(person1 instanceof Object); //true
2 alert(person1 instanceof Person); //true
3 alert(person2 instanceof Object); //true
4 alert(person2 instanceof Person); //true
创建自定义的构造函数意味着将来可以将它的实例标识为一种特定的类型;而这正是构造函数模式胜过工厂模式的地方。验证new操作符的实例对象和传统object创建方式的类型归属:
var obj = {
name:'s',
age:'s',
sex:'男'
}
alert(obj instanceof Object); // true
alert(obj instanceof Person); // false
//字面量方式创建的对象obj只属于object,并不属于其他对象,更没有办法让他具有特定类型。对比看来是不是构造函数的方式好的很多。
2、原型的方法:
function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
a、isPrototypeOf 用来确定实例person1/2是否指向了构造函数Person.prototype(原型对象) (这个指针就是__proto__ 或 [[Prototype]])-->隐士的存在
Person.prototype.isPrototypeOf(person1) //true
Person.prototype.isPrototypeOf(person2) //true
b、Object.getPrototypeOf() 返回 __proto__ 或 [[Prototype]] 的指向
Object.getPrototypeOf(person1) // Person.prototype
Object.getPrototypeOf(person1).name // Nicholas
c、person1.hasOwnProperty("name") 检测一个属性是存在于实例中,还是存在于原型中. 只在给定属性存在于对象实例中时,才会返回true
alert(person1.hasOwnProperty("name")); //false
person1.name = "Greg";
alert(person1.name); //"Greg"——来自实例
alert(person1.hasOwnProperty("name")); //true
alert(person2.name); //"Nicholas"——来自原型
alert(person2.hasOwnProperty("name")); //false
delete person1.name;
alert(person1.name); //"Nicholas"——来自原型
alert(person1.hasOwnProperty("name")); //false
注意:调用person1.hasOwnProperty( "name")时,只有当person1 重写name 属性后才会返回true,因为只有这时候name 才是一个实例属性,而非原型属性。
3、原型与in操作符
in:检测对象中是否有指定属性。in 操作符会在通过对象能够访问给定属性时返回 true,无论该属性存在于实例中还是原型中。
function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
alert(person1.hasOwnProperty("name")); //false
alert("name" in person1); //true
person1.name = "Greg";
alert(person1.name); //"Greg" ——来自实例
alert(person1.hasOwnProperty("name")); //true
alert("name" in person1); //true
alert(person2.name); //"Nicholas" ——来自原型
alert(person2.hasOwnProperty("name")); //false
alert("name" in person2); //true
delete person1.name;
alert(person1.name); //"Nicholas" ——来自原型
alert(person1.hasOwnProperty("name")); //false
alert("name" in person1); //true
注意:以上name属性,有在原型上的,有在对象上的。所以 "name" in person1 始终都返回 true。
同时使用 hasOwnProperty()方法和 in 操作符,就可以确定该属性到底是存在于对象中,还是存在于原型中。如下所示:
function hasPrototypeProperty(object, name) {
return !object.hasOwnProperty(name) && (name in object)
}
//name in object 只要存在于实例中或者原型上就返回 true
//如果object.hasOwnProperty(name)返回flase证明不存在于实例上,取反返回true。
注意:只要 in 操作符返回 true 而 hasOwnProperty()返回 false,就可以确定属性是原型中的属性。
下面看看自定义函数hasPrototypeProperty()的用法:
var person = new Person();
alert(hasPrototypeProperty(person, "name")); //true
person.name = "Greg";
alert(hasPrototypeProperty(person, "name")); //false
注意:
name 属性先是存在于原型中,因此 hasPrototypeProperty()返回 true。
当在实例中重写 name 属性后,该属性就存在于实例中了,因此 hasPrototypeProperty()返回 false。
4、Object.keys()方法
用来获得对象上可枚举的实例属性。接收一个对象作为参数,返回包含所有可枚举属性的字符串数组。
a、获得可枚举的属性
function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
var keys = Object.keys(Person.prototype);
alert(keys); //"name,age,job,sayName"
var p1 = new Person();
p1.name = "Rob";
p1.age = 31;
var p1keys = Object.keys(p1);
alert(p1keys); //"name,age"
keys方法可以获得所有可枚举属性的集合,使用for..in..也可以循环得出可枚举的属性。
可枚举属性:通俗的讲,我们自定义在实例或者原型上的属性是可枚举属性。拿原型举例子,实例化构造函数的实例下指向的原型有一个constructor就是实例的不可枚举属性。因为(枚举) enumerable为false。
不可枚举属性:就是enumerable为false的属性,使用for..in../Object.keys()/JSON.stringfy()都无法获取到。那么如何可枚举和不可枚举属性都获取到,如下:
b、获得所有可枚举属性和不可枚举属性的集合
Object.getOwnPropertyNames()
var keys = Object.getOwnPropertyNames(Person.prototype);
alert(keys); //"constructor,name,age,job,sayName"
注意:结果中包含了不可枚举的 constructor 属性。Object.keys()和 Object.getOwnPropertyNames()方法都可以用来替代 for-in 循环。支持这两个方法的浏览器有 IE9+、Firefox 4+、Safari 5+、Opera 12+和 Chrome
注意结果中包含了不可枚举的 constructor 属性。Object.keys()和 Object.getOwnPropertyNames()方法都可以用来替代 for-in 循环。支持这两个方法的浏览器有 IE9+、Firefox 4+、Safari 5+、Opera 12+和 Chrome
JavaScript 面向对象编程(四)的常用方法、属性总结的更多相关文章
- JavaScript面向对象编程学习笔记
1 Javascript 面向对象编程 所谓"构造函数",其实就是一个普通函数,但是内部使用了this变量.对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例 ...
- 深入理解Javascript面向对象编程
深入理解Javascript面向对象编程 阅读目录 一:理解构造函数原型(prototype)机制 二:理解原型域链的概念 三:理解原型继承机制 四:理解使用类继承(继承的更好的方案) 五:建议使用封 ...
- 【转】Javascript 面向对象编程(一):封装
原文链接:http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_encapsulation.html Javascript ...
- Javascript 面向对象编程(一):封装 by 阮一峰
<Javascript高级程序设计(第二版)>(Professional JavaScript for Web Developers, 2nd Edition) 它们都是非常优秀的Java ...
- 转:javascript面向对象编程
作者: 阮一峰 日期: 2010年5月17日 学习Javascript,最难的地方是什么? 我觉得,Object(对象)最难.因为Javascript的Object模型很独特,和其他语言都不一样,初学 ...
- 探讨javascript面向对象编程
(个人blog迁移文章.) 前言: 下面将探讨javascript面向对象编程的知识. 请不要刻意把javascript想成面向对象编程是理所当然的. javascript里面,对象思想不可少,但是不 ...
- 《JavaScript面向对象编程指南(第2版)》读书笔记(一)
目录 一.对象 1.1 获取属性值的方式 1.2 获取动态生成的属性的值 二.数组 2.1 检测是否为数组 2.2 增加数组长度导致未赋值的位置为undefined 2.3 用闭包实现简易迭代器 三. ...
- (三)Javascript面向对象编程:非构造函数的继承
Javascript面向对象编程:非构造函数的继承 这个系列的第一部分介绍了"封装",第二部分介绍了使用构造函数实现"继承". 今天是最后一个部分,介绍不使 ...
- (二)Javascript面向对象编程:构造函数的继承
Javascript面向对象编程:构造函数的继承 这个系列的第一部分,主要介绍了如何"封装"数据和方法,以及如何从原型对象生成实例. 今天要介绍的是,对象之间的"继承 ...
- (一)Javascript 面向对象编程:封装
Javascript 面向对象编程:封装 作者:阮一峰 Javascript是一种基于对象(object-based)的语言,你遇到的所有东西几乎都是对象.但是,它又不是一种真正的面向对象编程(OOP ...
随机推荐
- Java中filter内处理重定向遇到的问题
这是在Java中filter内处理重定向遇到的问题.本意是写一个做URL rewrite 的filter,来重写URL,同时在处理登陆过程中要杀掉当前session,创建新session来代替. 1. ...
- 动态规划算法解析网页中的内容 JavaScript
function getInfo(html){ //去掉注释 html=html.replace(/<!--.+?-->/g,"") var arrP=[] var r ...
- Django ORM常用字段和参数
常用字段 AutoField int自增列,必须填入参数 primary_key=True.当model中如果没有自增列,则自动会创建一个列名为id的列. IntegerField 一个整数类型,范围 ...
- Python入门书的读书笔记
入门书地址 三引号 (""" 或 ''') 来指定多行字符串字符串是不可变的输出小数点后三位 print('{0:.3f}'.format(1 / 3))输出字符串长度为 ...
- PIE SDK与Matlab结合说明文档
1.功能简介 Matlab是三大数学软件之一,它在数学类科技应用软件中在数值计算方面首屈一指.Matlab可以进行矩阵运算.绘制函数和数据.实现算法.创建用户界面.连接其他编程语言的程序等,主要应用于 ...
- python学习8-闭包、迭代器(转载)
一.第一类对象: 函数名是一个变量,可以当普通变量使用,但它又是一个特殊的变量,与括号配合可以执行函数. 函数名的运用 1.单独打印是一个内存地址 2.可以给其他变量赋值 3.可以作为容器类变量的元素 ...
- 算法市场 Algorithmia
算法市场 官网:(需要***,fan qiang,不然可能访问不了或登录不了) https://algorithmia.com/ 官方的例子: 我不用 curl 发请求,把 curl 命令粘贴给你们用 ...
- 问题记录——java.lang.IllegalArgumentException: Illegal character in scheme name at index 0
以下http请求报错是因为,请求的地址前面有个空格.... 2019-01-09 03:30:23,154 ERROR [business.modules.merchantreportresult.s ...
- CentOS 6.7 安装配置 nagios-server
作者博文地址:https://www.cnblogs.com/liu-shuai/ 一.简介 Nagios是一款开源的免费网络监视工具,能有效监控Windows.Linux和Unix的主机状态, ...
- 新手 php连接数据库大概。简单过程浅析以及遇到的问题分析
原文作者:aircraft 原文地址: https://www.cnblogs.com/DOMLX/p/8116845.html 重点:PHP运行在服务器上的请记住!!! 1.在连接数据库与PHP之前 ...