码迷,mamicode.com
首页 > 其他好文 > 详细

面向对象基础

时间:2018-12-09 11:59:21      阅读:235      评论:0      收藏:0      [点我收藏+]

标签:nbsp   object   构造函数   type   i++   模式   原型   构建   类与对象   

一、面向对象

    function creatPerson(name,qq) {  //构造函数
        var obj = new Object();

        obj.name = name;
        obj.qq = qq;

        obj.showName = function () {
            alert(this.name);
        }

        obj.showQQ = function () {
            alert(this.qq);
        }
        return obj;     //返回构建的对象
    }


    var object = creatPerson("张三",95499999999);   //object拥有obj的方法和属性
    object.showName();
    object.showQQ();

二、工厂方式

    function creatPerson(name,qq) {  //构造函数

    //原料(新空白对象)
    var obj = new Object();

    //加工
    obj.name = name;
    obj.qq = qq;

    obj.showName = function () {
        alert(this.name);
    };
    obj.showQQ = function () {
        alert(this.qq);
    };

    //出厂
    return obj;     //返回构建的对象
}

var object = creatPerson("张三","95499999999");
var object2 = creatPerson("李四","46186465849");
object.showName();
object.showQQ();

object2.showName();
object2.showQQ();

缺点:

1.没有new
2.函数重复->资源浪费

三、解决new的问题

    function show() {
        alert(this);
        this.showName = function() {
            alert("hehehe");
        }
    }
    //show();  -> window
    //new show(); -> Object 新new出来的对象
    //new show().showName(); -> 先弹出object,后弹出"hehehe" this指向新new出来的对象
    

    //解决没有new问题
    function creatPerson(name,qq) {  //构造函数

    //在函数调用前加了new之后,系统偷偷地做一些事情:
    //var this = new Object();

    this.name = name;
    this.qq = qq;

    this.showName = function () {
        alert(this.name);
    };
    this.showQQ = function () {
        alert(this.qq);
    };

    //也会偷偷做一些
    //return this;     //返回构建的对象
}

var object = new creatPerson("张三","95499999999");
object.showName();
object.showQQ();

 

四、原型prototype

css   js
class 一次给一组元素加样式 原型
行间样式 一次给一个元素加样式 给对象加事件

 

 

 

 

var arr1 = new Array(1,5,8,6,7);
var arr2 = new Array(11,25,58,16,17);

Array.prototype.sum = function () {  //class
//arr1.sum = function () {    //行间样式
    var result = 0;

    for (let i = 0; i < this.length; i++) {
        result+=this[i];
    }
    return result;
} 

alert(arr1.sum());
alert(arr2.sum());

五、类与对象

类:模子 -> Array
对象:产品(成品)->  arr

//解决函数重复问题
function creatPerson(name,qq) {  //构造函数

//在函数调用前加了new之后,系统偷偷地做一些事情:
//var this = new Object();

this.name = name;
this.qq = qq;

//也会偷偷做一些
//return this;     //返回构建的对象
}
var obj = CreatPerson("张三","95499999999");
alert(obj); //undefined -> creatPerson没有返回值 this指向window

//原型
CreatPerson.prototype.showName = function () {
    alert(this.name);
};
CreatPerson.prototype.showQQ = function () {
    alert(this.qq);
};

//要加new,不然无法调用构造函数
var object1 = new CreatPerson("张三","95499999999");
object1.showName();
object1.showQQ();
var object2 = new CreatPerson("李四","46186465849");
object2.showName();
object2.showQQ();

alert(object1.showName() == object2.showName()); //true,因为它们都是原型上的

用构造函数来加属性 行间样式
用原型来加方法 class
以上即是混合模式。

面向对象基础

标签:nbsp   object   构造函数   type   i++   模式   原型   构建   类与对象   

原文地址:https://www.cnblogs.com/bbcfive/p/10090255.html

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