面向对象ES5

171 阅读2分钟

1.创建对象的三种方式

//1.字面量
//2.构造函数
//3.new Object()
        //1.字面量
        var obj1 = {};
        //2.构造函数
        function Person(){}
        var obj2 = new Person();
         //3.Object
        var obj3 = new Object();

2.静态函数

只能被Person调用 不能被实例对象调用
Person.fun = function(){
console.log('这是一个静态函数,类似于ES6中的static,不能被实例对象调用,是能被本身调用')
}
        function Person (name,age){
            this.name = name;
            this.age = age;

        }
        Person.sex = '男'
        Person.fun = function(){
            console.log('这是一个静态函数,类似于ES6中的static,不能被实例对象调用,是能被本身调用')
        }
        var str = new Person('张三',18);
        // str.fun()//实例对象调用,报错
        Person.fun()//正常输出
        console.log(Person.sex)

3.原型对象 prototype

共享 节省空间
//原型对象prototype  object.prototype.name=value
//prototype 属性使您有能力向对象添加属性和方法。
//在Person的原型对象中增加方法或者属性,那么这个方法或者属性就是所有实例对象所共享的!!!
        Person.prototype.run = function(){
           console.log('这是一个run函数')
       }

4.对象上属性成员查找规则

实例对象的__proto__指的就是原型对象prototype;
查找顺序,先查找该实例对象上是否有该属性!!!
如果没有就在查找__proto__,如果再原型对象中查找不到,就是undefined

5.在原型对象prototype上增加的方式能共享给所有的实例对象!!!

        Array.prototype.sum1 = function(num1,num2){
            return num1+num2
        }
        Array.prototype.sum2 = function(){
            var sum = 0;
            for(var i = 0; i<this.length;i++){
                sum += this[i]
            }
            return sum;
        }
        var arr = [1,2,3];
        
        console.log(arr.sum1(10,23));//33
        console.log(arr.sum2());//6

6.改变this指向的三种方法

6.1 使用call方法进行改变this指向,并执行函数

call方法可以传递参数,第一个为你要改变this指向为谁!!!
例如:fn.call(obj, 1, 2)  改变this为obj ,后面是参数
        var obj = {
            name : '张三',

        }

        function fn (x,y){
            console.log(this.name)
            console.log(x*y)
        }

        fn.call(obj,1,2)

6.2 apply()

 // apply与call方法类似,都可以改变this的指向!!!
 有点区别,参数传递的时候  fn.apply(obj, [1, 2])

6.3 bind() 绑定

bind方法执行,不会直接调用fn。
bind方法会返回一个新的函数!!!  var newFn = fn.bind(obj, 1, 2) 

7.构造函数的继承--组合继承

  1. 通过使用call的方式进行继承,Father.call(this,name,age),继承父类的属性 和正常的方法
  2. 利用prototype属性,让子对象的prototype属性直接指向父对象的一个实例,那么子对象自动会继承父对象的属性和方法。但记住,同时要让子对象的prototype属性的constructor属性指回自己 。作用是可以使Son继承父级的原型对象
        function Father(name, age) {
            this.name = name;
            this.age = age
            this.main = function (){
                console.log('看见这个就可以继承父类正常的方法')
            }
        }
        Father.prototype.run = function() {
            console.log("father runrunrun!!!")
        }

        function Son(name, age, score){
            //第一步☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
            Father.call(this,name,age)// 例如通过使用call的方式进行继承!!!
            //等于 this.name = name; this.age = age;
            this.score = score;
        }
        //第二步☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
        Son.prototype = new Father();
        Son.prototype.constructor = Son;

        var s1 = new Son('张三',18,100);
        
        console.log(s1.name)
        s1.run();
        s1.main()
        console.log(s1)