javascript怎调用(function()这种函数,(function()里又是封装函数怎用?

Question

外部引用了一个*.js文件，这个js文件里是这样的

(function(){
function  aa(){
}

function  bb(){
}

**
以此类推
｝

里面又是封装好的函数，我怎么在body里调用这个js文件的函数？
我直接 调用aa(); 这样会报错。

Answer 1

这种别人封装好的,你要用,正常来说要按照人家文档的说明来.
假如你拿到一个 js 文件,又没有文档,那就只能去看源码了.看源码里面都做了什么,然后去想办法利用他.
如果是给别人用的 js 文件,像这样封装的,一般会有以下两种情况.

1. 把想要暴露出来的能力挂载到全局上,比如下面这样,把test挂载到window上,用的人直接调用test.你可以看看那个文件里面是不是有把什么东西挂载到window上的.

   ;(function () {
     function test() {
       console.log('test')
     }
     window.test = test
   })()
   

2. 通过函数执行结果返回要暴露的能力,像下面这样,你可以看看那个文件结尾是否有返回值

   const test = (function () {
     function test() {
       console.log('test')
     }
     return test
   })()
   

如果原本就是为了在浏览器上使用,大概率是第一种情况.

当然也有可能这个文件原本只是在内部执行,进行一些操作,并不打算给别人用,所以就不会暴露能力给外部.这种情况下如果还是想要去使用 aa 函数的话,也是可以的.

比如像下面这段代码,并没有将 test 导出,或者挂载到全局

;(function () {
  function test() {
    console.log('test')
  }
})()

这时候想使用test,就需要用到一些比较 hack 的方法.

具体步骤:

1. 先获取这段字符串
2. 使用正则或者拼接字符串的方式在函数体结束之前插入return test
3. 用eval去执行这个字符串,返回的就是test这个函数了

const str = `;(function () {
  function test() {
    console.log('test')
  }
})()`
const newStr = str.slice(0, 63) + '\n  return test' + str.slice(63)
const test = eval(newStr)

这样就可以愉快的使用test了,当然类似eval执行字符串效果的还有new Function.另外类似插入return test,可以换成window.test=test,这样可以不用去获取返回值,执行完之后,挂载在window上,直接用.

如果说你想要的aa函数,跟我这里演示的test一样,没有依赖外部的数据,那其实也可以直接将aa的整个函数体的字符串截取下来,然后用eval或者new Function去执行也是可以的.