利用javaScript闭包做到函数的私有性和公开性

关于javaScript的闭包我在另一篇博客中实现javaScript对象的”继承”的两种方法(prototype与闭包) 中提到过。

闭包也就是说在函数内部定义的函数,在外部使用的现象。可以使用闭包来完成对象的继承,可以做到函数的私有性和公开性。

js中的自调函数:

(function(形参){}) (实参);

(function(name){
    alert("my name is"+name);
})("hello world");

需求: 定义一个类,该类有age和name属性。生成实例可以对该类的这两个属性初始化之后可以获取其值,但不允许修改。

(function(){
  /**
  *专门存放两个属性的json
  **/
  var data = {
    name:"",
    age:""
    };
/**
 *私有的方法
 **/   
 function setName(name){
   data.name= name;  
 }
function setAge(age){
  data.age = age;
}
/**
 *公开的方法
 */
function getName(){
   return data.name;
}
function getAge(){
   return data.age;
}
function init(name,age){
  setName(name);
  setAge(age);
}
//将要公开的API封装起来
function Person(){
return {
  init:init,
  getName:getName,
  getAge:getAge
};
}
//将方法Person赋值给window。这样在外部就能访问了
window.Person = Person;
})();

var p = Window.Person();
p.init("wx","20");
alert(p.getName());
alert(p.getAge());

这样就利用闭包做到函数的私有性和公开性。
为了更加美观,增加阅读性,重构上面代码:

(function(){
  /**
   *Person模块
   **/
  var Person = {
  //数据部分
    data:{
    name:"",
    age:""},
    //操作部分
    opt:{
       setName:function(name){
          Person.data.name=name;     
         },
       setAge:function(age){
        Person.data.age=age;
         },
        getName:function(){
         return Person.data.name; 
         },
         getAge:function(){
         return Person.data.age; 
        },
        init:function(name,age){
         Person.opt.setName(name);
         Person.opt.setAge(age);
         }
      },
      /**
      *公开的API
      **/
      openAPI:function(){
      return {
         init:Person.opt.init,
         getName:Person.opt.getName,
         getAge:Person.opt.getAge
    };
       }
    };
    window.Person = Person;
})()
var p = window.Person.openAPI();
p.init("wx","20");
alert(p.getName());
alert(p.getAge());

如上写js的方式就是把所以的内容写在一个大大的json中,数据就对应key为data,操作看对于key为opt。这样写个人感觉比较直观一点。

说到这里了就再简单说一下jQuery的源码,其实整个jQuery其实就是一个自调函数:

(function(window){
    //jQuery是一个函数,一个对象,一个构造器函数
 var jQuery = function( selector, context ) {
  return new jQuery.fn.init( selector, context );
 },
 //定义了jQuery的prototype的内容
 //fn=prototype
 //加在jQuery的prototype上的方法可以通过选择器创建出来的对象调用
 jQuery.fn = jQuery.prototype = {        对象方法
  ready:function(){

  },
  each:function(){

  }
 },
 //post方法和extend方法直接加在了jQuery对象上     全局方法
 jQuery.post = function(){

 },
 jQuery.extend = function(){

 }
 //程序员在用jQuery的时候,是window的一个属性
 //jQuery=$
 window.jQuery = window.$ = jQuery;
 $.fn=jQuery.prototype=window.$.prototype=window.$.fn=window.jQuery.fn=window.jQuery.prototype

 加在jQuery的prototype上的方法和加在jQuery对象上的方法称为jQuery的插件开发
})(window);

window.jQuery.fn=$.prototype=window.$.fn=jQuery.prototype=window.jQuery.prototype
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值