OpenLayers 项目分析(四)-OpenLayers中定制JavaScript内置类

(三)BaseTypes: OpenLayers中定制JavaScript内置类
  OpenLayers不仅“自己”写了一些底层的类,像上回说的那些都是。同时也定制了一些JS的一些内置类,即对JS内置类的扩展。这个扩展主要包含3类:String,Number,Function,存在于BaseTypes.js文件中。
  String:
OpenLayers对string类型定制了8个方法,分别是startsWith、contains、trim和camelize;还有另外4个方法:String. startsWith、String. contains、String.trim和String. Camelize,它们将会在3.0Version中被删除,可能是以前版本遗留下来的,这里就不说它们了。

[代码]js代码:
01//Test whether a string starts with another string.
02startsWith: function(str, sub) {
03  return (str.indexOf(sub) == 0);
04  }
05
06//Test whether a string contains another string.
07  contains: function(str, sub) {
08      return (str.indexOf(sub) != -1);
09  }
10
11  //Removes leading and trailing whitespace characters from a string.
12  trim: function(str) {
13      return str.replace(/^\s*(.*?)\s*$/, "$1");   
14  }
15
16 //Camel-case a hyphenated string.
17//Ex."chicken-head"becomes"chickenHead",
18 //and"-chicken-head"becomes"ChickenHead".
19 // “骆驼”化带有连字符的字符串。
20 camelize: function(str) {
21      var oStringList = str.split('-');
22      var camelizedString = oStringList[0];
23      for (var i = 1; i < oStringList.length; i++) {
24          var s = oStringList[i];
25          camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
26      }
27      return camelizedString;
28  }


Number:
项目仅对number类型扩展了一个方法OpenLayers. Number. limitSigDigs(还有一个方法Number. limitSigDigs,同样在3.0中会删除)。

[代码]js代码:
01//Limit the number of significant digits on an integer.
02    limitSigDigs: function(num, sig) {
03        var fig;
04        if(sig > 0) {
05            fig = parseFloat(num.toPrecision(sig));
06        else {
07            fig = 0;
08        }
09        return fig;
10    }


Function:
扩展了两个方法bind 和bindAsEventListener(同样存在Function.bind和Function. bindAsEventListener两个被“遗弃”的函数)。

[代码]js代码:
01//Bind a function to an object. 
02 //Method to easily create closures with'this' altered.
03 bind: function(func, object) {
04     // create a reference to all arguments past the second one
05     var args = Array.prototype.slice.apply(arguments, [2]);
06     return function() {
07         // Push on any additional arguments from the actual function call.
08         // These will come after those sent to the bind call.
09         var newArgs = args.concat(
10             Array.prototype.slice.apply(arguments, [0])
11         );
12         return func.apply(object, newArgs);
13     };
14 }
15
16 //Bind a function to an object, and configure it to receive the event
17 //object as first parameter when called.
18 bindAsEventListener: function(func, object) {
19     return function(event) {
20         return func.call(object, event || window.event);
21     };
22 }


里说说这两个方法。
首先看看bind方法,这是一个能够被Function的实例得到的方法,如下所示:

[代码]js代码:
01Function.prototype.bind = function() {
02var _method = this, args = [], object = arguments[0];
03for (var i = 1; i < arguments.length; i++)
04args.push(arguments[i]);
05return function(moreargs) {
06for (var i = 0; i < arguments.length; i++)
07args.push(arguments[i]);
08return  _method.apply(object, args);
09}
10};


_method 代表Function实例自身,bind可接收多个参数,不过它绑定是是第一个参数,该参数是一个function或者是调用环境,后面的都是执行函数的参数。

[代码]js代码:
1Function.prototype.bindAsEventListener = function(object) {
2var  _method = this;
3return function(event) {
4return  _method.call(object, event || window.event);
5}
6};


这里只是将object作为_method 引用的环境,就是说现在可以在object对象中这样使用,
object. _method (event||window.event)。
也许你注意到了Funtion扩展的两个方法一个用到了call而另一个用的是apply,其实这两个并没有什么太大的区别,只是参数传递的形式不同,如若没有参数要传递,那么这两个是一样的:
apply(obj[,argumentsArray]),call(obj[,arg1[,arg2…]])。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值