자바스크립트는 객체의 세 가지 주요 특성(캡슐화, 상속, 다형성)을 기반으로 합니다._javascript 기술
- WBOY원래의
- 2016-05-16 15:22:091657검색
Javascript의 객체지향 3대 특징은 C, Java의 객체지향 3대 특징인 캡슐화, 상속, 다형성과 동일합니다. 구현 방법이 다를 뿐 기본 개념은 거의 동일합니다. 실제로 세 가지 주요 특징 외에도 추상이라는 또 다른 공통적 특징이 있는데, 이것이 바로 우리가 일부 책에서 객체지향의 네 가지 주요 특징을 가끔 보는 이유이기도 합니다.
1. 캡슐화
캡슐화는 추상화된 데이터와 데이터에 대한 작업을 캡슐화하는 것입니다. 데이터는 내부적으로 보호됩니다. 프로그램의 다른 부분은 승인된 작업(회원 방법)을 통해서만 데이터에 대해 작업할 수 있습니다.
사례:
<html>
<head>
<script type="text/javascript">
function Person(name, agei, sal){
// 公开
this.name = name;
// 私有
var age = agei;
var salary = sal;
}
var p1 = new Person('zs', 20, 10000);
window.alert(p1.name + p1.age);
</script>
</head>
<body>
</body>
</html>
PS: JS 캡슐화에는 두 가지 상태만 있습니다. 하나는 공개이고 다른 하나는 비공개입니다.
생성자를 통해 멤버 메서드를 추가하는 것과 프로토타입 메서드를 통해 멤버 메서드를 추가하는 것의 차이점
1. 프로토타입 방식을 통해 할당된 기능은 모든 객체에서 공유됩니다.
2. 프로토타입 방식을 통해 할당된 속성은 독립적입니다. (속성을 수정하지 않으면 공유됩니다.)
3. 모든 객체가 동일한 기능을 사용하도록 하려면 프로토타입 방식을 사용하여 기능을 추가하는 것이 메모리를 절약하는 것이 가장 좋습니다.
사례:
function Person(){
this.name="zs";
var age=20;
this.abc=function(){
window.alert("abc");
}
function abc2(){
window.alert("abc");
}
}
Person.prototype.fun1=function(){
window.alert(this.name);//ok
//window.alert(age);//no ok
//abc2();//no ok
this.abc();//ok
}
var p1=new Person();
p1.fun1();
특별 강조: 앞에서 프로토타입을 통해 모든 객체에 메서드를 추가하는 방법을 배웠지만 이 메서드는 클래스의 비공개 변수와 메서드에 액세스할 수 없습니다.
2. 상속
상속은 코드 재사용 문제를 해결하고 프로그래밍을 인간의 사고에 더 가깝게 만들 수 있습니다. 여러 클래스가 동일한 속성(변수)과 메서드를 갖는 경우 이러한 클래스에서 상위 클래스를 추상화하고 상위 클래스에서 동일한 속성과 메서드를 정의할 수 있습니다. 모든 하위 클래스는 이러한 속성과 메서드를 재정의할 필요가 없습니다. 및 상위 클래스의 메소드.
JS에서 상속을 구현하는 방법
1. 객체 사칭
사례:
<html>
<head>
<script type="text/javascript">
function Stu(name, age){
this.name = name;
this.age = age;
this.show = function(){
window.alert(this.name + " " + this.age);
}
}
function MidStu(name, age) {
this.stu = Stu;
// 通过对象冒充来实现继承的
// 对象冒充的意思就是获取那个类的所有成员，因为js是谁调用那个成员就是谁的，这样MidStu就有了Stu的成员了
this.stu(name, age);
this.payFee = function(){
window.alert("缴费" + money * 0.8);
}
}
function Pupil(name, age) {
this.stu = Stu;
// 通过对象冒充来实现继承的
this.stu(name, age);
this.payFee = function(){
window.alert("缴费" + money * 0.5);
}
}
var midStu = new MidStu("zs", 13);
midStu.show();
var pupil = new Pupil("ls", 10);
pupil.show();
</script>
</head>
<body>
</body>
</html>
2. 전화 또는 신청
사례:
<html>
<head>
<script type="text/javascript">
//1. 把子类中共有的属性和方法抽取出，定义一个父类Stu
function Stu(name,age){
// window.alert("确实被调用.");
this.name=name;
this.age=age;
this.show=function(){
window.alert(this.name+"年龄是="+this.age);
}
}
//2.通过对象冒充来继承父类的属性的方法
function MidStu(name,age){
//这里这样理解: 通过call修改了Stu构造函数的this指向,
//让它指向了调用者本身.
Stu.call(this,name,age);
//如果用apply实现，则可以
//Stu.apply(this,[name,age]); //说明传入的参数是 数组方式
//可以写MidStu自己的方法.
this.pay=function(fee){
window.alert("你的学费是"+fee*0.8);
}
}
function Pupil(name,age){
Stu.call(this,name,age);//当我们创建Pupil对象实例,Stu的构造函数会被执行,当执行后，我们Pupil对象就获取从 Stu封装的属性和方法
//可以写Pupil自己的方法.
this.pay=function(fee){
window.alert("你的学费是"+fee*0.5);
}
}
//测试
var midstu=new MidStu("zs",15);
var pupil=new Pupil("ls",12);
midstu.show();
midstu.pay(100);
pupil.show();
pupil.pay(100);
</script>
</html>
요약:
1. 다중 상속을 달성하기 위해 JS 객체를 객체를 통해 가장할 수 있습니다
2. Object 클래스는 모든 Js 클래스의 기본 클래스입니다
3. 다형성
JS 함수 오버로딩
이것이 다형성의 기초입니다. 이전 Javascript 소개에서 언급했듯이 JS 함수는 다형성을 지원하지 않습니다. 그러나 실제로 JS 함수는 상태 비저장이며 모든 길이와 유형의 매개변수 목록을 지원합니다. 동일한 이름을 가진 여러 함수가 동시에 정의된 경우 마지막 함수가 우선합니다.
사례:
<html>
<head>
<script type="text/javascript">
//*****************说明js不支持重载*****
/*function Person(){
this.test1=function (a,b){
window.alert('function (a,b)');
}
this.test1=function (a){
window.alert('function (a)');
}
}
var p1=new Person();
//js中不支持重载.
//但是这不会报错，js会默认是最后同名一个函数，可以看做是后面的把前面的覆盖了。
p1.test1("a","b");
p1.test1("a");*/
//js怎么实现重载.通过判断参数的个数来实现重载
function Person(){
this.test1=function (){
if(arguments.length==1){
this.show1(arguments[0]);
}else if(arguments.length==2){
this.show2(arguments[0],arguments[1]);
}else if(arguments.length==3){
this.show3(arguments[0],arguments[1],arguments[2]);
}
}
this.show1=function(a){
window.alert("show1()被调用"+a);
}
this.show2=function(a,b){
window.alert("show2()被调用"+"--"+a+"--"+b);
}
function show3(a,b,c){
window.alert("show3()被调用");
}
}
var p1=new Person();
//js中不支持重载.
p1.test1("a","b");
p1.test1("a");
</script>
</html>
1. 다형성의 기본 개념
다형성은 다양한 상황에서 참조(유형)의 여러 상태를 나타냅니다. 다음과 같이 이해될 수도 있습니다. 다형성은 상위 클래스를 가리키는 참조를 통해 다양한 하위 클래스에 구현된 메서드를 호출하는 것을 의미합니다.
사례:
<script type="text/javascript">
// Master类
function Master(name){
this.nam=name;
//方法[给动物喂食物]
}
//原型法添加成员函数
Master.prototype.feed=function (animal,food){
window.alert("给"+animal.name+" 喂"+ food.name);
}
function Food(name){
this.name=name;
}
//鱼类
function Fish(name){
this.food=Food;
this.food(name);
}
//骨头
function Bone(name){
this.food=Food;
this.food(name);
}
function Peach(name){
this.food=Food;
this.food(name);
}
//动物类
function Animal(name){
this.name=name;
}
//猫猫
function Cat(name){
this.animal=Animal;
this.animal(name);
}
//狗狗
function Dog(name){
this.animal=Animal;
this.animal(name);
}
//猴子
function Monkey(name){
this.animal=Animal;
this.animal(name);
}
var cat=new Cat("猫");
var fish=new Fish("鱼");
var dog=new Dog("狗");
var bone=new Bone("骨头");
var monkey=new Monkey("猴");
var peach=new Peach("桃");
//创建一个主人
var master=new Master("zs");
master.feed(dog,bone);
master.feed(cat,fish);
master.feed(monkey,peach);
</script>
다형성은 코드 유지 관리 및 확장에 도움이 됩니다. 동일한 유형의 트리에서 개체를 사용해야 하는 경우 새 개체를 만들 필요 없이 다른 매개 변수만 전달하면 됩니다.
위 내용은 객체 기반 Javascript의 세 가지 주요 특징입니다. 모든 분들의 학습에 도움이 되기를 바랍니다.