JS常见的API扩展形式有哪些

本文小编为大家详细介绍“JS常见的API扩展形式有哪些”，内容详细，步骤清晰，细节处理妥当，希望这篇“JS常见的API扩展形式有哪些”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。

　　比如我现在有一个需求，给定一个字符串，给方法传递一个参数为数字类型来确定当前字符串重复次数，例如：

　　'abc'.repeatStringNumTimes（3）？//?abcabcabc

　　如果按照一般的思维就是我们把这个方法绑定到String的原型上，如下代码：

　　String.prototype.repeatStringNumTimes?=?String.prototype.repeatStringNumTimes?||?function（times）？{var?str?=?'';for（var?i?=?0;?i?<?times;?i++）？{

　　str?+=?this;

　　}return?str;

　　}

　　jQuery插件开发方式主要有三种：

　　通过$.extend（）来扩展jQuery

　　通过$.fn 向jQuery添加新的方法

　　通过$.widget（）应用jQuery UI的部件工厂方式创建

　　通常我们使用第二种方法来进行简单插件开发，说简单是相对于第三种方式。第三种方式是用来开发更高级jQuery部件的，该模式开发出来的部件带有很多jQuery内建的特性，比如插件的状态信息自动保存，各种关于插件的常用方法等，非常贴心，这里不细说。

　　而第一种方式又太简单，仅仅是在jQuery命名空间或者理解成jQuery身上添加了一个静态方法而以。所以我们调用通过。extend（）添加的函数时直接通过。extend（）添加的函数时直接通过符号调用（$.myfunction（））而不需要选中DOM元素（$（'#example'）。myfunction（））。请看下面的例子。

　　$.extend（{

　　sayHello:?function（name）？{

　　console.log（'Hello,'?+?（name?name?:?'Dude'）？+?'!'）;

　　}

　　}）

　　$.sayHello（）;?//调用$.sayHello（'Wayou'）;?//带参调用

　　看一个jquery封装的面向对象的插件开发代码：

　　//定义Beautifier的构造函数var?Beautifier?=?function（ele,?opt）？{this.$element?=?ele,this.defaults?=?{'color':?'red','fontSize':?'12px','textDecoration':'none'

　　},this.options?=?$.extend（{},?this.defaults,?opt）

　　}//定义Beautifier的方法Beautifier.prototype?=?{

　　beautify:?function（）？{return?this.$element.css（{'color':?this.options.color,'fontSize':?this.options.fontSize,'textDecoration':?this.options.textDecoration

　　}）;

　　}

　　}//在插件中使用Beautifier对象$.fn.myPlugin?=?function（options）？{//创建Beautifier的实体

　　var?beautifier?=?new?Beautifier（this,?options）;//调用其方法

　　return?beautifier.beautify（）;

　　}

　　调用方式：

　　$（function（）？{

　　$（'a'）。myPlugin（{'color':?'#2C9929','fontSize':?'20px'

　　}）;

　　}）

读到这里，这篇“JS常见的API扩展形式有哪些”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注亿速云行业资讯频道。