<!DOCTYPE html>
<html>

  <head>

    <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap-theme.min.css">
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
  
        <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>
  <body>
    <button id="case1">Case 1: some as parameter</button>
        <button id="case2">Case 2: bB as parameter</button>
  </body>
</html>
// 任意一个全局性变量,变量名为bB
$(function(){
var bB = 5;

// 创建主控函数,这个函数将来实现 Dependency Injection,也就是根据形参的名称,来动态给形参确定变量
var a = function(str, fn) {
  //将函数体以字符输出
  var fnStr = fn.toString();

  // 关键步骤:通过正则,得到函数的形参字符
  var args = fnStr.match(/function\s*\((.*?)\)/);
  // 在控制台打出这个变量,看看是什么东东
  console.log(args);
  // 如果形参的名称为bB,则执行函数,并将变量 bB传入
  for (var i = 0; i < args.length; i++) {
    if(args[i] == 'bB') {
      fn(bB);
    }
  }
}
// will do nothing,这么写,页面将什么都不做
$('#case1').click(function(){
  a('sdfdfdfs,', function(some){
    alert(some)
  });
})
// will alert 5,这么写,页面将alert出5
$('#case2').click(function(){
  a('sdfdsdsfdfsdfdsf,', function(bB){
    alert(bB)
  });
});
})
/* Styles go here */