function在javascript中用来创建函数或方法，但要想实现面向对象方式的编程，类是不可或缺的角色之一，而且是主角。但javascript中并没有类概念，所谓的类也是模拟而来，通过函数加闭包模拟出类成员及私有成员(关于闭包可以参见跨越边界: 闭包)。这里我们将用比较平实的方式来了解一下javascript中的”类”，避开一些生硬的原理。
既然是用function来模拟类，所以编写代码创建类的关键字还是function。我们创建一个座标点类。
function Point() {
this.X = 0;
this.Y = 0;
};
var zeroPoint = new Point();
alert("当前座标值( X:" + zeroPoint.X + " , Y:" + zeroPoint.Y + " )");
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
大家都知道非静态类成员的访问需要通过对象来完成，所以先new出了一个Point类型对象，再通过该对象完成X和Y轴座标值的访问。从语法上来说，javascript类对象的创建过程和C#等差不多，但实现机制却不相同。这里的new创建出了一个Object，后续的Point()函数执行时将其this指向了这个新的Object对象。Point中的this.X和this.Y是Point类的两个公共成员，所以Point的对象可以直接对它们进行访问。
说到类成员或对象的成员，免不了要提到可访问性的问题。在javascript的类中，也有public成员和private成员之分，但究其细节却不尽相同。javascript私有成员也是些在类外部不可以通过对象进行操作的成员，其实在类的内部成员之间私有成员也不定能被访问。在类的内部一般只有私有成员和私有成员之间可以互相的访问，你可以认为其它成员权限不够不能操作这些隐私的东西，但如果你有特权，那就不一样了，管它私有公开照用不误。私有成员变量和普通变量声明一样，用var关键字，私有方法可以用var声明变量来接收方法对象，也可以像普通方法那样去构建。
function Lady() {
var age = 30;
var name = "菜花";
var think = function() {
alert("其实我今年" + age + "岁。");
};
function fancy(){
alert("幻想变成20岁。");
};
this.Introduce = function() {
alert("我叫" + name + " , 今年20岁。");
};
};
var younglady = new Lady();
alert(younglady.age);//结果undefined
younglady.think(); //不支持
younglady.fancy(); //不支持
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
上面是一个Lady类，age、think、fancy都是私有成员，think和fancy方法可以访问age和name，think和fancy两个方法也可以互相进行调用。但它们是私有的，所以创建出来的youngLady对象并不能调用到age、think和fancy，当然也不能调用到name。如果私有成员只能互相之间调用，其实也就失去了私有成员存在的意义。javascript提供特权成员可以建立外界和私有成员互通的桥梁。特权成员是公共成员的一种，公共成员有普通公共成员、特权成员和对象公共成员。
特权成员就是在类中用this.XX的方式建立的成员，它们可以通过对象来被调用，它们也可以访问私有成员，可以建立私有成员被访问的通道。
function Lady() {
var age = 30;
this.Name = "菜花";
var think = function() {
alert("其实我今年" + age + "岁。");
};
function fancy() {
alert("幻想变成20岁。");
};
this.Introduce = function() {
alert("我叫" + this.Name + " , 今年" + age + "岁。");
};
};
var younglady = new Lady();
younglady.Introduce(); //Introduce
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
普通公共成员的创建，不在类的里面来编码，而是通过类的prototype来创建。添加普通公共成员都直接添加到类的prototype中，而prototype就是一个像JSON对象一样的成员集对象。当我们进行对象创建时，可以认为会将类prototype中的成员整体copy入新的Object对象中。
var younglady = new Lady();
younglady.Introduce(); //Introduce
Lady.prototype.Hobby = "上网";
Lady.prototype.GetName = function() {
return this.Name;
};
var lady2 = new Lady();
alert(lady2.GetName());
alert(lady2.Hobby);
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
上面代码通过prototype为Lady类添加了普通公共成员GetName方法和Hobby属性，因为是公共成员，所以它们可以和原先定意在类中的特权成员进行互相访问。因为公共成员可以互相访问。对上述代码做些修改。如下。
var younglady = new Lady();
Lady.prototype.Hobby = "上网";
Lady.prototype.GetName = function() {
return this.Name;
};
alert(younglady.GetName());
alert(younglady.Hobby);
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
先创建出Lady对象，再修改类成员，先前创建好的对象也具有了新的成员。这就是prototype做为类原型所带来的好处，这里简单理解，可以认为prototype是类对象的模版，模版的修改会影响到所有该类对象。
在添加普通成员的时候也可以来个批量的添加，直接用一个新的JSON对象来赋给prototype就可以了。但是要注意，现在是将原先的prototype进行了替换，在替换之前创建的对象引用的是旧的prototype对象，所以对prototype替换之前创建的对象不会有Hobby和GetName成员。
Lady.prototype = {
Hobby: "上网",
GetName: function() {
return this.Name;
}
};
var younglady = new Lady();
alert(younglady.GetName());
alert(younglady.Hobby);
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
除了在构建类时可以添加公共成员，还可以对对象直接进行成员操作。这在本小系列第二篇文章里有描述。这里做一下补充，对对象直接添加的成员，也是一种公共成员，这些成员也可以和类中原先具有的公共成员进行访问。
younglady.SetName = function(name) {
this.Name = name;
};
younglady.SetName("菜明");
alert(younglady.GetName());
<style type="text/css">
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }</style>
以上说了一下类成员的东西，下次再说说类继承相关的东西。(如有不当说法请指正)
javascript"面向对象编程" - 1 万物皆对象
javascript"面向对象编程" - 2 聊聊对象的事
javascript"面向对象编程" - 3 function是方法(函数)
分享到：
相关推荐
在提供的资源中，《代码之美》PDF文件可能包含了关于编程实践和代码风格的指导，而《Javascript面向对象编程》PPT可能更具体地阐述了JavaScript OOP的细节和示例。学习这些材料将有助于深入理解JavaScript的面向对象...
这些只是JavaScript面向对象编程的一些基本概念和技巧，实际应用中还有更深入的模式和策略，如模块化、设计模式等。理解并熟练运用这些概念，将有助于你编写出更加高效、可维护的JavaScript代码。
### JavaScript面向对象编程详解 #### 一、引言 JavaScript作为一种广泛使用的脚本语言，在Web开发领域占据着举足轻重的地位。尽管JavaScript本质上是一种基于原型的语言，但它也支持面向对象编程的一些特性，使得...
JavaScript面向对象编程是指在JavaScript语言中使用面向对象的方法来编写程序。JavaScript是一种高级的、解释型的编程语言，它支持面向对象的编程范式，允许开发者创建对象、使用继承和多态等面向对象的特性。以下是...
下面将详细探讨JavaScript面向对象编程的基本原理、特性以及实际应用。 1. **类与对象** - 在JavaScript中，对象是键值对的集合，可以通过字面量语法或构造函数创建。例如： ```javascript const person = { ...
javascript面向对象编程指南 2nd英文版，英文名：Object-Oriented JavaScript。 What you will learn from this book The basics of object-oriented programming, and how to apply it in the JavaScript ...
### JavaScript面向对象编程精要 #### 一、引言 JavaScript是一种灵活且强大的脚本语言，它虽然起源于一种简单的浏览器脚本语言，但随着时间的发展，JavaScript已经成为了一种功能全面的编程语言，尤其是在Web开发...
`JavaScript面向对象编程讲解.pptx`可能提供了更详细的理论解释和更多示例，帮助读者深入理解面向对象编程在JavaScript中的应用。 学习JavaScript面向对象编程，不仅有助于理解代码的结构和复用性，还有助于提高...
### JavaScript面向对象编程详解 #### 一、JavaScript面向对象编程简介 JavaScript作为一种广泛使用的脚本语言，虽然起源于一种简单的浏览器脚本环境，但随着时间的发展，它已经演变为一种功能强大的编程语言，...
JavaScript面向对象编程是一种基于原型（Prototype）的编程范式，它是动态类型语言，允许开发者创建具有复杂特性的对象。在JavaScript中，面向对象主要通过构造函数、原型链和闭包来实现。以下是对这一主题的详细...
JavaScript是一种动态类型的脚本语言，虽然它不像Java或C#那样拥有传统的类和实例机制，但它的面向对象编程能力仍然非常强大。JavaScript的核心在于对象、原型和隐式继承，这些都是理解其面向对象特性的重要概念。 ...
### JavaScript学习深入—面向对象编程 #### 一、JavaScript中的类型概述 JavaScript作为一种动态的、弱类型的语言，其核心特点之一在于它灵活的对象模型。尽管JavaScript的基础架构支持面向对象编程(OOP)，但在...
通过这种方式，JavaScript面向对象编程不仅包括了代码的实际编写，还包括了测试和调试的环节，确保代码的质量和可维护性。学习和掌握面向对象编程的方法是学习JavaScript的重要一环，对于任何想要深入学习并掌握...
### JavaScript面向对象编程详解 #### 一、JavaScript与面向对象编程 JavaScript虽然是一种基于对象的语言，但其设计并不像传统的面向对象编程语言那样拥有明确的类（class）概念。这使得在JavaScript中实现面向...