zoukankan      html  css  js  c++  java
  • 提升js编写能力

     静态方法,属于类的方法,即类可以直接调用的方法。为类所有实例化对象所共用(但不能用实例对象之间调用),所以静态成员只在内存中占一块区域;

    实例方法,属于实例化类后对象的方法,即实例对象调用的方法。每创建一个类的实例,都会在内存中为非静态成员分配一块存储;

    静态方法在一启动时就实例化了,因而静态内存是连续的,且静态内存是有限制的;而非静态方法是在程序运行中生成内存的,申请的是离散的空间。

    看代码:

    function a(){ }
    a.staticMethof = function(){ 
       alert('静态方法') ; 
    }
    a.prototype.instaceMethod = function(){
      alert('实例方法');
    }
    a.staticMethof();//类a直接调用
    var instace = new a();
    instace.instaceMethod();//a的实例对象instace调用

    拿jQuery框架来看,它的方法都是实例方法,它的工具函数都是静态方法。

    静态方法$.each();

    实例方法$('body').each();

    下面来看下jQuery中拓展两种方法extend的用法。

     $.extend是拓展静态方法,而$.fn.extend是拓展实例方法

    先说下extend:

    extend,这个函数的功能基本都是实现对象的拷贝功能,即将一个对象的所有属性拷贝到另外一个对象上去,开发插件时经常用到。

    看代码:

    jQuery.extend(object)

    为jQuery类添加方法,即添加静态方法

    jQuery.extend({

      min:function(a,b){

        return (a<b?a:b);

      },

      max:function(a,b){

        return (a>b?a:b);

      }

    });

    jQuery.min(2,3);//2

    jQuery.max(4,5);//5

    Object jQuery.extend(target,object1,[objectN]);

    为其他类添加静态方法(用一个或多个对象来拓展一个对象,返回被拓展的对象)

    var settings = { validate: false, limit: 5, name: "foo" };

    var options = { validate: true, name: "bar" };

    jQuery.extend(settings,options);

    结果:settings == { validate:true, limit: 5, name:"bar"}

    jQuery.fn

    jQuery.fn = jQuery.prototype = {

      init:function(selector,context){

        }

    }

    原来jQuery.fn = jQuery.prototype,对prototype原型链是不陌生的吧?

    jQuery.fn.extend( object );

    对jQuery.prototype进行拓展,即添加实例函数。

    例如要开发一个插件,编辑框被点击时,alert编辑框中的内容。

    $.fn.extend({
    alertWhileClick: function(){
    $(this).click(function(){
    alert($(this).val());
    })
    };
    });
    $("#input1").alertWhileClick();

    你可以拓展一个对象到jQuery的prototype中去,这样的话就是插件机制了。

    (function( $ ){
    $.fn.tooltip = function( options ) {
    };
    //等价于

    var tooltip = {
    function(options){
    }
    };
    $.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip
    })( jQuery )

  • 相关阅读:
    idea拉取git项目并创建为maven项目(新创建github项目)
    寒假学习进度-4
    寒假学习进度-3
    寒假学习进度-2
    寒假学习进度-1
    面向对象设计原则
    Servlet中生成json文件,echarts模板调用
    Mapreduce--数据清洗
    Tutorial 06_MapReduce实例WordCount
    爬虫学习-入门
  • 原文地址:https://www.cnblogs.com/jessiespur/p/6848308.html
Copyright © 2011-2022 走看看