每个JavaScript程序员应该知道什么?

时间:2010-04-13 10:13:22

标签: javascript programming-languages

每个JavaScript程序员都应该知道一组能够说“我知道JavaScript”的东西吗?

30 个答案:

答案 0 :(得分:590)

不是jQuery。不是YUI。不是(等等)

框架可能很有用,但它们经常隐藏有关JavaScript和DOM实际上如何工作的有时丑陋的细节。如果您的目标是能够说“我知道JavaScript”,那么在框架中投入大量时间就与此相反。

以下是一些JavaScript语言功能,您应该知道它们正在做什么并且没有被发现,但这对许多人来说并不是很明显:

  • object.propobject['prop']是一回事(所以请你停止使用eval,谢谢);对象属性总是字符串(即使对于数组); what for...in is for(和what it isn't)。

  • 属性嗅探; undefined是什么(和why it smells);为什么看似鲜为人知的in运算符是有益的,与typeof / undefined检查不同; hasOwnProperty; delete

  • 的目的
  • Number数据类型实际上是一个浮点数;使用花车的语言独立困难;避免parseInt八进制陷阱。

  • 嵌套函数范围;在你希望避免意外全局变量的范围内使用var的必要性;范围如何用于闭包; closure loop problem

  • 全局变量和window属性如何冲突;全局变量和文档元素不应该如何冲突,而是在IE中发生冲突;在全局范围内使用var的必要性也是为了避免这种情况。

  • function语句如何在前面的代码之前对“hoist”定义起作用;函数语句和函数表达式之间的区别;为什么命名函数表达式should not be used

  • 构造函数如何运行,prototype属性和new运算符确实有效; methods利用它来创建你真正想要的普通类/子类/实例系统;当你可能想要使用基于闭包的对象而不是原型时。 (大多数JS教程材料在这方面都非常糟糕;我需要花费数年的时间才能完全理解它。)

  • this如何在通话时确定,而非约束;因此,如何从其他语言中传递doesn't work like you expect方法;如何使用闭包或Function#bind来解决这个问题。

  • 其他ECMAScript第五版功能,如indexOfforEach和功能编程methods on Array;如何修复旧浏览器以确保您可以使用它们;使用内联匿名函数表达式来获得紧凑,可读的代码。

  • 浏览器和用户代码之间的控制流程;同步和异步执行;在控制流(例如焦点)内发生的事件与控制返回时发生的事件和超时;如何调用像alert这样的所谓同步内置函数最终会导致潜在的灾难性重入。

  • 跨窗口脚本如何影响instanceof;跨窗口脚本如何影响跨不同文档的控制流; postMessage将如何解决此问题。

有关最后两项的信息,请参阅this answer

最重要的是,你应该批判性地查看JavaScript,承认它是历史原因的一种不完美的语言(甚至超过大多数语言),并避免其最糟糕的麻烦。克罗克福德在这方面的工作绝对值得一读(虽然我并不是100%同意他的“好零件”)。

答案 1 :(得分:248)

可以禁用它。

答案 2 :(得分:75)

理解用Crockford Javascript: The Good Parts写的东西是一个很好的假设,一个人是一个体面的JS程序员。

你几乎可以知道如何使用像JQuery这样的好库,但仍然不知道Javascript的隐藏部分。

另一个注意事项是各种浏览器上的调试工具。 JS程序员应该知道如何在不同的浏览器中调试他的代码。

哦!知道JSLint会完全伤害你的感情!!

答案 3 :(得分:49)

如果你想成为一名真正的JavaScript忍者,你应该知道Perfection kills JavaScript Quiz中每个问题的答案。

一个激发你胃口的例子:

(function f(f){ 
  return typeof f(); 
})(function(){ return 1; });
  

这个表达式会返回什么?

     
      
  • “数量”
  •   
  • “未定义”
  •   
  • “功能”
  •   
  • 错误
  •   

答案 4 :(得分:46)

如果你不知道,你不懂JavaScript:

  1. 闭包
  2. 基于原型的继承
  3. 模块模式
  4. W3C-DOM
  5. 活动如何运作

答案 5 :(得分:37)

.. javascript不是java:)

许多人从网站开发开始告诉我,javascript只是简单的java!

答案 6 :(得分:27)

  1. 熟悉至少一个Javascript库(Jquery,Prototype等)。

  2. 了解如何使用主流浏览器的调试工具(MSIE 7-8,Firefox,Chrome,Safari)

  3. 阅读行业:Douglas Crockford的网站是一个宝库,而Ajaxian.com是一个很好的博客,可以跟上Javascript的新的,有趣的或奇怪的想法。还有很多其他资源,但那些资源对我帮助最大。

答案 7 :(得分:24)

Javascript 对象和功能一等公民回调,不要忘记事件然后的 JQuery

答案 8 :(得分:24)

Javascript不是一小时内可以学到的东西!

答案 9 :(得分:23)

变量是全局变量,除非声明为本地变量!!

坏(DoSomething()仅被调用10次):

function CountToTen()
{
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

好(DoSomething()按预期调用50次):

function CountToTen()
{
  var i;
  for(i=0; i< 10; i++)
  {
    DoSomething(i);
  }
}

function countToFive()
{
  var i;
  for(i=0; i<5; i++)
  {
    CountToTen();
  }
}

CountToFive();

答案 10 :(得分:20)

答案 11 :(得分:8)

应该注意以下内容来说“我知道JavaScript”:

  1. JavaScript很好,但 DOM是痛点
  2. 跨浏览器问题会让你发疯“
  3. 除非代码在至少4个不同的好浏览器上进行测试,否则您无法说明其无bug
  4. 关闭 ..............必须知道
  5. 它的原型基于 ...........很高兴了解这个
  6. 调试器关键字.....帮助陷入危机

答案 12 :(得分:8)

要知道Javascript最初被称为 LiveScript ,并且出于营销目的附加了“Java”前缀,而不是因为Java和Javascript是相关的(它们不是)。

哦,拥有任何版本的David Flanagan的'Javascript:The Definitive Guide'(此信息在第2页)。

...并且为了欣赏那些曾经试图混淆Internet Explorer 4的document.all []和Netscape Navigator 4的document.layers []之前的那些,在Jquery之前消除了这些痛苦。

修改

正如@Kinopiko指出JavaScript最初称为项目Mocha(some sources也认为它被称为项目LiveWire)但人们普遍认为该语言(由Brendan Eich编写)之前将被发布为LiveScript Java前缀于1996年初发布时采用。

答案 13 :(得分:7)

每个javascript编码器应该知道什么?

怎么样,我可以通过2次点击来关闭你的努力。因此,如果可能的话,提供一个后备。

答案 14 :(得分:7)

JavaScript与其他语言的区别远远超出您的想象。观看这个精彩的Google Tech Talk,以获得一个印象:http://www.youtube.com/watch?v=hQVTIJBZook

答案 15 :(得分:6)

如果你能有效地使用数组,数字,字符串,日期和对象,你就知道了javascript。加上Math和RegExp的积分。您应该能够编写函数并使用变量(在正确的范围内,即作为对象的'方法')。

我看到一些关于知道闭包,奢侈函数语法,blabla的评论。所有这一切都与这个问题无关。如果你可以在11秒内跑完100米短跑,那就像说你是跑步者。

我说可能需要几周的时间才能熟练使用javascript。在此之后,需要数年和数十本书以及数千行编程才能成为专家,忍者等。

但那不是问题。

哦,DOM不是javascript的一部分,也不是jQuery。所以我认为两者同样与这个问题无关。

答案 16 :(得分:6)

我强烈建议您阅读Javascript: The Good Parts

答案 17 :(得分:4)

array length方法不是数组项的计数,而是最高索引。即使该项目设置为undefined

var a = [];
a.length;   // === 0
a[10];      // === undefined
a[10] = undefined;
a.length;   // === 11
a.pop();    // === undefined
a.length;   // === 10

这种行为很难与语言设计错误区别开来。

答案 18 :(得分:4)

答案 19 :(得分:4)

通过阅读以上所有内容,使用jQuery等框架学习Javascript也是完全正常。事实上,这是许多人首先选择JS的第一种方式。 没有羞耻。

答案 20 :(得分:3)

jQuery是我最好的推荐。不只是代码本身,它的成语,风格,背后的思想最值得仿效。

答案 21 :(得分:3)

学习一门语言并理解其各种怪癖来自(多年)经验。如果你想成为一个更好的程序员,我会说,理解设计模式,如何以及何时使用它们和/或甚至当你使用它们而没有意识到它时;技术架构和用户体验。

了解(JavaScript)语言意味着您可以选择任何框架并随意使用它。您将不可避免地需要深入了解源代码,如果您只知道框架或2或3的语法,那么您将不会走得太远。在说,进入一些不同的框架的源代码可能是了解如何使用JavaScript的最佳方式之一。通过单步执行Firebug或Web Inspector中的代码,然后检查JavaScript文档,尤其是Mozilla和Webkit文档,来进一步了解您正在查看的内容。

理解面向对象和功能编程之间的区别,JavaScript是两者的性感组合,何时以及如何使用它们来创建杀手级代码库和优秀的应用程序将使您成为更好的JavaScript程序员。

简单地阅读一些书籍,特别是Crockford的“好的部分”,它只是表达了他对JavaScript的好处的看法,而跳过JavaScript的大部分AWESOME部分会让你走错了路。

另一方面,检查由Thomas Fuchs这样的人编写的代码可以让您更深入地了解编写出色而高效的JavaScript的能力。

试图记住一些陷阱或WTF也不会有太大的帮助,如果你开始编码并逐步执行库/框架代码,特别是一个有用的注释代码,你会选择它,看看为什么它们'我使用了某些属性/值,而不是其他的为什么以及何时使用特定的操作数和运算符,这就是框架人员使用的代码。比通过实例学习更好吗? :^)

答案 22 :(得分:3)

javascript是世界上部署最广泛的语言。 (可能)

答案 23 :(得分:2)

在Javascript中,性能很重要。

没有智能编译器来优化您的代码,所以在编写javascript代码时应该比C#,Java等语言更加小心......

答案 24 :(得分:1)

对象文字,因为它们很好写。

答案 25 :(得分:0)

以下事项也很重要:

1)可变吊装。 2)范围链和激活对象。

然后是这样的事情::)

3)wtfjs.com

4)everything is an object http://www.lifeinafolder.com/images/Js.jpg

答案 26 :(得分:0)

  1. 知道生活中有没有with()以及在哪里划线。
  2. 您可以使用throw语句创建自定义错误,以便有意停止javascript运行时。

答案 27 :(得分:-1)

JavaScript不支持将 return 关键字和return语句与换行符分开,如下面的代码(或在my jsFiddle page处尝试)

function foo()
{
    return
    {
        bar: 'something'
    };
}

$(function()
{
    document.write(foo());
});

我不明白为什么JavaScript不支持这种风格,因为与默认的JavaScript风格相比,阅读非常复杂的JavaScript源代码要容易得多。

PS。我写了近6年的JavaScript。但是当我尝试执行以下功能时,我刚刚发现了这个错误。它总是返回undefined。当我使用调试器并进入此功能时,一切正常。我认为它应该是我生命中最糟糕的编程错误。

function JqGridInlineEditor_GenerateTool(cellvalue, options, rowObject, disableEdit, disableDelete)
{
    return 
        (!disableEdit ? '<a class="button edit" href="javascript: void(0);" onclick="JqGridInlineEditor_EditRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Edit.gif'), 'Click here to Edit or \nDouble-click row to edit.') : '') +
        (!disableDelete ? '<a class="button delete" href="javascript: void(0);" onclick="JqGridInlineEditor_DeleteRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Delete.png'), 'Click here to Delete or \nSelect row and then press Delete') : '') +
        (!disableEdit ? '<a class="button save" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_SaveRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Save.png'), 'Click here to Save or \nPress Enter') : '') +
        (!disableEdit ? '<a class="button cancel" style="display:none" href="javascript: void(0);" onclick="JqGridInlineEditor_RestoreRow(this, \'{0}\');return false;" title="{2}"><img src="{1}" alt="{2}" /></a>'.format(options.rowId, getUrl('~/Content/Icons/Cancel.png'), 'Click here to Cancel or \nPress Esc') : '');
}

答案 28 :(得分:-3)

由于JS是一种函数式语言,一个不错的JS程序员必须能够编写Y-combinator并解释它是如何工作的。

答案 29 :(得分:-5)

...关于Google Web Toolkit,这意味着您的javascript项目可能会以更加方便的方式开发。