JavaScript知识点总结(十一)之js中的Object类详解


Posted in Javascript onMay 31, 2016

JavaScript中的Object对象,是JS中所有对象的基类,也就是说JS中的所有对象都是由Object对象衍生的。Object对象主要用于将任意数据封装成对象形式。

一、Object类介绍

Object类是所有JavaScript类的基类(父类),提供了一种创建自定义对象的简单方式,不再需要程序员定义构造函数。

二、Object类主要属性

1.constructor:对象的构造函数。

2.prototype:获得类的prototype对象,static性质。

三、Object类主要方法

1.hasOwnProperty(propertyName)

判断对象是否有某个特定的属性。必须用字符串指定该属性,例如,obj.hasOwnProperty("name"),返回布尔值。此方法无法检查该对象的原型链中是否具有该属性;该属性必须是对象本身的一个成员。

var str ="";
alert("str.hasOwnProperty(\"split\")的结果是:"+str.hasOwnProperty("split")); //return false
alert("String.prototype.hasOwnProperty(\"split\")的结果是:"+String.prototype.hasOwnProperty("split"));//return true

运行结果:

JavaScript知识点总结(十一)之js中的Object类详解

hasOwnProperty的用法不仅仅在此,在Jquery中在编写插件中,少不了的一步,就是初始化参数,其中一个很重要的方法就是$.extend();他的原理就是应用了hasOwnProperty()方法;利用for in 循环遍历对象成员中,有没有相同名称的对象成员,有的话就用这个新的对象成员替换掉旧的,通过这种方式,我们就可以通过修改方法中的参数变化,从而控制程序的流程,而对于那些没有改变的部分,仍使用默认值进行控制,我们自己也可以简单的模拟一下这个extend函数,如下

function extend(target,source){//target 旧的 source新的
for (var i in source){
if(target.hasOwnProperty(i)){
target[i]=source[i];
}
}
return target;
}
var a={"first":,"second":"lyl","third":"bob"};
var b={"third":"leo"};
extend(a,b);
for(var i in a){
alert(a[i]);//原本是bob,现在变成leo了
}

  2.isPrototypeOf(object)

判断该对象是否为另一个对象的原型。

obj1.isPrototypeOf(obj2);

obj1是 一个对象的实例;obj2是另一个将要检查其原型链的对象。原型链可以用来在同一个对象类型的不同实例之间共享功能。如果obj2的原型链中包含 obj1,那么isPrototypeOf 方法返回 true。如果obj2不是一个对象或者obj1没有出现在obj2中的原型链中,isPrototypeOf 方法将返回 false。

<script type="text/javascript">
function foo(){
this.name = 'foo';
}
function bar(){
}
bar.prototype = new foo();
var goo = new bar();
alert(goo.name); //foo
alert(bar.prototype.isPrototypeOf(goo));//true,在bar的原型链中有当前对象goo,则isPrototypeOf方法返回true
</script>

3.propertyIsEnumerable(propertyName)

通过这个方法我们可以检测出这个对象成员是否是可遍历的,如果是可遍历出来的,证明这个对象就是可以利用for in 循环进行遍历的,

格式如下:obj.propertyIsEnumerable(propertyName)

如果 propertyName存在于 obj中且可以使用一个 For…In 循环穷举出来,那么 propertyIsEnumerable 属性返回 true。如果 object 不具有所指定的属性或者所指定的属性不是可列举的,那么 propertyIsEnumerable 属性返回 false。典型地,预定义的属性不是可列举的,而用户定义的属性总是可列举的。

4.toString():返回对象对应的字符串

5.valueOf():返回对象对应的原始类型

以上5个方法都是Object.prototype上定义的,ECMAScript 中的所有对象都由Object继承而来,所以在ECMAScript上的所有对象都具有以几个方法

测试代码1:

var p = new Object(); //通过Object直接创建对象
//为p对象动态添加属性
p.Age=;
p.Name="孤傲苍狼";
//扩展Object类,为Object类添加一个Show方法
Object.prototype.Show=function(){
alert(this.Age+"\t"+this.Name);
}
alert(p.Age);
p.Show();
document.write("<pre>");
document.writeln("p.constructor:"+p.constructor);//得到对象的构造函数
document.writeln("Object.prototype:"+Object.prototype);//得到prototype对象,prototype是静态属性,只能通过"类名.prototype"去访问
document.writeln("p.isPrototypeOf(p):"+p.isPrototypeOf(p));
document.writeln("p.hasOwnProperty(\"Age\"):"+p.hasOwnProperty("Age"));
document.writeln("p.propertyIsEnumerable(\"Age\"):"+p.propertyIsEnumerable("Age"));
document.writeln("p.toString():"+p.toString());
document.writeln("p.valueOf():"+p.valueOf());
document.write("</pre>");

运行结果:

JavaScript知识点总结(十一)之js中的Object类详解

测试代码2:

var Car = function(){};
Car.prototype.hello = function(){
alert("hello car");
};
var car = new Car();
car.f = function() {
alert("自定义方法");
}
document.write("<pre>");
document.writeln("car.hasOwnProperty(\"f\")的结果是:"+car.hasOwnProperty("f"));//ture,car对象有f方法
document.writeln("car.propertyIsEnumerable(\"f\")的结果是:"+car.propertyIsEnumerable("f"));//ture,car对象有f方法,f方法是可以被枚举的
document.writeln("car.hasOwnProperty(\"hello\")"+car.hasOwnProperty("hello")); // false,因为car本身没有hello方法
document.writeln("car.propertyIsEnumerable(\"hello\")的结果是:"+car.propertyIsEnumerable("hello")); // false,没有这个方法当然不能枚举
document.writeln("car.constructor.prototype.hasOwnProperty(\"hello\")的结果是:"+car.constructor.prototype.hasOwnProperty("hello"));// true,car的类Car的原型有hello方法
document.writeln("car.constructor.prototype.propertyIsEnumerable(\"hello\")的结果是:"+car.constructor.prototype.propertyIsEnumerable("hello"));// true, car的类的Car的原型hello方法是可以被枚举的
document.writeln("Car.prototype.hasOwnProperty(\"hello\")的结果是:"+Car.prototype.hasOwnProperty("hello"));// true,car的类Car的原型有hello方法
document.writeln("Car.prototype.propertyIsEnumerable(\"hello\")的结果是:"+Car.prototype.propertyIsEnumerable("hello"));
document.write("</pre>");

运行结果:

JavaScript知识点总结(十一)之js中的Object类详解

以上所述是小编给大家介绍的JavaScript知识点总结(十一)之js中的Object类详解,希望对大家有所帮助

Javascript 相关文章推荐
扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁
Dec 08 Javascript
JS实现标签页效果(配合css)
Apr 03 Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 Javascript
js对象继承之原型链继承实例
Jan 10 Javascript
jquery使用remove()方法删除指定class子元素
Mar 26 Javascript
jquery插件之文字间歇自动向上滚动效果代码
Feb 25 Javascript
AngularJS入门教程之静态模板详解
Aug 18 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
Nov 16 Javascript
激动人心的 Angular HttpClient的源码解析
Jul 10 Javascript
Vue iview-admin框架二级菜单改为三级菜单的方法
Jul 03 Javascript
js使用文档就绪函数动态改变页面内容示例【innerHTML、innerText】
Nov 07 Javascript
OpenLayer3自定义测量控件MeasureTool
Sep 28 Javascript
基于jQuery实现点击列表加载更多效果
May 31 #Javascript
浅谈JavaScript 执行环境、作用域及垃圾回收
May 31 #Javascript
页面get请求 中文参数方法乱码问题的快速解决方法
May 31 #Javascript
Bootstrap表单布局样式代码
May 31 #Javascript
jQuery使用经验小技巧(推荐)
May 31 #Javascript
JavaScript知识点总结(十)之this关键字
May 31 #Javascript
JavaScript知识点总结(六)之JavaScript判断变量数据类型
May 31 #Javascript
You might like
PHP信号量基本用法实例详解
2016/02/12 PHP
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
PHP数据对象映射模式实例分析
2019/03/29 PHP
BOOM vs RR BO3 第二场2.13
2021/03/10 DOTA
jquery validate.js表单验证的基本用法入门
2010/05/13 Javascript
JavaScript 大数据相加的问题
2011/08/03 Javascript
如何获取JQUERY AJAX返回的JSON结果集实现代码
2012/12/10 Javascript
JQuery的$和其它JS发生冲突的快速解决方法
2014/01/24 Javascript
浅析JS中document对象的一些重要属性
2014/03/06 Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
2014/06/04 Javascript
浅谈JS中的三种字符串连接方式及其性能比较
2016/09/02 Javascript
JS实现倒计时(天数、时、分、秒)
2016/11/16 Javascript
全选复选框JavaScript编写小结(附代码)
2017/08/16 Javascript
Angular2 组件交互实例详解
2017/08/24 Javascript
AngularJS实现的省市二级联动功能示例【可对选项实现增删】
2017/10/26 Javascript
微信小程序利用canvas 绘制幸运大转盘功能
2018/07/06 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
JavaScript Blob对象原理及用法详解
2020/10/14 Javascript
Python numpy 常用函数总结
2017/12/07 Python
python 3.6.4 安装配置方法图文教程
2018/09/18 Python
python DataFrame 取差集实例
2019/01/30 Python
python 求1-100之间的奇数或者偶数之和的实例
2019/06/11 Python
详解python解压压缩包的五种方法
2019/07/05 Python
Python封装成可带参数的EXE安装包实例
2019/08/24 Python
Python Pandas 对列/行进行选择,增加,删除操作
2020/05/17 Python
HTML5 表单验证失败的提示语问题
2017/07/13 HTML / CSS
柏林通行证:Berlin Pass
2018/04/11 全球购物
HQhair美国/加拿大:英国化妆品、美容及美发产品商城
2019/04/15 全球购物
宿舍违规检讨书
2014/01/12 职场文书
群众路线班子对照检查材料
2014/09/25 职场文书
2014教师年度思想工作总结
2014/11/10 职场文书
专家推荐信怎么写
2015/03/25 职场文书
2015年科室工作总结
2015/04/10 职场文书
如何拟写通知正文?
2019/04/02 职场文书
CSS3 制作的悬停缩放特效
2021/04/13 HTML / CSS
Windows Server 2016 配置 IIS 的详细步骤
2022/04/28 Servers