码迷,mamicode.com
首页 > Web开发 > 详细

js 面向对象讲解

时间:2019-05-15 00:19:44      阅读:172      评论:0      收藏:0      [点我收藏+]

标签:line   代码分析   封装   性能   关联   func   全局   面向   区分   

1.面向对象概念

  1)什么是面向对象:  oop    是一种编程的思想, 体现的是生活逻辑

       2) 面向对象和面向过程:

        面向过程:

        1:大量的全局变量
        2:命名冲突
        3:顺序执行(一步一步一步........)

       面向对象三大特性:封装  继承  多态(js没有多态的)

             js:  封装\抽象\继承(借)

       3) 写js面向对象代码特点:
            高内聚(在一个功能模块里面所有的代码必须紧密相邻)
            低耦合(模块和模块之间尽量 少 关联)

2.构造函数

    构造函数- >   new 对象(实例化对象) ->   存储数据。
           注:构造函数(为了区分普通函数和构造函数  构造函数的首字母大写)
 
       构造函数  ->  去实例化对象.
     eg:写一个对象去描述一个人
        var person = new Object();
        person.name = ‘wangshuai‘;
        person.age = ‘20‘;
        person.show = function(){
            return ‘好帅‘
        }

        去描述100个人(复制?????)   封装起来
            function person(name,age){
                var obj = new Object();         //工厂
                obj.name = name;               //加工
                obj.age = age;
                obj.show = function(){
                    return obj.name;
                }
                return obj;                     //出厂
            }
            var person1 = person(‘wangshuai‘,‘20‘);
            var person2 = person(‘xiaom‘,‘10‘);
            var person3 = person(‘ee‘,‘30‘);
       
            上述代码分析:
                在创建每一个人的时候(调用person),在函数内部每次都会new 一个对象          
            在构造函数里面  实例化对象的时候。 自动return 出一个this   指向当前这个对象。

  3:普通函数 和构造函数的差别:  
例:          
function person(){    
        return this;
    }
    var p1 = new person();    //实例化对象     person构造函数。
    console.log(p1)
 
        普通函数如果函数内部没有return的时候,返回的是一个undefined.
        构造函数如果内部没有return的时候,再实例化的对象的时候(new 对象),自动return出 this 指向当前构造出来的这个对象
        
4. prototype      
        原型对象:
            记录了一个函数公共的属性和方法。
            可以拓展属性和方法
            节约内存提升性能
            继承属性和方法
例: function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.show = function(){
        this.name;
    }
    var p1 = new Person(‘ws‘,10);
    var p2 = new Person(‘dd‘,20);
    console.log(p1.show == p2.show)
 

js 面向对象讲解

标签:line   代码分析   封装   性能   关联   func   全局   面向   区分   

原文地址:https://www.cnblogs.com/wangwenxin123/p/10865460.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!