当前位置: 动力学知识库 > 问答 > 编程问答 >

html5 - Static-analysis with custom rules for JavaScript?

问题描述:

Does JSLint, JSHint or other static code-analysis open-source tool support adding custom rules for code compliance or are some ECMAScript compliant parsers that I can use to get the results as close as possible to the ones seen in the format below ?

Like for example to look into JavaScript-code and list what functions are called, if it calls a library (or API provide by smartphones for html5 widgets) to register all that fall under the namespaces of that API, to make a tree of the objects and their properties to see if function is called out from what object can be traced back to, maybe with an output in XML,JSON or other structured format.

Say for example I have this JavaScript code (it does nothing is just for the sake of the argument) :

jobs = mylibrary.getJobs();

found = jobs.find("Python");

list = found.convert("html");

I want my analizer tool to get this:

{

"mylibrary":{

"jobs":{"maker":"getJobs","parent":"mylibrary"},

"found":{"maker":"find","parent":"jobs","parameters":"Python"},

"list":{"maker":"convert","parent":"found"}

}

}

网友答案:

You should be able to build something like this using substack's burrito, which uses the parser from Uglify-JS and gives, I think, you all you need. A quick sample:

src.js:

var jobs, found, list;
jobs = mylibrary.getJobs();
found = jobs.find("Python");
list = found.convert("html");

ast.js:

var fs = require('fs'),
    burrito = require('burrito');

var src = fs.readFileSync('./src.js', 'utf8');

burrito(src, function (node) {
    console.log(node.name, node.value);
});

Exactly how you would build your requested structure, I'm not too sure (I'm not very well versed in AST parsing myself) but I'm sure it would entail some effort on your part. Perhaps you wouldn't need a structure in-between, so to speak, but could just validate each node from burrito, where each call node would be validated against it's values (function name, object name etc), with a warning raised if it doesn't validate.

Here is the output from the burrito call above (note: every [Object] or such has been truncated by node.js' console.log. Values are actually nodes in the parse tree from burrito, so each value has it's associated state etc).

var [ [ [ 'jobs' ], [ 'found' ], [ 'list' ] ] ]
stat [ [ { name: 'assign', start: [Object], end: [Object] },
    true,
    [ [Object], 'jobs' ],
    [ [Object], [Object], [] ] ] ]
assign [ true,
  [ { name: 'name', start: [Object], end: [Object] }, 'jobs' ],
  [ { name: 'call', start: [Object], end: [Object] },
    [ 'dot', [Object], 'getJobs' ],
    [] ] ]
name [ 'jobs' ]
call [ [ 'dot', [ 'name', 'mylibrary' ], 'getJobs' ], [] ]
stat [ [ { name: 'assign', start: [Object], end: [Object] },
    true,
    [ [Object], 'found' ],
    [ [Object], [Object], [Object] ] ] ]
assign [ true,
  [ { name: 'name', start: [Object], end: [Object] }, 'found' ],
  [ { name: 'call', start: [Object], end: [Object] },
    [ 'dot', [Object], 'find' ],
    [ [Object] ] ] ]
name [ 'found' ]
call [ [ 'dot', [ 'name', 'jobs' ], 'find' ],
  [ [ [Object], 'Python' ] ] ]
string [ 'Python' ]
stat [ [ { name: 'assign', start: [Object], end: [Object] },
    true,
    [ [Object], 'list' ],
    [ [Object], [Object], [Object] ] ] ]
assign [ true,
  [ { name: 'name', start: [Object], end: [Object] }, 'list' ],
  [ { name: 'call', start: [Object], end: [Object] },
    [ 'dot', [Object], 'convert' ],
    [ [Object] ] ] ]
name [ 'list' ]
call [ [ 'dot', [ 'name', 'found' ], 'convert' ],
  [ [ [Object], 'html' ] ] ]
string [ 'html' ]

Update:

Another option is the newer(?) ES parser Esprima, which seems to be both more actively developed and better documented. It's also reportedly faster than Uglify. You can try out e.g. parsing on the Parsing Demo page. You sould be able to build a good solution using this, methinks.

网友答案:

According to Wiki: Parasoft Analyzes Java (Jtest), JSP, C, C++ (C++test), .NET (C#, ASP.NET, VB.NET, etc.) using .TEST, WSDL, XML, HTML, CSS, JavaScript, VBScript/ASP, and configuration files for security, compliance, and defect prevention.

App called WebKing - http://www.parasoft.com/jsp/products/article.jsp?articleId=3169&redname=webtesting&referred=webtesting

But I never test it.

网友答案:

I tried something with a javascript interpreter that can be accessed from code (in my case python). So interpreters like pynoceros, pynarcissus or pyv8 might help me.

There is an answer here on how to install py8: http://stackoverflow.com/a/11879224/1577343

Since with the above approach I didn't had much success I prefer a static analysis solution that uses a ECMAScript compliant parser.

With static analysis as far I could get is using JSLINT parser( Run JSLint on a .js file from debugging console in chrome or firefox): But I don't know how to use this further.

{
    "string": "(begin)",
    "first": [
        {
            "string": "var",
            "arity": "statement",
            "first": [
                {
                    "string": "jobs"
                },
                {
                    "string": "found"
                },
                {
                    "string": "list"
                }
            ]
        },
        {
            "string": "=",
            "arity": "infix",
            "first": {
                "string": "jobs"
            },
            "second": {
                "string": "(",
                "arity": "infix",
                "first": {
                    "string": ".",
                    "arity": "infix",
                    "first": {
                        "string": "mylibrary"
                    },
                    "second": {
                        "string": "getJobs"
                    }
                },
                "second": []
            }
        },
        {
            "string": "=",
            "arity": "infix",
            "first": {
                "string": "found"
            },
            "second": {
                "string": "(",
                "arity": "infix",
                "first": {
                    "string": ".",
                    "arity": "infix",
                    "first": {
                        "string": "jobs"
                    },
                    "second": {
                        "string": "find"
                    }
                },
                "second": [
                    {
                        "string": "Python",
                        "arity": "string"
                    }
                ]
            }
        },
        {
            "string": "=",
            "arity": "infix",
            "first": {
                "string": "list"
            },
            "second": {
                "string": "(",
                "arity": "infix",
                "first": {
                    "string": ".",
                    "arity": "infix",
                    "first": {
                        "string": "found"
                    },
                    "second": {
                        "string": "convert"
                    }
                },
                "second": [
                    {
                        "string": "html",
                        "arity": "string"
                    }
                ]
            }
        }
    ]
}
分享给朋友:
您可能感兴趣的文章:
随机阅读: