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 select操作的日期联动实现代码
Dec 06 Javascript
window.addEventListener来解决让一个js事件执行多个函数
Dec 26 Javascript
JS网页图片按比例自适应缩放实现方法
Jan 15 Javascript
jQuery实现的输入框选择时间插件用法实例
Feb 28 Javascript
jQuery 1.9.1源码分析系列(十五)动画处理之缓动动画核心Tween
Dec 03 Javascript
原生JS实现平滑回到顶部组件
Mar 16 Javascript
深入解析JavaScript中函数的Currying柯里化
Mar 19 Javascript
JS中Attr的用法详解
Oct 09 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
解决vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效问题
Aug 24 Javascript
layuiAdmin循环遍历展示商品图片列表的方法
Sep 16 Javascript
Vue实现一种简单的无限循环滚动动画的示例
Jan 10 Vue.js
基于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
常用星际术语索引(新手指南)
2020/03/04 星际争霸
PHP+apc+ajax实现的ajax_upload上传进度条代码
2016/01/25 PHP
Yii2 ActiveRecord多表关联及多表关联搜索的实现
2016/06/30 PHP
php array_values 返回数组的所有值详解及实例
2016/11/12 PHP
详解PHP的抽象类和抽象方法以及接口总结
2019/03/15 PHP
PHP实现简单的计算器
2020/08/28 PHP
PHP rsa加密解密算法原理解析
2020/12/09 PHP
actionscript与javascript的区别
2011/05/25 Javascript
在jQuery中使用$而避免跟其它库产生冲突的方法
2015/08/13 Javascript
JavaScript实现的多种鼠标拖放效果
2015/11/03 Javascript
正则表达式优化JSON字符串的技巧
2015/12/24 Javascript
jquery按回车键实现表单提交的简单实例
2016/05/25 Javascript
关于Jquery中的事件绑定总结
2016/10/26 Javascript
走进AngularJs之过滤器(filter)详解
2017/02/17 Javascript
javascript html5轻松实现拖动功能
2017/03/01 Javascript
微信小程序 支付功能(前端)的实现
2017/05/24 Javascript
Angularjs 双向绑定时字符串的转换成数字类型的问题
2017/06/12 Javascript
webpack实现热更新(实施同步刷新)
2017/07/28 Javascript
jQuery创建及操作xml格式数据示例
2018/05/26 jQuery
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
详解javascript设计模式三:代理模式
2019/03/25 Javascript
详解Vue依赖收集引发的问题
2019/04/22 Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
2019/05/13 Javascript
layui多图上传实现删除功能的例子
2019/09/23 Javascript
vue路由切换之淡入淡出的简单实现
2019/10/31 Javascript
Python实现定期检查源目录与备份目录的差异并进行备份功能示例
2019/02/27 Python
Python判断两个文件是否相同与两个文本进行相同项筛选的方法
2019/03/01 Python
Django静态文件加载失败解决方案
2020/08/26 Python
CSS书写规范、顺序和命名规则
2014/03/06 HTML / CSS
英国鲜花速递:Serenata Flowers
2018/04/03 全球购物
优秀大学生推荐信范文
2013/11/28 职场文书
银行贷款承诺书
2014/03/29 职场文书
2014中考励志标语
2014/06/05 职场文书
2016年元旦寄语
2015/08/17 职场文书
2019年市场部个人述职报告(三篇)
2019/10/23 职场文书
Golang生成Excel文档的方法步骤
2021/06/09 Golang