欢迎来到站长教程网!

JavaScript

当前位置:主页 > 网页制作 > JavaScript >

JavaScript 面向对象程序设计详解【类的创建、实例

时间:2020-05-22|栏目:JavaScript|点击:

本文实例讲述了JavaScript 面向对象程序设计。分享给大家供大家参考,具体如下:

类的创建于实例对象 工厂模型创建对象

function CreatePerson ( name,sex,age ) { var obj = new Object(); obj.name = name; obj.sex = sex; obj.age = age; obj.sayName = function () { console.log( this.name ); } return obj; } var p1 = CreatePerson('zf','女',22); p1.sayName(); //zf console.log( p1.name ); //zf

构造函数式

//函数的第一个字母大写(类的模板) function Person ( name,age,sex ) { this.name = name; this.age = age; this.sex =sex; this.sayName = function () { alert(this.name); } } //构造一个对象, 使用new关键字, 传递参数, 执行模板代码, 返回对象。 var p1 = new Person('zf',20,'女'); //类的概念:根据模板创建出不同的实例对象 console.log( p1.name ); p1.sayName();

创建类的实例:

当作构造函数去使用

var p1 = new Person('a1',20);

作为普通函数去调用

Person('a2',20); //在全局环境中定义属性并赋值, 直接定义在window上。

在另个一对象的作用域中调用

var o = new Object();
Person.call(o,'a3',23);

Object每个实例都会具有的属性和方法:

Constructor: 保存着用于创建当前对象的函数。(构造函数)
hasOwnProperty(propertyName):用于检测给定的属性在当前对象实例中(而不是原型中)是否存在。
isPrototypeOf(Object): 用于检查传入的对象是否是另外一个对象的原型。
propertyIsEnumerable(propertyName):用于检查给定的属性是否能够使用for-in语句来枚举。
toLocaleString():返回对象的字符串表示。该字符串与执行环境的地区对应.
toString():返回对象的字符串表示。
valueOf():返回对象的字符串、数值或布尔表示。

判断一个对象是不是另一个对象的实例,通常使用的是 instanceof. 比较少使用constructor。

原型

创建每一个函数的时候,都有一个prototype属性. 这个是属性,是一个指针。而这个对象总是指向一个对象。
这个对象 的用途就是将特定的属性和方法包含在内,是一个实例对象, 起到了一个所有实例所共享的作用。
屏蔽了,构造函数的缺点,new 一个对象,就把构造函数内的方法实例化一次。

function Person () { } var obj = Person.prototype; console.log( obj ); //Person.prototype 就是一个对象 //Person.prototype 内部存在指针,指针指向一个对象。 这个对象称之为:原型对象。原型对象,被所有的实例对象所共享。 console.log( obj.constructor ); //function Person(){} //obj这个对象的构造器就是 Person

原型图例:

JavaScript 面向对象程序设计详解【类的创建、实例

console.log(Person.prototype) 的结果:

JavaScript 面向对象程序设计详解【类的创建、实例

常用方法 Object.getPrototypeOf()

根据实例对象获得原型对象

每次代码读取一个对象的属性的时候:首先会进行一次搜索,搜索实例对象里,看看是否存在,如果没有,再去实例所对的原型中寻找属性.如果有则返回,如果两次都没有则返回undefined

function Person () { } Person.prototype.name = 'z1'; Person.prototype.age = 20; Person.prototype.sayName = function () { console.log( '我是原型对象方法' ); } var p1 = new Person(); console.log( p1.name ); //z1 console.log( Object.getPrototypeOf(p1) ); console.log( Object.getPrototypeOf(p1) == Person.prototype ); //true

hasOwnProperty()

判断是否是 实例对象自己的属性

function Person () { } Person.prototype.name = 'z1'; Person.prototype.age = 20; Person.prototype.sayName = function () { console.log( '我是原型对象方法' ); } // 判断一个对象属性 是属于 原型属性 还是属性 实例属性 var p3 = new Person(); console.log( p3.name ); //zf 是原型上的 //hasOwnProperty() 是否是 实例对象自己的属性 console.log( p3.hasOwnProperty('name') ); //false

in 操作符

无论是 原型的属性, 还是实例对象的属性, 都区分不开。 如果存在,返回true

function Person () { } Person.prototype.name = 'z1'; Person.prototype.age = 20; Person.prototype.sayName = function () { console.log( '我是原型对象方法' ); } //判断属性是否存在 实例对象 和 原型对象中. var p1 = new Person(); console.log('name' in p1); //true //表示,name的属性到底在不在p1的属性中 true var p2 = new Person(); p1.name = 'zzz'; console.log('name' in p1); //true

判断一个属性是否在原型中

function Person () { } Person.prototype.name = 'z1'; Person.prototype.age = 20; Person.prototype.sayName = function () { console.log( '我是原型对象方法' ); } //判断属性是否存在 实例对象 和 原型对象中. var p1 = new Person(); p1.name = '123'; //在原型对象中,是否存在这个值 //@obj 当前对象 //@判断的属性 function hasPrototypeProtoperty ( obj,attrName ) { return !obj.hasOwnProperty(attrName) && (attrName in obj); } console.log( hasPrototypeProtoperty(p1,'name') ); //false

Object.keys()

上一篇:JavaScript进阶(四)原型与原型链用法实例分析

栏    目:JavaScript

下一篇:VSCode搭建React Native环境

本文标题:JavaScript 面向对象程序设计详解【类的创建、实例

本文地址:http://www.blue1000.com/wangyezhizuo/JavaScript/1361.html

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:1961407250 | 邮箱:1961407250#qq.com(#换成@)

Copyright © 2002-2022 BK网络学院版权所有 Power by DedeCms 粤ICP备19027147号-7