js 闭包方式封装

js中处处是对象,面向对象的第一步当然就是封装了,由于Js中没有类的概念,所以封装起来也比较麻烦,下面介绍两种js的封装。

1.不严格封装:

/**
 * 使用约定优先的原则,把所有的私有变量都使用_开头
 */
var Person = function (no, name, age)
{
    this.setNo(no);
    this.setName(name);
    this.setAge(age);
};
Person.prototype = {
    constructor: Person,
    checkNo: function (no)
    {
        if (!no.constructor == "string" || no.length != 4)
            throw new Error("学号必须为4位");
    },
    setNo: function (no)
    {
        this.checkNo(no);
        this._no = no;
    }, getNo: function ()
    {
        return this._no;
    }, setName: function (name)
    {
        this._name = name;
    }, getName: function ()
    {
        return this._name;
    }, setAge: function (age)
    {
        this._age = age;
    }, getAge: function ()
    {
        return this._age;
    }, toString: function ()
    {
        return "no = " + this._no + " , name = " + this._name + " , age = " + this._age;
    }
};
var p1 = new Person("0001", "Lovell", "22");
console.log(p1.toString());      //no = 0001 , name = Lovell , age = 22
p1.setNo("0003");
console.log(p1.toString());      //no = 0003 , name = Lovell , age = 22
p1.no = "0004";
p1._no = "0004";
console.log(p1.toString());      //no = 0004 , name = Lovell , age = 22

优点:成员变量的getter,setter方法都是prototype中,并非存在对象中,总体来说还是个不错的选择。

缺点:仅仅把所有的变量以_开头,其实还是可以直接访问的,这能叫封装么

2.严格封装:

/**
 * 使用这种方式虽然可以严格实现封装,但是带来的问题是get和set方法都不能存储在prototype中,都是存储在对象中的
 * 这样无形中就增加了开销
 */
var Person = function (no, name, age)
{
    var _no , _name, _age ;
    var checkNo = function (no)
    {
        if (!no.constructor == "string" || no.length != 4)
            throw new Error("学号必须为4位");
    };
    this.setNo = function (no)
    {
        checkNo(no);
        _no = no;
    };
    this.getNo = function ()
    {
        return _no;
    };
    this.setName = function (name)
    {
        _name = name;
    };

    this.getName = function ()
    {
        return _name;
    };

    this.setAge = function (age)
    {
        _age = age;
    };
    this.getAge = function ()
    {
        return _age;
    };
    this.setNo(no);
    this.setName(name);
    this.setAge(age);
}
Person.prototype = {
    constructor: Person,
    toString: function ()
    {
        return "no = " + this.getNo() + " , name = " + this.getName() + " , age = " + this.getAge();
    }
}
;
var p1 = new Person("0001", "Lovell", "22");
console.log(p1.toString());      //no = 0001 , name = Lovell , age = 22
p1.setNo("0003");
console.log(p1.toString());      //no = 0003 , name = Lovell , age = 22
p1.no = "0004";
console.log(p1.toString());      //no = 0003 , name = Lovell , age = 22
优点:去掉了this.属性名,严格的实现了封装,只能通过getter,setter访问成员变量了;

缺点:所有的方法都存在对象中,增加了内存的开销。

3.以闭包的方式封装

/**
 * 闭包方式实现封装
 */
var Person = (function () {
    var checkNo = function (no) {
        if (!no.constructor == "string" || no.length != 4)
            throw new Error("学号必须为4位");
    };
    //共享变量
    var times = 0;

    return function (no, name, age) {
        console.log(times++);    // 0 ,1 , 2
        var _no, _name, _age;
        this.setNo = function (no) {
            checkNo(no);
            _no = no;
        };
        this.getNo = function () {
            return _no;
        };
        this.setName = function (name) {
            _name = name;
        };

        this.getName = function () {
            return _name;
        };

        this.setAge = function (age) {
            _age = age;
        };
        this.getAge = function () {
            return _age;
        };
        this.setNo(no);
        this.setName(name);
        this.setAge(age);
    }
})();
Person.prototype = {
    constructor: Person,
    toString: function () {
        return "no = " + this.getNo() + " , name = " + this.getName() + " , age = " + this.getAge();
    }
};
var p1 = new Person("0001", "Lovell", "22");
var p2 = new Person("0002", "abc", "23");
var p3 = new Person("0003", "aobama", "24");
p2._name = "Lovell";
p3.setName("Lovell");
console.log(p1.toString());      //no = 0001 , name = Lovell , age = 22
console.log(p2.toString());      //no = 0002 , name = abc , age = 23
console.log(p3.toString());      //no = 0003 , name = Lovell , age = 24
优点:1.严格的实现了封装,只能通过getter,setter访问成员变量了;

           2.对象之间公共的成员变量和成员方法实现共享。

详解:上述代码,js引擎加载完后,会直接执行Student = 立即执行函数,然后此函数返回了一个子函数,这个子函数才是new Student所调用的构造函数,又因为子函数中保持了对立即执行函数中checkNo(no) ,times的引用,(很明显的闭包)所以对于checkNo和times,是所有Student对象所共有的,创建3个对象后,times分别为0,1,2 。这种方式的好处是,可以使Student中需要复用的方法和属性做到私有且对象间共享。


评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

VCHH

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值