Js类的静态方法与实例方法区分及jQuery拓展的两种方法


Posted in Javascript onJune 03, 2016

上学时C#老师讲到对象有两类方法,静态方法(Static)和实例方法(非Static),当时不理解静态是为何意,只是强记。

后来从事了前端的工作,一直在对类(即对象,Js中严格来说没有类的定义,虽众所周知,这里还是赘述一番,以免产生歧义)的操作上,严重缺乏整体概念,最近看extetnd中再次提到拓展静态方法与实例方法,故而再次百度,才幡然领悟,其实一直有用,只是不知其专业术语呀,哈哈~

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

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

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

看代码:

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是拓展静态方法,而$.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(,); // 
jQuery.max(,); // 
Objectj Query.extend( target, object, [objectN]);

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

var settings = { validate: false, limit: , 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());
})
};
});
$("#input").alertWhileClick();

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

<span style="font-size: px;">(function( $ ){
$.fn.tooltip = function( options ) {
};
//等价于
var tooltip = {
function(options){
}
};
$.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip
})( jQuery );
</span>

以上所述是小编给大家介绍的Js类的静态方法与实例方法区分及jQuery拓展的两种方法 ,希望对大家有所帮助!

Javascript 相关文章推荐
IE6中使用position导致页面变形的解决方案(js代码)
Jan 09 Javascript
AngularJS中取消对HTML片段转义的方法例子
Jan 04 Javascript
使用JavaScript 实现的人脸检测
Mar 24 Javascript
js与jQuery实现checkbox复选框全选/全不选的方法
Jan 05 Javascript
谈谈JavaScript中的几种借用方法
Aug 09 Javascript
javascript设计模式Constructor(构造器)模式
Aug 19 Javascript
JS实现淡入淡出图片效果的方法分析
Dec 20 Javascript
微信小程序 picker 组件详解及简单实例
Jan 10 Javascript
jQuery实现 RadioButton做必选校验功能
Jun 15 jQuery
js中怎么判断两个字符串相等的实例
Jan 17 Javascript
微信小程序添加插屏广告并设置显示频率(一天一次)
Dec 06 Javascript
原生JS实现拖拽功能
Dec 16 Javascript
JS两个数组比较,删除重复值的巧妙方法(推荐)
Jun 03 #Javascript
JS Array创建及concat()split()slice()的使用方法
Jun 03 #Javascript
浅谈JavaScript的push(),pop(),concat()方法
Jun 03 #Javascript
Jquery中map函数的用法
Jun 03 #Javascript
JavaScript进阶练习及简单实例分析
Jun 03 #Javascript
jQuery EasyUI 入门必看
Jun 03 #Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
Jun 02 #Javascript
You might like
晶体管单管来复再生式收音机
2021/03/02 无线电
967 个函式
2006/10/09 PHP
PHP 分页类(模仿google)-面试题目解答
2009/09/13 PHP
PHP读取Excel内的图片(phpspreadsheet和PHPExcel扩展库)
2019/11/19 PHP
php 使用expat方式解析xml文件操作示例
2019/11/26 PHP
JavaScript Base64编码和解码,实现URL参数传递。
2006/09/18 Javascript
JavaScript 异步调用框架 (Part 5 - 链式实现)
2009/08/04 Javascript
jQuery使用数组编写图片无缝向左滚动
2012/12/11 Javascript
JavaScript中数组对象的那些自带方法介绍
2013/03/12 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
2015/08/22 Javascript
js钢琴按钮波浪式图片排列效果代码分享
2015/08/26 Javascript
js实现网页图片延时加载 提升网页打开速度
2016/01/26 Javascript
基于JavaScript实现鼠标向下滑动加载div的代码
2016/08/31 Javascript
jQuery与JS加载事件用法分析
2016/09/04 Javascript
AngularJS实时获取并显示密码的方法
2018/02/06 Javascript
详解使用jest对vue项目进行单元测试
2018/09/07 Javascript
利用vue-i18n实现多语言切换效果的方法
2019/06/19 Javascript
详解Vite的新体验
2021/02/22 Javascript
Python实现的简单dns查询功能示例
2017/05/24 Python
Python数组并集交集补集代码实例
2020/02/18 Python
Python scrapy爬取小说代码案例详解
2020/07/09 Python
Python接口自动化测试的实现
2020/08/28 Python
Python语言编写智力问答小游戏功能
2020/10/13 Python
迪卡侬(Decathlon)加拿大官网:源自法国的运动专业超市
2020/11/22 全球购物
《桂林山水》教学反思
2014/02/08 职场文书
信用社主任竞聘演讲稿
2014/05/23 职场文书
辞职信格式范文
2015/05/13 职场文书
庆七一晚会主持词
2015/06/30 职场文书
《实心球》教学反思
2016/02/23 职场文书
2016年社会管理综治宣传月活动总结
2016/03/16 职场文书
python 利用PyAutoGUI快速构建自动化操作脚本
2021/05/31 Python
Python标准库之typing的用法(类型标注)
2021/06/02 Python
一文搞懂php的垃圾回收机制
2021/06/18 PHP
JavaScript高级程序设计之基本引用类型
2021/11/17 Javascript
python超详细实现完整学生成绩管理系统
2022/03/17 Python
Windows 64位 安装 mysql 8.0.28 图文教程
2022/04/19 MySQL