JavaScript统计代码行数的两种实现方式
本文介绍在JavaScript中统计代码行数的两种方法。传统方式通过遍历字符串中的换行符进行计数,而更高效的做法是将字符串按换行符分割为数组后直接获取长度。文章通过具体HTML与JS示例,展示了如何从文本框获取内容并计算行数,同时指出了处理最后一行空行时的细节调整。
统计代码行数的基本思路
当一段代码包含数十行甚至上千个字符时,统计其行数是一个常见需求。实现这一功能的基本思路是将代码字符串转换为数组,然后返回该数组的长度即可得到行数。
传统遍历统计法
传统做法:
<textarea name="abc">
123456
789
</textarea>
<script type="text/javascript">
var counter = 0;
var str = abc.value;
for(i=0; i<str.length; i++)
{
if(str.substr(i,1)=="\n")
counter +=1;
}
alert(counter);
</script>
基于数组分割的高效实现
转为数组后效率就高了很多:
<textarea name="abc">
123456
789
</textarea>
<script type="text/javascript">
alert(abc.value.split("\n").length)
</script>
<textarea name="abc" style="width:480px; height:220px;">
system.println("hello world!")
alert("hello world!");
messagebox_ok("hello world")
msgbox("hello world!")
</textarea>
<script type="text/javascript">
alert("代码总行数:"+(abc.value.split("\n").length-1).toString())
</script>
JavaScript闭包与类(Class)的区别及适用场景对比
2026-11-05 15:48:57
JavaScript入门要学ES6吗?let与箭头函数等新特性解析
2026-11-05 14:49:16
JavaScript 8种数据类型详解:基本类型与引用类型的区别
2026-11-05 14:25:15
怎么在JavaScript中使用async/await优化Ajax异步流程
2026-11-05 13:56:15
JavaScript replace回调函数实现动态正则替换逻辑
2026-11-05 13:52:13
