写js代码的时候应该注意的一些的小细节

在今天将为大家分享一下,在平时我们写js代码的时候应该注意的一些的小点。

img1
全局变量
了解js的朋友应该知道全局变量就是在任何函数的外面声明的或是未声明直接简单使用的。下面来看一个例子
function
fn(){
var
a=b=0;
}
或许有好多朋友都觉得这两个都是局部变量,但这似乎不是你所想的那样。在这个例子中b是一个全局变量。这是为什么了?肯定有好多朋友也想不通,这是因为在js中赋值运算符是自右往左的,所以上面这个例子实际上是
function
fn(){
var
a=(b=0);
}
因此,在平时写js代码的应该多加小心你所定义的变量。
变量声明
在没说之前,先让大家来看一个例子
name=”global”
function
fn(){
alert(name);
var
name=’local’;
alert(name);
}
fn()
当一看到这个例子的时候,有人肯定会一下子想到这结果一定是”global”,”local”,但当你如果一运行这结果会你惊,这铝合金气动隔膜泵结果就是”undefined”,”local”。这是因为什么了?是因为变量在同一作用域(同一函数)中,声明都是被提至作用域顶部先进行解析的。
函数声明
函数声明跟变量声明也是一样的也是被提前至作用域顶部,先于任何表达式和语句被铝合金气动隔膜泵解析和求值的。
接下来又给大家举一例子
function
test(){
alert(“1″);
}
test();
function
test(){
alert(“2″);
}
test()
这个运行结果不是“1”和“2”,而是两个“2”,道理很简单,test()的声明短先于test()被解析。
函数表达式
先看命名函数表达式,理所当然,就是它得有名字,比如:
var
box=function fn(){
}
值得注意的是:函数名只对其函数内部可见,比如:
var box=function
fn(){
fn();
};
fn();
尽量少用命名函数表达式,切勿将函数名使用于外部。
函数的自执行
对于函数表达式,可以通过后面加上
() 自执行,而且可在括号中传递参数,而函数声明不可以。又比如:
function
fn(){
alert(x);
}
循环中的闭包
var
links=document.getElementsByTagName(“ul”)[0].getElementsByTagName(“a”);
for(var
i=0;i<links.length;i<1;i++)
{http://www.hainnu.edu.cn/
links[i].onclick=function(e){
e.preventDefault();
alert(“you
click link #”+i)
}
}
我们预期当点击第 i 个链接时,得到此序列索引 i 的值,可实际无论点击哪个链接,得到的都是 i
在循环后的最终结果:”5”。

原因:当 alert 被调用时,for 循环内的匿名函数表达式,保持了对外部变量
i的引用(闭包),此时循环已结束,i 的值被修改为 “5”。

解决:为了得到想要的结果,需要在每次循环中创建变量 i
的拷贝。以下演示正确的做法:
var
links=document.getElementsByTagName(“ul”)[0].getElementsByTagName(“a”);
for(var
i=0;l=link.length;i<l;i++){
links[i].onclick=(function (index){
return
function(e){
e.preventDefault();
alert(“you click link
#”+index);
}
})(i);
}

写js代码的时候应该注意的一些的小细节,布布扣,bubuko.com

时间: 2024-08-25 18:11:49

写js代码的时候应该注意的一些的小细节的相关文章

Asp.net mvc怎么在razor里写js代码

我试图在Razor里写JS代码,但是不行 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 <script type="text/javascript">   //some javascrpt code here to display map etc     //now add markers  @foreach (var item in Model) {

手写js代码格式化json数据

目录 手写js代码格式化json数据 手写js代码格式化json数据 使用JavaScript格式化json数据.需要引入jQuery库.代码简单易懂,主要思想是递归,因为每层的数据格式都是一样的. function jsonFormat(txt, tiperror, compress/*是否为压缩模式*/) {/* 格式化JSON源码(对象转换为JSON文本) */ var indentChar = ' '; if (/^\s*$/.test(txt)) { if (tiperror) ale

手写js代码(一)javascript数组循环遍历之forEach

注:原文地址http://blog.csdn.net/oscar999/article/details/8671546 我这里是仿照学习! 1.js的数组循环遍历 ①数组的遍历首先想到的是for()循环语句 var arr = ['summer','i','love', 'you']; for(var i=0, length=arr.length; i<length; i++) { alert(arr[i]); } ②其次,比较简单的方法 forEach() FireFox 和Chrome的Ar

cocos2dx手写js绑定C++

这两天连续查阅了js绑定c++的非常多文章  , 有手动与自己主动两种方式 . 本来想用自己主动绑定的 , 可是NDK一直下载不下来.....就给算了 . 以下总结一下手动绑定的实现过程 : 一共三步 : 1 . 写原始 C++ 类 ( 一般放在自己定义类库里 ) 2.  用 C++ 逐个写 成员函数相应 的 绑定代码 ( 在自己定义类库中建立的manual_binding目录里) 3.  注冊所绑定过的函数( 在AppDelegate.cpp中 加入注冊函数 ) 4.  写js代码測试效果 1

也谈谈规范JS代码的几个注意点

写JS代码差不多也有两年了吧,从刚开始的“初生牛犊不怕虎”乱写一通到后来也慢慢知道去规范一下自己写的代码.这种感觉就像是代码是你的作品,你希望它保持一份不仅干净而且也优雅的姿势.所以后来慢慢规范了自己写的代码,再后来觉得仅仅规范自己的代码还不行,这个团队其他人的也需要保持一致,再再后来就开始尝试写了一份代码规范,用于规范团队的代码质量.网上有不少讲代码规范的书,我也就不再献丑了,大家可以去看看阿里\百度\腾讯他们的代码规范,写的非常不错.我就仅仅把自己遇到的尝试做一下总结,这些可能别人也总结过无

Fiddler调试线上JS代码

强力推荐一款js调试神器,Fiddler 大家平时肯定都用过火狐的Firebug或者谷歌的调试工具来调试JS,但遗憾的是我们不能像编辑html,css那样来直接新增或者删除JS代码. 虽然可以通过调试工具的控制台来动态执行JS代码,但有时候却远远不够用. 特别是当产线环境不能随意修改文件情况下,用线上环境来调试本地代码更是迫切的需求. (往往本地测试通过,上线后却是各种bug.) 今天分享一下如何用Fiddler来修改并调试线上的JS代码. 以博客园首页为例子,用我本地的一个js文件来替换它的一

最新的JavaScript核心语言标准&mdash;&mdash;ES6,彻底改变你编写JS代码的方式!【转载+整理】

原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructuring 箭头函数 Arrow Functions Symbols 集合 学习Babel和Broccoli,马上就用ES6 代理 Proxies ES6 说自己的宗旨是"凡是新加入的特性,势必已在其它语言中得到强有力的实用性证明."--TRUE!如果你大概浏览下 ES6 的新特性,事实上它

ASP.NET服务器端向客户端注册JS代码的方法总结

一.用Response.Write方法 这种方法会把JS代码写在页面的最顶部(<html>的前面) 代码如下:Response.Write("<script type='text/javascript'>alert("XXX");</script>");此方法缺陷就是不能调用脚本文件中的自定义的函数,只能调用内部函数,具体调用自定义的函数只能在Response.Write写上函数定 义,比如Response.Write("

初次用prototype的形式编写JS代码

模仿写一个listbox的功能, 这里只完成部分的功能. 因为完整的应该是与服务端交互, 根据搜索的关键进行匹配. 然后可以利用键盘 或者 鼠标来选择推荐出来的内容. 这里只实现选择的功能. 只要是JS部分的代码. 第一步: CSS代码 .ac-renderer {     width: 600px;     top: 33px;     left: 1px;     position: absolute;     top: 35px;     left: 1px;     z-index: 1