远程调用js

JavaScript08

远程调用js,第1张

JsLoader,动态加载远程js代码

/**

* Construct a new JSLoaderEnvironment instance

* @class JSLoaderEnvironment is the class designed to be a

* representation of a unix-like shell environment.

* The purpose of this is to allow the infrastructure to abstract

* away any library file location knowledge for rapid and enterprise

* adoption and deployment

*/

function JSLoaderEnvironment(){

// Default

this.prefix="/assets/"

// Auto-discover location

var _remote=false

var s=0

var _script_tags=document.getElementsByTagName("script")

var endsWith=function(str, substr){

return (str &&str.indexOf(substr) == (str.length-substr.length))

}

for(s=0s<_script_tags.length++s){

var src=_script_tags[s].src

var src_orig=src

if(src){

if(src.indexOf("://")>-1)

{

src=src.substring(src.indexOf("://")+3)

src=src.substring(src.indexOf("/"))

}

if(endsWith(src,"jsloader.js") || endsWith(src,"jsloader-debug.js")) {

// If the domain is remote, assume we're running in hosted mode

_remote=(src_orig.indexOf(document.domain)==-1)

if(_remote) src=src_orig

this.prefix=src.substring(0, src.lastIndexOf("/")+1)

}

}

}

/**

* @private

*/

this.suffix=".js"

/**

* @private

* Make the Path of a module to meta/proj/release

*/

this.makeJSLoaderPath=function(m,p,r,suff){

// if just a url is specified, use it

if(!p &&!r) return this.stripExternalRef(m)

// build the m/p/r path

return this.prefix+m+"/"+p+"/incr/versions/"+r+ ((suff)?this.suffix:"")

}

/**

* The generate the path prefix for a MPR linked into the JSLoader Environmentiables

* @param m meta

* @param p project

* @param r release

*/

this.makePath=function(m,p,r){

// if just a url is specified, use it

if(!p &&!r) return this.stripExternalRef(m)

// build the m/p/r path

return this.prefix + m +"/" + p + "/" + r + "/"

}

/**

* @private

*/

this.env=new Object()

/**

* @private

*/

this.loaders=new Object()

/**

* The sets an environment variable (make sure it's safe for JS Object[key] notation)

* The idea here is that modules could set this, and pages which load the module

* can then get the Environment variables

* @param k javascript object[key]

* @param v value (technically could be of any type...)

*/

this.setEnv=function(k,v){

this.env[k]=v

}

/**

* The gets an environment variable previously set

* @param k javascript object[key]

* @returns the value set for this key

*/

this.getEnv=function(k){ return this.env[k]}

/**

* Lists all modules

* loaded in this environment.

* @private

*/

this._loadedJSLoaders=new Object()

/**

* This makes a normalized key to stick into loaded_modules and verify if things are loaded.

* @private

*/

this.normalize=function(m,p,r){ return (m+"__"+p+"__"+r).toLowerCase()}

/**

* This checks whether the given meta/project/release is already loaded.

* @param m metaproject (or the path of a JS file, if no other args are passed)

* @param p project

* @param r release

* @type boolean

* @returns Whether m/p/r is loaded

*/

this.isLoaded=function(m,p,r){

var xkey=this.normalize(m,p,r)

return(this._loadedJSLoaders[xkey]!=null)

}

/**

* Gets a "loader" based on the MPR specified in the arguments

* This is useful for loading subpackages. You can call {@link JSSubLoader#load} or {@link JSSubLoader#loadAll} on this

* and it will load submodules under a folder with the "release" number

* @see JSSubLoader

* @param m metaproject

* @param p project

* @param r release

* @returns void

*/

this.getLoader=function(m,p,r){

var key=this.normalize(m,p,r)

var loader=this.loaders[key]

if(loader) {

return loader

}

else {

loader=new JSSubLoader(this,this.makeJSLoaderPath(m,p,r,false)+"/")

var __path=this.makePath(m,p,r)

this.setEnv(p.toUpperCase()+"_PATH",__path)

this.loaders[key]=loader

return loader

}

}

/**

* Loads the requested module into the environment

* You can also load your own module by calling loadJavascript(url) if you want

* @param m metaproject

* @param p project

* @param r release

* @type boolean

* @returns void

*/

this.load=function(m,p,r){

var key=this.normalize(m,p,r)

var url=this.makeJSLoaderPath(m,p,r,true)

try{

if(this.isLoaded(m,p,r)) {

return

}

this.loadJavaScript(url)

this._loadedJSLoaders[key]="true"

} catch (e){ this.handleError(e)}

}

/**

* Loads a JavaScript file into the page

* @param {String} url the url of the javascript file

*/

this.loadJavaScript=function (url){

url = this.stripExternalRef(url)

document.writeln("<scri"+"pt src='"+url+"' type='text/javascript'></sc"+"ript>")

}

/**

* Loads a JavaScript file into the page

* @param {String} url the url of the javascript file

*/

this.loadStyleSheet=function(url){

url = this.stripExternalRef(url)

document.writeln("<li"+"nk rel='stylesheet' href='"+url+"' type='text/css'></li"+"nk>")

}

/**

* Strips out any double slashes, double dots, or cross domain references.

* @param s string

*/

this.stripExternalRef=function(s){

var exprs = [/\.\.+/g,/\/\/+/g,/\\\\+/g,/\:+/g,/\'+/g,/\%+/g]

// If it's hosted, we relax the protocol related regex

exprs = [/\.\.+/g,/\\\\+/g,/\'+/g,/\%+/g]

if (_remote)

for(var i=0i<exprs.lengthi++)

{

s = s.replace(exprs[i], '')

}

return s

}

/**

* Overwritable error handler

*/

this.handleError=function(e) {

}

return this

}

/**

* Construct a new JSSubLoader instance. You shoudl never need to call this, as {@link JSLoaderEnvironment#getLoader} gets you one of these from the environment.

* @class JSSubLoader is designed to load "sub" modules

* This is a wrapper which is produced when you call {@link JSLoaderEnvironment#getLoader}

* It is designed to allow sub-packages within a given MPR to be loaded easily. This is constructed by JSLoader.getLoader() call

* so you should never really need to construct one of these.

* @constructor

* @param {JSLoaderEnvironment} env_

* @param {String} prefix_ The path underneath which the submodules reside

*

*/

function JSSubLoader(env_, prefix_){

/**

* @private

*/

this.environment=env_

/**

* @private

*/

this.prefix=prefix_

/**

* @private

*/

this.loaded=new Object()

/**

* @private

*/

this.normalize=function(str){ return str.toLowerCase()}

/**

* Loads an array of subpackages

* @param {Array} pkgs an array of packages.

*/

this.loadAll=function(pkgs_){

for(i=0i<pkgs_.length++i) this.load(pkgs_[i])

}

/**

* Loads a subpackage, if it's not already loaded

* @param {String} url the url of the sub-package module file (m/p/r/submodule.js)

*/

this.load=function(pkg){

var p=this.normalize(pkg)

if (this.loaded[p]) {

return

}

this.loaded[p]=pkg

this.environment.loadJavaScript(prefix_+pkg+".js")

}

}

JSLoader = new JSLoaderEnvironment()

// LocalWords: fileoverview

在webpack中loader是分为两种的,一种是pitchloader一种是normalloader ,在使用自定义loader时可以用如下方法进行定义loader

大部分的loader定义时用的是normalloader,loader的执行顺序是和pitchloader调用是有关的,现在来定义三个loader,来测试一下loader的执行顺序

用如图所示的loader来执行js文件

自定义loader路径查找

loader的加载是webpack在runloader的时候执行的,调用的loader-runner这个库,这个库在执行loader的时候将所有的loader加了一个index

源码中在判断当前的loader是pitchLoader时index是递增的,所以pitchLoader是正序的

enforce是可以改变loader的执行顺序,一共有四种配置

vuejs vue-loader 能支持两template 漆.二.一 二维数组定义 前面介绍数组标称维数组其数组元素称单标变量实际问题量二维或维C语言允许构造维数组维数组元素标标识数组位置所称标变量本节介绍二维数组维数组由二维数组类推 二维数组定义般形式: 类型说明符 数组名[量表达式一][量表达式二] 其量表达式一表示第维标度量表达式二 表示第二维标度 例: int a[三][四]说明三行四列数组数组名a其标变量类型整型该数组标变量共三×四即: a[0][0],a[0][一],a[0][二],a[0][三] a[一][0],a[一][一],a[一][二],a[一][三] a[二][0],a[二][一],a[二][二],a[二][三