js面向对象基础01

面向对象：不了解原理的情况下，会使用功能。

对象：黑盒子，不了解内部的结构，知道表面的各种操作。对外提供和一些操作。

JS中的面向对象

• 面向对象编程(OOP)的特点
•           抽象：抓住核心问题。（抽：把最主要的特征、跟问题相关的特征抽出来）
•           封装：不考虑内部实现，只考虑功能使用。
•           继承：从已有对象上，继承出新的对象。（遗传）从父类继承出一些方法、属性，子类又有一些自己的特性。
•                      多重继承：一人有多个爹。
•                      多态

 

• 对象的组成
•      方法——函数：过程、动态的
•      属性——变量：状态、静态的

<script>
        //变量和属性是一个东西
        var a=12;//变量：自由的，不属于任何人
        alert(a);
        
        var arr=[1,2,3,4,5,6];
        arr.a=12;//属性：属于一个对象的。
        alert(arr.a);
    </script>

  </script>
        function aaa(){             //函数：自由
            alert('abc');
        }

        var arr=[1,2,3,4];
        arr.aaa=function(){       //方法：属于一个对象
            alert('abc');
        }

        aaa();
        arr.aaa();
    </script>

• 为对象添加方法和属性
•            this:当前发生事件的对象。当前的方法属于谁。

    <script> 
        var arr=[1,2,3,4,5,6];
        arr.a=12;
        arr.show=function(){
            alert(this.a)
        }

        oDiv.onclick=function(){
            alert(this);
        }
        arr.show();

    </script>

<script>        
        function show(){
            alert(this);//window。全局的方法属于window之下的。
        }
        //上面相当于下面。show是属于window的。
        window.show=function(){
            alert(this);
        }
        show();
</script> 

•      不能在系统对象中随意附加方法、属性。否则会覆盖已有方法、属性。
•      object    空白的对象。没有功能。我们可以往这里面加对象。

 <script>
        var obj=new Object();
        obj.name='blue';
        obj.qq='1234567';

        obj.showName=function(){
            alert("我的名字是："+obj.name);
        }
        obj.showQQ=function(){
            alert("我的QQ号是："+obj.qq);
        }
        obj.showName();
        obj.showQQ();
 </script>

 跟普通函数一样，但是功能不一样。所以称为构造函数。

//工厂方式  
<script>
        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','32554435346');
        obj.showName();
        obj.showQQ();
       var obj2=createPerson('zhangsan','43256346');
       obj2.showName();
       obj2.showQQ();
    </script>

alert(obj.showName==obj2.showName);//false

每个对象都有一套自己的函数，但是明明两个东西是一样的。

工厂方式缺点：

• 没有new
• 函数重复——资源浪费