JavaScript速成课--面向对象程序设计

目录

一.类的定义和实例化

1.类的定义

2.类的实例化

二.访问和添加对象的属性和方法

1.访问对象的属性和方法

2.向对象添加对象属性和方法

三.继承

1.原型实现继承

2.构造函数实现继承

3.重新定义继承父类的方法


一.类的定义和实例化

        在JavaScript中没有声明类的关键字,也没有对类访问的权限控制,JavaScript中使用函数来定义类

1.类的定义

        定义类的语法:

function className(){

}

例:

function student(){
this.name="myun";
this.age=22;
this.school="ybu";
this.like=function(){
alert("hello world, hello time");
}
}
2.类的实例化

        在JavaScript中类的实例化使用关键字new,类的实例化即是创建对象

创建对象语法:

new className();

例:上面的student类

var student=new student();
student.like();

        在JavaScript中还可以通过对象直接初始化对象,该方法不需要使用new关键字就可以生成实例:

var student={
name:"myun";
age:22
school:"ybu";
like:function(){
alert("hello world hello time");
}
/* 或者
student.like=function(){
alert("hello world hello time");
}
*/
}

二.访问和添加对象的属性和方法

        属性是一个变量,用来表示一个对象的特征,方法是一个函数,用来表示对象的操作

1.访问对象的属性和方法

(1)使用“.”来访问对象属性

语法:

objectName.propertName

objectName        对象名称

propertName        属性名称

(2)使用“[ ]”来访问对象属性

语法:

objectName[propertyName]

(3)使用“.”来访问对象的方法

语法:

objectName.methodName()

objectName        对象名称

methodName        函数名称

例如:

function student(name,age){
this.name=name;
this.age=age;
this.school=age;
this.like=function(){
alert("hello world, hello time");
}
}
var student=name student("myun",22);
alert("school"+student.school);  //访问对象属性
alert("name"+student[name]);
alter("method"+student.like());  //访问方法
2.向对象添加对象属性和方法

        JavaScript可以在定义类时所以属性和方法,也可以在创建对象后动态添加属性和方法

例:

function Student(name,age){
this.name=name;
this.age=age;
this.school=age;
this.like=function(){
alert("hello world, hello time");
}
}
var student=name Student("myun",22);
alert("school"+student.school);  //访问对象属性
alert("name"+student[name]);
alter("method"+student.like());  //访问方法
//动态添加属性和方法
student.sex=“男”;
student.say=function(){
alert("添加方法");
}

        值得注意的是sex属性和say()是动态添加的,它们只属性student对象,如果在实例一个student1对象,student1.say()就是错误的用法

        如果想添加的属性和方法能让所有对象共享,可以使用原生函数添加属性和方法:

function Student(name,age){
this.name=name;
this.age=age;
this.school=age;
this.like=function(){
alert("hello world, hello time");
}
}
var student=name Student("myun",22);
var student1=name Student("myun9527",22);
//原生函数动态添加属性和方法
Student.sex=“男”;
Student.say=function(){
alert("原生函数添加方法");
}
//所有对象共享添加的对象
student.say();
alert(student.sex);
student1.say();
alert(student1.sex);

三.继承

        继承是指一个对象的属性和方法来自另一个对象,此时称前一个对象为子类,后一个为父类,JavaScript常用两种继承方式,分别是原型实现继承和构造函数实现继承

1.原型实现继承

        原型实现继承指子类指定父类的方法是将父类的实例对象赋值给子类的prototype属性,语法:

A.prototype=new B(....);

例: 

function Student(name,age){
this.name=name;
this.age=age;
}

Student.prototype.say(){
alert("原型函数name:"+this.name);
}

function boys(sex){
this.sex=sex;
}

boys.prototype=new Student("myun",22)  //将Student设置为boys的父类

boys.prototype.tell(){
alert(this.name,this.age.this.sex);
}

var student=new Student("myun1",22);
var boys1=new boys("male");
boys1.say();   //myun
boys1.tell();   //myun,22,male
2.构造函数实现继承

        构造函数实现继承就是在子类的构造函数中使用call调用父类构造器函数,从而解决向父类构造函数传参问题,并实现继承

例:

function Student(name,age){
this.name=name;
this.age=age;
}

Student.prototype.say(){
alert("原型函数name:"+this.name);
}

function boys(name,age,sex){
Student.call(this,name,age);  //调用call传参
this.sex=sex;
}

boys.prototype=new Student()  //将Student设置为boys的父类

boys.prototype.tell(){
alert(this.name,this.age.this.sex);
}

var student=new Student("myun1",22);
var boys1=new boys("myun",22,"male");
boys1.say();   //myun
boys1.tell();   //myun,22,male
3.重新定义继承父类的方法

        如果子类要重新定义继承自父类的方法,那么只要将定义的方法名和父类继承的方法名一样就可以了,例如上面的say()方法:

boys.prototype.say=function(){
alert("这是子类中的say()方法");
}

var boy=new boys();
boy.say();  //调用自己的say()函数,不再是继承父类的函数

你可能感兴趣的:(前端学习,javascript,开发语言,ecmascript)