JS面向对象编程

js面向对象

面向对象中的概念:
1.一切事物皆为对象。
2.对象具有封装和继承特性。
3.信息隐藏。

(1)说到对象,我们常会说其中包含的是属性。另外,对象的属性也可以是一个函数,因为函数本身也是一种数据,在这种情况下,我们会称该属性为方法:

这里写图片描述
这里我们声明了对象person,指定属性和方法,然后通过alert(person.name);执行,网页刷新就会显示name的值“iwen”。
这里写图片描述

(2)函数构造器构造对象
这里写图片描述

这里我们也是声明了对象person1和person2,指定了属性和方法,只是多了一个this变量,函数体内的this指向的是person对象,然后通过person1.sayName();和person2.sayName();执行调用对象person1跟person2的name,得到的会是依次显示张三跟李四的名字。
这里写图片描述
这里写图片描述

(3)继承特性
我们使用function来模拟类,function创建一个名为person的函数,我们把它当做类来使用,然后书写类中的属性与方法,通过prototype来指定它的原型量,然后给定一个方法。
这里写图片描述
如何继承刚刚创建的这个类呢?我们再创建一个名为student的类(名字随便自拟),然后让student继承person,创建一个对象提取来测试一下是否继承成功。

这里写图片描述
成功了,在网页上面显示是这样,这就说明student已经继承了person。
这里写图片描述

(4)复写父类的方法。
刚刚我们做出了继承,现在再加上一条student的复写,两个say,这样就是在复写父类
这里写图片描述

这样刷新网页就会显示子类的我很好,这是调用了子类的复写方法。
这里写图片描述
现在调用父类的方法,创建一个名为superSsay的对象,再到下面经过call传递一个this来调用父类say方法的执行。
这里写图片描述
这样显示出来的就是父类中的say,
这里写图片描述
在父类中添加一个参数name,通过this索引(this.name = name;)在子类也要指定name参数,然后在方法say里面加上参数name,在下边传递一个参数good。

这里写图片描述
刷新页面就会显示这样
这里写图片描述
这里写图片描述

这边还有一种方法来实现继承和复写
这里写图片描述
效果图就是这样
这里写图片描述
这里写图片描述

(5)信息封装隐藏
加一个(function( ){
}( )),然后把内容粘贴进去,就实现了封装效果,外部再也调用不到里面的参数了。然后把他赋给顶级的window窗口。
这里写图片描述

现在在proson本地跟student的say方法里面都加上“c”标签,本地的能弹出,student里面就搜索不到c的内容。
这里写图片描述
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值