必威体育下载克里斯蒂安·海尔曼

您当前正在浏览语法类别的存档。必威体育简介

“语法”类别的存档

对于“普通开发者”来说,javascript快捷方式符号不应该是黑色魔法。

星期二,11月27日,二千零七

当发布有关JavaScript开发的文章时,您会遇到许多由发布者和编辑器设置的规则。这是一件很好的事情,因为它让我们的作者保持警觉,让我们更加了解成功出版的真正意义。然而,这也会非常烦人,尤其是当老一套的成语死板的时候。其中之一是“普通的开发人员”不太了解JavaScript快捷符号。

现在,如果你是“普通开发者”,请给我5分钟的时间来完成以下任务:您将了解更多的代码,并且花费更少的时间编写自己的脚本。

数组快捷符号-它是一个时髦的方

我的第一个bugbear是数组。这些在JavaScript中非常有用并且无所不在,但我仍然发现有人编写了复杂的东西,比如:

var链接= 新的 数组链接[] = 'http://cuteoverload.com'链接[] = 'http://icanhascheezburger.com'链接[] = 'http://pencilsatdawn.wordpress.com'链接[] = 'http://apelad.blogspot.com'
/…令人作呕…

这是复杂的(您必须为每个项重复数组名),而且维护起来也很困难。当您更改订单(如果订单很重要)时,您需要更改号码,也是。没有必要,因为编号是自动为您完成的。您只需使用方括号:

var链接= [
  'http://cuteoverload.com'
  'http://icanhascheezburger.com'
  'http://pencilsatdawn.wordpress.com'
  'http://apelad.blogspot.com' //<--最后一个,禁止逗号!
]

从视觉上看,这更明显,也是。这个缩进可以很容易地监视数组的起始位置和结束位置。更少的线路噪音。

注意,您需要用逗号分隔每个项目,但要确保最后一项没有尾随逗号。甚至可以这样嵌套数组:

var链接= [
  'http://cuteoverload.com'
  'http://icanhascheezburger.com'
  [一百二百二十“福”]
  'http://pencilsatdawn.wordpress.com'
  'http://apelad.blogspot.com' //<--最后一个,禁止逗号!
]

在那张纸条上,还有一个技巧:向数组中添加一个新项,您可以使用PUP()方法或使用长度财产:

链接。'http://dailyppy.com'链接[链接。长度] = 'http://bigeydeer.wordpress.com'

关联数组-对象管理组织!小马!

一直坚持的一个神话是,javascript有一个神奇的东西叫做关联数组。这些允许您不仅给项目编号,而且给它们命名!您可以找到如下示例:

var链接= 新的 数组链接[“可爱超载”] = 'http://cuteoverload.com'链接[“我可以吃奶酪汉堡包”] = 'http://icanhascheezburger.com'链接[“黎明的铅笔”] = 'http://pencilsatdawn.wordpress.com'链接[“霍波托比亚”] = 'http://apelad.blogspot.com'

这是最高程度的背叛。这是一个令人困惑的javascript特性,因为您在这里创建的不是真正的数组,而是一个物体。需要证据吗?做一个警报(链接类型)或尝试警报(链接〔1〕).

对象快捷方式(文字)表示法-获得卷曲。

所谓的关联数组实际上是对象,这意味着您还将找到其他认真对待前面示例的脚本,并使用以下脚本:

var链接= 新的 对象链接[“可爱超载”] = 'http://cuteoverload.com'链接[“我可以吃奶酪汉堡包”] = 'http://icanhascheezburger.com'链接[“黎明的铅笔”] = 'http://pencilsatdawn.wordpress.com'链接[“霍波托比亚”] = 'http://apelad.blogspot.com'

我们又有太多的重复。对于对象,你有一个对象文字符号作为快捷方式,基本上是用大括号:

var链接= {
  “可爱超载”  'http://cuteoverload.com'
  “我可以吃奶酪汉堡包”  'http://icanhascheezburger.com'
  “黎明的铅笔”  'http://pencilsatdawn.wordpress.com'
  “霍波托比亚”  'http://apelad.blogspot.com' //<——再次,禁止逗号!
}

分号被替换为康瓦塔逗号(快乐)斯图尔特?)(除了最后一个你需要省略的符号)等号变成冒号。如果属性(冒号左边的内容)中没有任何空格,甚至可以去掉引号:

var克里斯= {头发 “红色”年龄 三十二城市 伦敦
}

您可以使用对象属性当他们没有任何空间或对象[属性]当他们有空间的时候。例如:

var链接= {
  “可爱超载”  'http://cuteoverload.com'
  “我可以吃奶酪汉堡包”  'http://icanhascheezburger.com'
  “黎明的铅笔”  'http://pencilsatdawn.wordpress.com'
  “霍波托比亚”  'http://apelad.blogspot.com' //<——再次,禁止逗号!
}警觉的链接[“我可以吃奶酪汉堡包”]警觉的链接。臀部斜视

简单的if-else语句-使用三元符号询问和定义

您可以显著缩短简单的if语句。简单来说,我指的是一个if语句,它指定如下两个值之一:

  var裕桂
  如果城市= = 伦敦{裕桂= “克里斯”
  } 其他的 {裕桂= “埃里克”
  }

再一次,那里有很多重复。三元符号解决了这个问题:

var裕桂=城市= = 伦敦  “克里斯”  “埃里克”

那里有很多等号。也许一些括号会让它更清楚:

var裕桂= 城市= = 伦敦  “克里斯”  “埃里克”

这是怎么回事?定义变量裕桂给它赋值。然后你有一个声明,在这种情况下,变量的比较城市如果它等于字符串伦敦(==值和类型的测试,比==)安全得多。

然后你用问号问这个问题是否正确。冒号左边的选项是满足条件时问题的答案,而冒号右边的选项是不满足条件时问题的答案。任何可能是对或错的条件都可以放在括号内。

var方向= X<最大值  “左”  “对”

使用默认运算符提供回退选项

我最不想谈的是双管()默认运算符。当你想确定某个东西是用默认值设置的时候,这个非常有用。以下结构是不应再出现的内容:

  var部分=文件。GETeleMyByID“特殊”
  如果部分{部分=文件。GETeleMyByID“主要”
  }

再一次,无用的重复,同样可以写为:

  var部分=文件。GETeleMyByID“特殊” γ文件。GETeleMyByID“主要”

如果第一个未定义,第二个被指定为节的值。

谢谢你的时间!

我希望这有助于“普通的开发人员”理解如何在不降低可读性的情况下缩短JS。如果你想要更多关于这些商品的详细信息,看看道格拉斯·克罗克福德关于这件事的文章:

将对象作为参数发送–好还是坏?

星期三,11月7日,二千零七

我最近在函数和方法中看到的一个不同点是,人们似乎不再以某种形式期望参数的严格模式。如果回顾几年,您可能会记得如下功能:


函数dolayerfloat(id、start、end、direction、speed、fade、whatelse、iforgot){

}

这个,至少对我来说是相当烦人的,因为我记不清参数需要发送的顺序(调节输入PHP可能是困惑)。我一直看到的另一个问题是,如果您不想提供某些参数,但最后一个参数之一必须发送空字符串,甚至空值:


DolayerFloat('MyDiv',0,30,空,空,真,空,空){

}

/或
DolayerFloat(‘myDiv’,0,30,’,’,’,’,’,’,’){

}

这既令人困惑又令人费解。我看到的其他脚本通过使用arguments数组来解决这个问题,它至少允许发送灵活数量的参数。


函数DolayerFloat(ID){
var args=参数;
对于(var i=1);i<args.length;I++){

}

}

然而,现在我最喜欢的是实际使用几个已定义参数(或单个参数)的函数,允许它是多个对象,并允许您将对象作为属性发送:


DolayerFloat函数(ID,道具){
var elm=ID类型!=“字符串”?id:document.getElementByID(id);
对于(props中的var i){

}

}

这允许ID是元素引用或字符串,并将对象作为第二个参数,在该参数中,我可以定义我喜欢的顺序和数量(前提是该方法随后测试每个对象及其正确值):


dolayerfloat('x',开始:20,结束:30,淡出:真);
/或
DolayerFloat(MyElm,淡出:真,方向:'right');

这还允许您在不设置属性时定义默认值,你可以做的事PHP但不是在javascript中。在PHP,这工作:


函数foo($bar=2,$baz='foo')。{
}

在无法完成的javascript中,但是,如果使用对象,如果未设置属性,则可以预先定义:


DolayerFloat函数(ID,道具){
var elm=ID类型!=“字符串”?id:document.getElementByID(id);
props=道具
props.start=props.start 100;
props.fade=props.fade假;
}

你同意吗?还是对象的字面语法仍然太复杂?