优大网

标签存档: js

Javascript 匿名函数与封装

迷惑了一会儿不同JS库的封装后,终于有了点头绪。大致就是:

创建一个自调用匿名函数,设计参数window,并传入window对象。

而这个过和的目的则是,

使得自身的代码不会被其他代码污染,同时也可以不污染其他代码。

jQuery 封装

于是找了个早期版本的jQuery,版本号是1.7.1里面的封装代码大致是下面这样的

(function( window, undefined ) {
var jQuery = (function() {console.log('hello');});
window.jQuery = window.$ = jQuery;
if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
    define( "jquery", [], function () { return jQuery; } );
}
})( window );

其中的

console.log('hello');

是用以验证是否按开头说的这样工作,于是我们就可以在window中调用jQuery

window.$

或者是

window.jQuery

于是我们就可以创建一个类似的封装

(function(window, undefined) {
    var PH = function() {

    }
})(window)

相比于上面只是少了两步

  • 定义jQuery的符号及全局调用
  • 异步支持

于是找了下更早期的jQuery的封装,方法上大致是一样的, 除了。。

if (typeof window.jQuery == "undefined") {
    var jQuery = function() {};
    if (typeof $ != "undefined")
        jQuery._$ = $;

    var $ = jQuery;
};

很神奇的判断方法,以致于我们没有办法重写上一步的jQuery。于是只好看看最新的jQuery的封装是怎样的。于是就打开了2.1.1,发现除了加了很多功能以外,基本上思想还是不变的

(function(global, factory) {

    if (typeof module === "object" && typeof module.exports === "object") {
        module.exports = global.document ?
            factory(global, true) :
            function(w) {
                if (!w.document) {
                    throw new Error("jQuery requires a window with a document");
                }
                return factory(w);
        };
    } else {
        factory(global);
    }

}(typeof window !== "undefined" ? window : this, function(window, noGlobal) {
    var jQuery = function() {
        console.log('jQuery');
    };
    if (typeof define === "function" && define.amd) {
        define("jquery", [], function() {
            return jQuery;
        });
    };
    strundefined = typeof undefined;
    if (typeof noGlobal === strundefined) {
        window.jQuery = window.$ = jQuery;
    };
    return jQuery;
}));

在使用浏览器的情况下

typeof module ="undefined"

所以上面的情况是针对于使用Node.js等的情况下判断的,这也表明jQuery正在变得臃肿。

Backbone 封装

打开了Backbone看了一下

(function(root, factory) {

    if (typeof define === 'function' && define.amd) {
        define(['underscore', 'jquery', 'exports'], function(_, $, exports) {
            root.Backbone = factory(root, exports, _, $);
        });

    } else if (typeof exports !== 'undefined') {
        var _ = require('underscore');
        factory(root, exports, _);

    } else {
        root.Backbone = factory(root, {}, root._, (root.jQuery || root.Zepto || root.ender || root.$));
    }

}(this, function(root, Backbone, _, $) {
    Backbone.$ = $;
    return Backbone;

}));

除了异步支持,也体现了其对于jQuery和underscore的依赖,百

        define(['underscore', 'jquery', 'exports'], function(_, $, exports) {
            root.Backbone = factory(root, exports, _, $);
        });

表明backbone是原生支持requirejs的。

Underscore 封装

于是,又看了看Underscore,发现这个库又占领了一个符号 _

(function() {
    var root = this;
    var _ = function(obj) {
        if (obj instanceof _) return obj;
        if (!(this instanceof _)) return new _(obj);
        this._wrapped = obj;
    };

    if (typeof exports !== 'undefined') {
        if (typeof module !== 'undefined' && module.exports) {
            exports = module.exports = _;
        }
        exports._ = _;
    } else {
        root._ = _;
    }

    if (typeof define === 'function' && define.amd) {
        define('underscore', [], function() {
            return _;
        });
    }
}.call(this));

总体上也和差不多都是匿名函数,除了最后用的是call()方法。

http://www.phodal.com/blog/javascript-anonymous-function-encapsulation/

java程序执行js脚本

public class ExecJs {

    /**
     * 记录日志类
     */
    private Logger log = Logger.getLogger(ExecJs.class);
    /**
     * 后置处理,执行js脚本
     * @param js
     * @throws Exception
     */
    public void execJs(String js, Map<String,Object> map) throws Exception {
        if (log.isDebugEnabled()) {
            log.debug("execJs js : " + js);
            Iterator<Entry<String, Object>> it = map.entrySet().iterator();
            while (it.hasNext()) {
                Entry<String, Object> entry = (Entry<String, Object>) it.next();
                log.info("EXECJS MAP : " + entry.getKey() + "---" + entry.getValue());
            }// end while
        }// end if
        if ("".equals(js) || js == null) {
            log.info("EXECJS ERROR : JAVASCRIPT CONTENT IS NULL");
        } else if(map == null || map.size()<=0){
            log.info("EXECJS ERROR : MAP CONTENT IS NULL");
        } else {
            // 获取脚本引擎
            ScriptEngineManager mgr = new ScriptEngineManager();
            ScriptEngine engine = mgr.getEngineByName("javascript");
            // 绑定数据
            ScriptContext newContext = new SimpleScriptContext();
            Bindings bind = newContext.getBindings(ScriptContext.ENGINE_SCOPE);
            bind.putAll(map);
            try {
                engine.setBindings(bind, ScriptContext.ENGINE_SCOPE);
                engine.eval(js);
            } catch (Exception e) {
                log.info("EXECJS EXCEPTION : EXECUTE JAVASCRIPT EXCEPTION", e);
                throw (e);
            }// end try
        }// end if
    }
}
调用例子
boolean flag = false;
String js = “var a = 1; var b = a + aKey;println(b);”;
Map<String,Object> map = new HashMap<String,Object>();
map.put(“aKey”, “aValue”);
try {
flag = execJs.execJs(js, map);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

Copyright © 2021 优大网 浙ICP备13002865号-3

SITEMAP回到顶部 ↑