韩顺平 javascript教学视频_学习笔记12_js面向对象编程介绍_类(原型对象)和对象

javascript——面向对象

内容介绍

js面向（基于）对象编程—类（原型对象）与对象（实例）
js面向（基于）对象编程—构造方法和this

无论你是学习java，还是php或者c#都要对javascript要有深入的了解，现在的网页只要有动态效果就要用到javascript，javascript是必学内容，重点是学习javascript的面向对象编程。

学习目标：

初步掌握js中的类（原形对象）和对象
什么是成员变量和成员方法
掌握构造方法的使用

js面向对象特征介绍

javascript是一种面向（基于）对象的动态脚本语言，是一种基于对象（Object）和事件驱动（EventDriven）并具有安全性能的脚本语言。他具有面向对象语言所特有的各种特性，比如封装、继承及多态等。但对于大多数人说，我们只把javascript作为一个函数式语言，只把他用于一些简单的前端数据输入验证及实现一些简单的页面动态效果等，我们没能完全把握动态语言的各种特性。在很多优秀的Ajax框架中，比如EXtJs、 JQuery等，大量使用了javascript的面向对象特性，要使用好ext技术，javascript的高级特性，面向对象语言特性是我们必须完全把握的。
封装：javascript只有私有和公有这两个封装方式
继承：不是通过关键字extends，而是通过对象冒充的方式来达到继承的效果
多态：javascript是天生的多态，它本身就无态，无态就是多态的一种体现。

在学习本章前，我们有必要给大家明确几个概念，这样大家在后续学习中才不会犯晕：

javascript是一种基于对象（object-based）的语言，你遇到的所有东西几乎都是对象。

特别说明：基于对象也好，面向对象也好实际上都是一对象的概念来编写程序，从本质上并无区别，所以这两个概念在我们的课程中是一样的。

因为javascript中是没有class（类），它换了个名称，称为原型对象，这两个概念从在编程中发挥的作用看都是一个意思，为了统一叫法，我们这里就统一叫类。

澄清概念
在 js 中基于对象 == js 面向对象
在 js 中没有类class，但是它取了一个新的名字叫原型对象，因此类==原型对象

js面向（基于）对象编程——类（原型匹配）与对象

js面向（基于）对象
计算机语言的发展是向接近人的思维方式演变的，这是一个大趋势。 js引入了面向对象的思想，js不是纯面向对象的，我们可以认为它是基于面向对象的。

汇编语言 [面向机器]
c语言 [面向过程]
java语言 [面向对象]
js [支持面向对象]
韩顺平 javascript教学视频_学习笔记12_js面向对象编程介绍_类(原型对象)和对象

韩顺平 javascript教学视频_学习笔记12_js面向对象编程介绍_类(原型对象)和对象

类（原型对象）和对象（实例）的区别和联系

类（原型对象）是抽象的，概念的，代表一类事物，比如人，猫...
对象是具体的，实际的，代表一个具体事物
类（原型对象）是对象实例的模版，对象实例是类的一个个体

类（原型对象）—如何自定义类（原型对象）和对象

工厂方法—使用new Object创建对象并添加相关属性
使用构造函数来定义类（原型对象）
使用prototype
构造函数及原型混合方式
动态原型方式

先讲第二种方法：使用构造函数来定义类（原型对象）
基本语法：
function 类名/原型对象名(){}
创建对象：
var 对象名=new 类名();

对象—特别说明

在js中一切都是对象

<html>  
<head>  
<script language="javascript">  

    function Person(){  
}  
var a=new Person();  
window.alert(a.constructor);//a对象实例的构造函数  
window.alert(typeof a);//a的类型是什么  
var b=123;  
window.alert(b.constructor);//b对象实例的构造函数  
window.alert(typeof b);//b的类型是什么  
var c="123";  
window.alert(c.constructor);//c对象实例的构造函数  
window.alert(typeof c);//c的类型是什么   

//Person也是对象  再次说明了js中一切都是对象
window.alert(Person.constructor); 

//思考：如何判断一个对象实例是不是Person类型？  
if(a instanceof Person){   
//如果这个实例是Person这种类型，会返回一个真，否则返回假  
window.alert("a是person");  
}  

//或者  
if(a.constructor==Person){  
//a对象实例的构造函数就是Person  
window.alert("a是Person");  
}  

</script>  
</head>  
<body></body>  
</html>

下面看一个对象的例子：

<html>  
<head>  
<script language="javascript">  

//js中没有class，怎么定义原型对象或者类呢，用function  

//这里就是定义一个Cat类。是一个类还是函数，主要看你怎么去用它  
function Cat(){  
}  

//如果你这样用，很神奇，主要看你怎样用  
// Cat();//就是函数  
// var cat1=new Cat();//这就是类  
//这时Cat1就是一个对象（实例）  
//属性怎么给，javascript比较松散，可以动态的添加属性  

var cat1=new Cat();  

cat1.name="小白";  
cat1.age=3;  
cat1.color="白色";  

//从上面的代码我们可以看出  
//1.js中的对象的属性可以动态的添加  
//2.属性没有限制  

window.alert(cat1.name); //打印输出小白  

//没有定义的会报undefined  
window.alert(cat1.hobby);  
</script>  
</head>  
<body></body>  
</html>

秒客网