JavaScript面向对象
Posted 缘琪梦
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript面向对象相关的知识,希望对你有一定的参考价值。
面向对象:不了解原理的情况下,会使用功能,不关注内部细节,是一种通用思想
对象:黑盒子 不了解内部的结构,知道表面的各种操作
面向对象编程OOP:
- 特点:抽象(抓住核心问题),
- 封装(不考虑内部实现,只考虑功能),
- 继承(遗传 父母和孩子 从父类继承出一些属性和方法,还可以 有自己的新方法)
多重继承 多态
对象由属性和方法组成
- 属性-变量:状态 静态
- 方法-函数:过程 动态
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> var a=7;//变量 自由的,不属于任何人 alert(a); var arr=[1,2,3,4,5,6]; arr.a=12;//属性 非自由,属于一个对象 alert(arr.a); function aa(){ alert(\'abc\');//函数:自由 } aa(); arr.aa= function () { alert(\'abcd\');//方法:非自由 属于对象 } arr.aa(); </script> </body> </html>
结果:7 12 abc abcd
-
this:当前发生事件的对象 当前的方法属于谁
<script type="text/javascript"> var arr=[1,2,3,4]; arr.a=12; arr.show=function(){ alert(this.a); } arr.show(); </script>
12
<script type="text/javascript"> window.show=function(){ alert(this); } show(); </script>
object Window 当前的方法属于谁 属于Window
- 不能再系统对象中随意添加方法、属性,否则会覆盖已有方法和属性
- object 对象 没有东西
<script type="text/javascript"> var obj=new Object(); obj.name=\'blue\'; obj.qq=\'930260035\'; obj.showName= function () { alert(\'我的名字是:\'+this.name); } obj.showQQ= function () { alert(\'我的qq是:\'+this.qq); } obj.showName(); obj.showQQ(); </script>
<script type="text/javascript"> function createPerson(name,qq){//构造函数 //原料 var obj=new Object(); //加工 obj.name=name; obj.qq=qq; obj.showName= function () { alert(\'我的名字是:\'+this.name); }; obj.showQQ= function () { alert(\'我的qq是:\'+this.qq); }; //出厂 return obj; } var obj=createPerson(\'blue\',\'54546466\'); obj.showName(); obj.showQQ(); var obj2=createPerson(\'张三\',\'555555555\'); obj2.showName(); obj2.showQQ(); </script>
- 工厂方式的缺点:没有new 函数重复导致资源浪费
以上是关于JavaScript面向对象的主要内容,如果未能解决你的问题,请参考以下文章
VSCode自定义代码片段12——JavaScript的Promise对象
VSCode自定义代码片段12——JavaScript的Promise对象