类变量/类方法/实例变量/实例方法
先补充一下以前写过的方法:
在javascript中,所有的方法都有一个call方法和apply方法.这两个方法可以模拟对象调用方法.它的第一个参数是对象,后面的
参数表示对象调用这个方法时的参数(ECMAScript specifies two methods that are defined for all functions, call()
and apply(). These methods allow you to invoke a function as if it were a method of some other object. The first
argument to both call() and apply() is the object on which the function is to be invoked; this argument becomes
the value of the this keyword within the body of the function. Any remaining arguments to call() are the values
that are passed to the function that is invoked).比如我们定义了一个方法f(),然后调用下面的语句:
f.call(o, 1, 2);
作用就相当于
o.m = f;
o.m(1,2);
delete o.m;
举个例子:
-
function
Person(name,age) {
-
this
.name = name;
-
this
.age = age;
-
}
-
var
o =
new
Object();
-
alert(o.name + "_"
+ o.age);
-
-
Person.call(o,"sdcyst"
,18);
-
alert(o.name + "_"
+ o.age);
-
-
Person.apply(o,["name"
,89]);
-
alert(o.name + "_"
+ o.age);
function Person(name,age) { //定义方法
this.name = name;
this.age = age;
}
var o = new Object(); //空对象
alert(o.name + "_" + o.age); //undefined_undefined
Person.call(o,"sdcyst",18); //相当于调用:o.Person("sdcyst",18)
alert(o.name + "_" + o.age); //sdcyst_18
Person.apply(o,["name",89]);//apply方法作用同call,不同之处在于传递参数的形式是用数组来传递
alert(o.name + "_" + o.age); //name_89
---------------------------------
实例变量和实例方法都是通过实例对象加"."操作符然后跟上属性名或方法名来访问的,但是我们也可以为类来设置方法或变量,
这样就可以直接用类名加"."操作符然后跟上属性名或方法名来访问.定义类属性和类方法很简单:
-
Person.counter = 0;
-
function
Person(name,age) {
-
this
.name = name;
-
this
.age = age;
-
Person.counter++;
-
};
-
-
Person.whoIsOlder = function
(p1,p2) {
-
if
(p1.age > p2.age) {
-
return
p1;
-
} else
{
-
return
p2;
-
}
-
}
-
-
var
p1 =
new
Person(
"p1"
,18);
-
var
p2 =
new
Person(
"p2"
,22);
-
-
alert("现在有 "
+ Person.counter +
"个人"
);
-
var
p = Person.whoIsOlder(p1,p2);
-
alert(p.name + "的年龄较大"
);
Person.counter = 0; //定义类变量,创建的Person实例的个数
function Person(name,age) {
this.name = name;
this.age = age;
Person.counter++; //没创建一个实例,类变量counter加1
};
Person.whoIsOlder = function(p1,p2) { //类方法,判断谁的年龄较大
if(p1.age > p2.age) {
return p1;
} else {
return p2;
}
}
var p1 = new Person("p1",18);
var p2 = new Person("p2",22);
alert("现在有 " + Person.counter + "个人"); //现在有2个人
var p = Person.whoIsOlder(p1,p2);
alert(p.name + "的年龄较大"); //p2的年龄较大
prototype属性的应用:
下面这个例子是根据原书改过来的.
假设我们定义了一个Circle类,有一个radius属性和area方法,实现如下:
-
function
Circle(radius) {
-
this
.radius = radius;
-
this
.area =
function
() {
-
return
3.14 *
this
.radius *
this
.radius;
-
}
-
}
-
var
c =
new
Circle(1);
-
alert(c.area());
function Circle(radius) {
this.radius = radius;
this.area = function() {
return 3.14 * this.radius * this.radius;
}
}
var c = new Circle(1);
alert(c.area()); //3.14
假设我们定义了100个Circle类的实例对象,那么每个实例对象都有一个radius属性和area方法,
实际上,除了radius属性,每个Circle类的实例对象的area方法都是一样,这样的话,我们就可以
把area方法抽出来定义在Circle类的prototype属性中,这样所有的实例对象就可以调用这个方法,
从而节省空间.
-
function
Circle(radius) {
-
this
.radius = radius;
-
}
-
Circle.prototype.area = function
() {
-
return
3.14 *
this
.radius *
this
.radius;
-
}
-
var
c =
new
Circle(1);
-
alert(c.area());
function Circle(radius) {
this.radius = radius;
}
Circle.prototype.area = function() {
return 3.14 * this.radius * this.radius;
}
var c = new Circle(1);
alert(c.area()); //3.14
现在,让我们用prototype属性来模拟一下类的继承:首先定义一个Circle类作为父类,然后定义子类
PositionCircle.
-
function
Circle(radius) {
-
this
.radius = radius;
-
}
-
Circle.prototype.area = function
() {
-
return
this
.radius *
this
.radius * 3.14;
-
}
-
-
function
PositionCircle(x,y,radius) {
-
this
.x = x;
-
this
.y = y;
-
Circle.call(this
,radius);
-
-
}
-
PositionCircle.prototype = new
Circle();
-
-
var
pc =
new
PositionCircle(1,2,1);
-
alert(pc.area());
-
-
-
alert(pc.radius);
-
-
-
-
-
-
-
-
alert(pc.constructor);
-
-
-
-
-
PositionCircle.prototype.constructor = PositionCircle
-
alert(pc.constructor);
分享到:
相关推荐
面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的...
本文将深入浅出地讲解JavaScript中的面向对象技术基础,包括对象、数组、函数、类、构造函数以及原型等方面的知识。 首先,让我们来看看对象和数组。在JavaScript中,对象是键值对的集合,这些键通常是字符串,对应...
JavaScript面向对象编程指南
本文介绍了JavaScript面向对象编程的基本概念和技术细节,包括变量和对象的基础用法、函数的作用以及如何通过封装和继承来构建复杂的对象层次结构。JavaScript的独特之处在于它的灵活性和动态性,这使得它成为了一种...
面向对象编程的基础包括类、对象、继承和多态等概念。类是对象的模板或蓝图,定义了一组属性(数据成员)和方法(函数)。对象则是类的实例,具备类所定义的属性和行为。JavaScript虽然没有传统的类定义,但可以通过...
### JavaScript面向对象进阶知识点详解 #### 8.1 面向对象编程的基本特性 在探讨面向对象的JavaScript之前,我们首先需要了解面向对象编程(Object-Oriented Programming, OOP)的基本特性:封装性、抽象性、继承...
总而言之,学习现代JavaScript面向对象编程,有助于开发者在认识这门语言演化的基础上,运用面向对象的设计和编程模式来构建更加健壮和可维护的JavaScript应用程序。同时,测试和调试是保证代码质量不可或缺的环节,...
1. 基础对象创建和属性操作:理解如何创建对象,包括字面量语法和构造函数,以及访问和修改对象的属性。 2. 构造函数与原型链:详细解释构造函数的工作原理,以及如何利用原型实现继承。 3. `new` 关键字的作用:...
《JavaScript面向对象精要》这本书不仅介绍了JavaScript面向对象的基础概念,还深入探讨了其实现机制及其在实际开发中的应用。对于希望提高自己JavaScript技能水平的开发者来说,本书是一本不可多得的好书。通过学习...
本文将详细介绍JavaScript中的面向对象编程概念和技术,包括类定义、对象创建、继承、封装等内容。 #### 二、类定义和对象创建 ##### 2.1 类定义 在JavaScript中,“类”这一概念并不像在Java或C#这样的强类型...
- **现代JavaScript与面向对象编程**:现代JavaScript程序设计中融入了许多新的概念和技术,这些技术让JavaScript应用程序与以往相比有了显著的不同。面向对象编程是现代JavaScript的一个重要组成部分。 #### 二、...
面向对象编程的基础知识及其在JavaScript中的运用;数据类型、操作符以及流程控制语句;函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的...
面向对象编程(Object-Oriented Programming,OOP)是JavaScript中的一个重要概念,它允许开发者以更加模块化、可复用的方式组织代码。下面将详细探讨JavaScript面向对象编程的基本原理、特性以及实际应用。 1. **...
JavaScript,作为一种广泛应用于Web开发的动态脚本语言,最初被设计为简单的客户端脚本语言,但随着技术的发展,它已经发展出了丰富的面向对象编程(OOP)特性。面向对象JavaScript开发是现代Web开发中不可或缺的一...
本文旨在深入解析JavaScript面向对象编程的基础,包括对象的基本概念、类与对象的关系、对象的属性与方法、封装、继承与多态,以及JavaScript中对象的实现方式。 #### 对象的基本概念 面向对象编程的核心在于对...
javascript面向对象编程--传智播客--蔡世友