深入浅出js常见问题
今天我们来讨论js中常见的问题：
一、引言
a) 区分大小写
b) 单引号、双引号
c) 括号
d) 函数调用和引用
e) 作用域、闭包
f) 自己创建js库
二、具体介绍
a) 区分大小写：js中方法、变量、对象都是区分大小写的。
Function myFunction(){} 和 function MyFunction(){}是不同的两个函数。
Js中核心对象Array如果写成array，则不能识别；Object也是一样。
b) 单引号、双引号
Js中单引号和双引号没有特殊区别，都可以用来创建字符串。但是一般情况下，我们喜欢使用单引号。
*注：单引号中可以包含双引号，双引号也可以包含单引号。
下面的实例：我们想通过函数，显示变量temp和temp2的字符串值：
<script language="javascript" type="text/javascript">
/*var array =new Array();*/
var temp='aj"abc"';
var temp2="a'acb'";
function Init(){
alert(temp);
alert(temp2);
};
</script>
<body onload="Init();"></body>
c) 在js中括号有两种作用：
i. 改变优先级，括号内的内容优先执行
ii. （function（）｛｝）（）; function之前的一对括号作为分隔符，后面的括号表示立即执行这个方法
同样是上面的实例，我们也可以这样执行，后面的括号表示立即执行该函数</script>前面的小括号。
<script language="javascript" type="text/javascript">
var temp='aj"abc"';
var temp2="a'acb'";
(function Init(){
alert(temp);
alert(temp2);
})();
</script>
d) 函数调用和引用：
Var foo=example(); //foo表示函数的返回值；
Var foo=example; //表示将函数的引用赋给一个值foo1；
上面的实例，我们也可以将函数的指针指向onload事件。
<script language="javascript" type="text/javascript">
/*var array =new Array();*/
var temp='aj"abc"';
var temp2="a'acb'";
function Init(){
alert(temp);
alert(temp2);
};
window.onload=Init;//把函数的指针指向onload
</script>
e) 作用域、闭包：
下面的实例，我们想通过点击页面上的a标记链接，显示相应的i的值。然后这样做不能达到效果：
<script language="javascript" type="text/javascript">
function newInit(){
for(var i=1;i<=3;i++){
var anchor=document.getElementById("anchor"+i);
anchor.onclick=function(){
alert("fadsf"+i);
}
}
}
window.onload=newInit;
</script>
<body>
<a id="anchor1" href="#">abc</a><br/>
<a id="anchor2" href="#">abc</a><br/>
<a id="anchor3" href="#">abc</a><br/>
</body>
这是由于上面newInit函数中是通过onclick点击事件触发的，然而每次点击链接，函数中循环都执行完了。所以每次点击会显示相同的结果。
所以，我们应该换一种思路做。
<script language="javascript" type="text/javascript">
function newInit(){
for(var i=1;i<=3;i++){
var anchor=document.getElementById("anchor"+i);
registerListener(anchor,i);
}
}
function registerListener(anchor,i){
anchor.onclick=function(){
alert("My anchor is anchor"+i);
}
}
window.onload=newInit;
</script>
<body>
<a id="anchor1" href="#">abc</a><br/>
<a id="anchor2" href="#">abc</a><br/>
<a id="anchor3" href="#">abc</a><br/>
</body>
registerListener每次被调用的时候，都会产生一个i的实例，这样就会使i的值不同，从而达到我们想要的效果。registerListener函数保证了每一个实例都保存了一个唯一的对象。
f) 自己创建js库：
大家都知道，网上有很多非常卓越的JavaScript库，像Prototype、JQuery等。有人觉得他们非常棒，但是有人觉得长期使用会对它产生依赖性，助长惰性。
既然如此，大家可以折中一下，借鉴这些非常好的库，然后建立自己需要的库：
// JavaScript Document
(function(){
//构造命名空间
window['IC']={}
function $(){
var elements=new Array();
//arguments当前函数的参数数组。参数
for(var i=0;i<arguments.length;i++){
var element=arguments[i];
if(typeof element=='string'){
element=document.getElementById(element);
}
if(arguments.length==1){
return element;
}
elements.push(element);
}
return elements;
}
//注册命名空间
window['IC']['$']=$;
function getElementsByClassName(className,tag){
var allTags=document.getElementsByTagName(tag);
var matchingElements=new Array();
className=className.replace(/\-/g,"\\-");
var regex=new RegExp("(^|\\s)"+className+ "(\\s|$)");
var element;
for(var i=0;i<allTags.length;i++){
element=allTags[i];
if(regex.test(element.className)){
matchingElements.push(element);
}
}
return matchingElements;
}
window['IC']['getElementsByClassName']=getElementsByClassName;
})();
上面是我建立的js库，从现在开始积累。
三、总结
1、学习js优雅的写法；
2、注意学习中的细节；
3、多多总结，有利无弊。
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维：从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构