七个最有用的JavaScript技巧-

此页面是否是列表页或首页?未找到合适正文内容。

七个最有用的JavaScript技巧-

如果你是一个JAVAScript新手或仅仅最近才在你的开发工作中接触它,你可能感到沮丧。所有的语言都有自己的怪癖(quirks)——但从基于强类型的服务器端语言转移过来的开发人员可能会感到困惑。我就曾经这样,几年前,当我被推到了全职JavaScript开发者的时候,有很多事情我希望我一开始就知道。在这篇文章中,我将分享一些怪癖,希望我能分享给你一些曾经令我头痛不已的经验。这不是一个完整列表——仅仅是一部分——但希望它让你看清这门语言的强大之处,可能曾经被你认为是障碍的东西。

我们将看下列技巧:

  • 相等
  • 点号vs括号
  • 函数上下文
  • 函数声明vs函数表达式
  • 命名vs匿名函数
  • 立即执行函数表达式
  • typeof vs Object.prototype.toString

1.) 相等

C#出身的我非常熟悉==比较运算符。值类型(或字符串)当有相同值是是相等的。引用类型相等需要有相同的引用。(我们假设你没有重载==运算符,或实现你自己的等值运算和GetHashCode方法)我很惊讶为什么JavaScript有两个等值运算符:==和===。最初我的大部分代码都是用的==,所以我并不知道当我运行如下代码的时候JavaScript为我做了什么:

var x = 1;

if(x == "1") {
console.log("YAY! They're equal!");
}

这是怎么回事?整数1是如何和字符串”1”相等的?

在JavaScript中,有相等(==)和严格相等(===)之说。相等运算符将强制转换两边的操作数为相同类型后执行严格相等比较。所以在上面的例子中,字符串”1”会被转换为整数1,这个过程在幕后进行,然后与变量x进行比较。

严格相等不进行类型转换。如果操作数类型不同(如整数和字符串),那么他们不全等(严格相等)。

var x = 1;

// 严格平等,类型必须相同
if(x === "1") {
console.log("Sadly, I'll never write this to the console");
}

if(x === 1) {
console.log("YES! Strict Equality FTW.")
}

你可能正在考虑可能发生强制类型转换而引起的各种恐怖问题——假设你的引用中发生了这种转换,可能导致你非常困难找到问题出在哪里。这并不奇怪,这也是为什么经验丰富的JavaScript开发者总是建议使用严格相等。

2.) 点号 vs 括号

这取决于你来自其他什么语言,你可能见过或没见过这种方式(这就是废话)。

// 获取person对象的firstName值
var name = person.firstName;

// 获取数组的第三个元素
var theOneWeWant = myArray[2]; // remember, 0-based index不要忘了第一个元素的索引是0

然而,你知道它也可以使用括号引用对象的成员吗?比如说:

var name = person["firstName"];

为什么会这样有用吗?而你会用点符号的大部分时间,有几个实例的括号使某些方法可能无法这样做。例如,我会经常重构大开关语句到一个调度表,所以这样的事情:

为什么可以这样用?你以前可能对使用点更熟悉,有几个特例只能用括号表示法。例如,我经常会将switch语句重构为查找表(速度更快),其实就像这样:

var doSomething = function(doWhat) {
switch(doWhat) {
case "doThisThing":
// more code…
break;
case "doThatThing":
// more code…
break;
case "doThisOtherThing":
// more code….
break;
// additional cases here, etc.
default:
// default behavior
break;
}
}

可以转化为像下面这样:

var thingsWeCanDo = {
doThisThing : function() { /* behavior */ },
doThatThing : function() { /* behavior */ },
doThisOtherThing : function() { /* behavior */ },
default : function() { /* behavior */ }
};

var doSomething = function(doWhat) {
var thingToDo = thingsWeCanDo.hasOwnProperty(doWhat) ? doWhat : "default"
thingsWeCanDo[thingToDo]();
}

使用switch并没有错误(并且在许多情况下,如果被迭代多次并且非常关注性能,switch可能比查找表表现更好)。然而查找表提供了一个很好的方法来组织和扩展代码,并且括号允许你的属性延时求值。

3.) 函数上下文

已经有一些伟大的博客发表了文章,正确理解了JavaScript中的this上下文(在文章的结尾我会给出一些不错的链接),但它确实应该加到“我希望我知道”的列表。它真的困难看懂代码并且自信的知道在任何位置this的值——你仅需要学习一组规则。不幸的是,我早起读到的许多解释只是增加了我的困惑。因此我试图简明扼要的做出解释。

作者: 雨林木风

为您推荐

返回顶部