简体   繁体   中英

Client Side JavaScript Code Analyser

Is there a JavaScript Code analyser which can be used on the client side to analyze code patterns? I've found the following but it seems that this is just for regular text and gives you the = sign etc. I need some code analysis which can run on the client side (JS code), is there any which can be used?

 function parseData() { var rawData = document.getElementById('data').value.trim(), result, output = $('#output'), table = $('table').remove(), header, row, cell, ul, slice, wpm = [], wpmAvg = []; output.empty(); table.find('thead, tbody').empty(); if ($('[name="format"]:checked').val() === 'text') { // Simple text result = analyzeText(rawData); output.append('Word count: ' + result.count + '<br><br>Frequent words:<br>'); ul = $('<ul>'); _.forEach(result.frequentWords, function(value, key) { ul.append('<li>' + value.word + ': ' + value.count + '</li>'); }); output.append(ul); } else { // JSON try { data = JSON.parse(rawData); } catch(e) { console.log('Error parsing JSON', e); } header = table.find('thead'); body = table.find('tbody'); row = $('<tr>'); body.append(row); // Loop over slices _.forEach(data, function(value, key) { slice = ''; // Loop over statements _.forEach(value, function(value, key) { slice += value.words + ' '; }); result = analyzeText(slice); addCell(slice, key); }); $.plot('#wpm', [wpm], { xaxes: [{ axisLabel: 'Time index (1-minute increments)', }], yaxes: [{ position: 'left', axisLabel: 'Words per minute', }] }); output.append(table); } function addCell(data, index) { var cell1, cell2, ul1, ul2, result; cell1 = $('<td>'); cell2 = $('<td>'); ul1 = $('<ul>'); ul2 = $('<ul>'); cell1.append(ul1); cell2.append(ul2); row.append(cell1, cell2); result = analyzeText(data); header.append('<th>' + index + '</th><th class="subText">(' + result.count + ')</th>'); wpm.push([index, result.count]); _.forEach(result.frequentWords, function(value, key) { ul1.append('<li>' + value.word + '</li>'); ul2.append('<li>' + value.count + '</li>'); }); } } function analyzeText(rawData) { var result = { count: 0, frequentWords: [] }, data = rawData.split(/[\\s.,]+/g) counts = {}, countsArray = [], commonWords = [ 0,1,2,3,4,5,6,7,8,9, '-', 'a', 'about', 'function', 'object' ]; if (!data[data.length]) { data.splice(-1, 1); } // Word count result.count = data.length; // Word frequency (filtered for common words, sorted descending by count) for (var i = 0; i < data.length; i++) { if (!counts.hasOwnProperty(data[i].toLowerCase())) { counts[data[i].toLowerCase()] = 1; } else { counts[data[i].toLowerCase()] += 1; } } _.forEach(counts, function(value, key) { if (commonWords.indexOf(key.toLowerCase()) === -1) { countsArray.push({ word: key.toLowerCase(), count: value }); } }); countsArray = _.sortBy(countsArray, 'count').reverse(); _.forEach(countsArray, function(value, index) { if (value.count > 1) { result.frequentWords.push(value); } }); return result; } 
 body { font-family: arial; } table, tr, td, th { border-collapse: collapse; border: solid 1px #ddd; } th, td { padding: 4px 8px; } .subText { color:#999; font-style: italic; } #wpm { width:600px; height: 400px; } 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/flot/0.8.3/jquery.flot.js"></script> <textarea id="data" cols="80" rows="20" placeholder="Paste text or JSON here"></textarea><br /> <label for="text"><input type="radio" name="format" checked value="text" id="text"> Simple text</label> <button type="button" onclick="parseData()">Analyze text</button> <br><br> <div id="output"></div><br><br> <div id="wpm"></div> <table> <thead> </thead> <tbody> </tbody> </table> 

https://jsfiddle.net/fxn5q8y0/6/

Simply loop through each element in a scope and detect its type.

Here a quick example:

 var analyse = function(obj){ var results = {} for(var b in obj) { // for each element if(obj.hasOwnProperty(b)){ var detectedType = ( typeof obj[b] ) // detect the type if (!(detectedType in results)){ results[detectedType] = 0; } // if the type was detected for the first time, add its name to the results results[detectedType]++; // increase the counter for the detected type } } return results; } /** example for a testObject **/ testObject = { a: undefined, // type undefined b: { xx: "xx", yy: 123 }, // type object c: false, // type boolean d: 987, // type number e: "abc", // type string f: Symbol("foo"), // type symbol g: function(){}, // type function h: "jkl", // type number i: 654 // type number }; console.log( analyse(testObject) ); 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM