Skip to content

[case]The introduction of third party code processing tools

王集鹄 edited this page Aug 4, 2015 · 1 revision

引入其他代码处理工具

先将其他「代码处理工具」定义为「处理器」,然后按正常编码解析即可。

processor-jsdev.js

var jsdev = require('JSDev');

/**
 * JSDev 编码
 *
 * @see https://github.com/douglascrockford/JSDev
 * @param {string} content 文本内容
 * @param {Object} attrs 属性
 * @param {string} attrs.data 数据项
 * @param {Object} scope 作用域
 * @param {Function} scope.execImport 导入数据
 */
module.exports = function processor(content, attrs, scope) {
  if (!content) {
    return content;
  }
  var tags;
  if (attrs.tags) {
    /*jslint evil: true */
    tags = scope.execImport(attrs.tags);
    if (/^\[[^]*\]$/.test(tags)) { // array
      tags = new Function(
        'return (' +
        tags +
        ');'
      )();
    } else {
      tags = tags.split(/\s*[,\n]\s*/);
    }
  } else {
    tags = null;
  }

  var comments;
  if (attrs.comments) {
    comments = scope.execImport(attrs.comments);
  } else {
    comments = null;
  }
  return jsdev(content, tags, comments);
};

input

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>jsdev</title>
</head>
<body>
</body>
<script>
/*<jdists encoding="uglify" trigger="#env === 'release'">*/
/*<jdists export="#env">debug</jdists>*/
/*<jdists export="#tags" trigger="#env === 'debug'">
test_expose
enter:trace.enter
exit:trace.exit
unless:alert
</jdists>*/
/*<jdists
  encoding="jsdev"
  tags="#tags"
  comments="Devel Edition"
  trigger="#env === 'debug'">*/
// This is a sample file.
function Constructor(number) {
  /*enter 'Constructor'*/
  /*unless(typeof number !== 'number') 'number', "Type error"*/
  function private_method() {
    /*enter 'private_method'*/
    /*exit 'private_method'*/
  }
  /*test_expose
    this.private_method = private_method;
  */
  this.priv = function () {
    /*enter 'priv'*/
    private_method();
    /*exit 'priv'*/
  }
  /*exit "Constructor"*/
}
/*</jdists>*/
/*<jdists trigger="#env === 'debug'">
var trace = {
  stack: [],
  enter: function (name) {
    this.stack.push(new Date);
    console.log('enter %s', name);
  },
  exit: function (name) {
    var t = this.stack.pop();
    if (t) {
      console.log('exit %s (%dms)', name, new Date() - t);
    } else {
      console.log('exit %s', name);
    }
  }
};
</jdists>*/
new Constructor(1);
new Constructor('1');
/*</jdists>*/
</script>
</html>

output

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>jsdev</title>
</head>
<body>
</body>
<script>
/*<jdists encoding="uglify" trigger="#env === 'release'">*/
// Devel Edition
// This is a sample file.
function Constructor(number) {
  {trace.enter('Constructor');}
  if (typeof number !== 'number') {alert('number', "Type error");}
  function private_method() {
    {trace.enter('private_method');}
    {trace.exit('private_method');}
  }
  {
    this.private_method = private_method;
  }
  this.priv = function () {
    {trace.enter('priv');}
    private_method();
    {trace.exit('priv');}
  }
  {trace.exit("Constructor");}
}
var trace = {
  stack: [],
  enter: function (name) {
    this.stack.push(new Date);
    console.log('enter %s', name);
  },
  exit: function (name) {
    var t = this.stack.pop();
    if (t) {
      console.log('exit %s (%dms)', name, new Date() - t);
    } else {
      console.log('exit %s', name);
    }
  }
};
new Constructor(1);
new Constructor('1');
/*</jdists>*/
</script>
</html>