Question

我刚刚开始编程，我一直在玩它。我在lynda.com上看了一个编程课程，但它并没有很好地涵盖功能，我知道它们是什么，但我不知道不同的功能格式或如何调用它们。我知道如何称呼这样简单的事情：

var foo=function {
    //code...
}

但是我想使用更复杂的东西（我正在开始使用HTML）：

$(document).keypress(function(e)) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }
});

或者只是其他任何风格。

Answer 1

没有不同格式的功能。所有这些都使用function关键字后跟参数和正文定义。如果您有一个函数foo，那么您可以通过foo();调用它（您也可以传递参数foo(1,2,3);）。有更复杂的方法来调用函数，例如通过foo.call或foo.apply，但我认为没有必要在这里讨论它。

请注意，JavaScript中的函数是一等公民。这意味着它们可以被视为对象。特别是你可以将它们传递给另一个函数。看看这个例子：

var foo = function(fn) {
    return fn()+1;
};

这里发生了什么？ foo将函数作为参数（我们知道因为fn()在body中调用），所以调用它并将1添加到结果中。所以如果我这样打foo：

foo(function() {
    return 1;
});

结果会是什么？这是一个简单的例子。考虑更复杂的事情：

var foo = function(list, fn) {
    var res = [];
    for (var i = 0; i < list.length; i++) {
        var mapped = fn(list[i]);
        res.push(mapped);
    }
    return res;
};

这是列表上.map方法的简单版本。因此它将列表和函数作为参数，然后将函数应用于列表的每个元素并返回一个新列表：

> foo([1, 2, 3], function(el) { return -el; });
[-1, -2, -3]

与调用

相同

> [1, 2, 3].map(function(el) { return -el; });
[-1, -2, -3]

Answer 2

声明功能的不同方式

function A() {};            // function declaration

var B = function() {};      // function expression

var C = ( function() {} );  // function expression with grouping operators

var D = function foo() {};  // named function expression

var E = ( function() {      // immediately-invoke function expression (IIFE) that returns a function
  return function() {}
})();

var F = new Function();     // Function constructor

var G = new function() {};  // special case: object constructor

Answer 3

您的代码实际上是不同类型函数的一个很好的例子。首先是$（），它代表了JQuery库 - 一个有用的JavaScript附加组件。您通常会给它一个名为CSS选择器的字符串，这是一种挑选文档的一部分（或多个部分）的方法。在这种情况下，你要选择整个文档，但你也可以说像$（“＃logo”）这样会返回一个id =“logo”或$（“img”）的文档将返回所有元素在文件中。

JS中的对象可以是任何东西，并且有不同类型的对象。每种类型的对象都有可用的特殊功能。这些函数称为方法。

在上面的示例中，$（document）返回的文档对象具有可用的.keypress（）方法，该方法侦听特定的按键。 Keypress需要知道按下按键时要做什么，并且通过给它一个函数作为参数来实现。每次按下一个键都会执行该功能。

有一点关于JavaScript的有用之处在于，函数被认为是“一等公民”，这意味着就JavaScript而言，它们与直接值一样好。所以，如果我有一个像：

这样的功能

    var myString = function(word)
    {
       return word;
    }

如果我这样做：

     var myWord = "hello";

它与：

相同

     var otherWord = myString("hello");

如果我比较它们：

    var compareWords = function(word1, word2)
    {
        return word1 == word2;
    }

    var compareMyWords = compareWords(myWord, otherWord);

与说

相同

    var compareMyWords = true;

这一点很重要，因为它意味着函数可以将其他函数作为参数而没有问题。我们看到在按键方法中发生了这种情况。可能有点难以注意，但如果您事先声明了该函数，则可以看到它：

var keypressFunction =  function(e)) {
    if(e.which == 13) {
        alert('You pressed enter!');
    }

以下内容与您的示例相同：

 $(document).keypress(keypressFunction);

不同之处在于您的示例使用匿名函数。它没有用“var”或“function”声明，所以如果我愿意，我就无法重用它。这不是一件坏事。当你进入更高级的东西时，匿名函数非常有用。

您的匿名函数允许使用一个参数，一个表示实际按下的键的对象。在这种情况下，如果按下13表示的键（Enter），它只想做某事。

最后是警报功能，会弹出一条消息。请注意，函数并不总是必须返回值。通常当他们不这样做时，他们会对他们的环境做一些事情（否则有什么意义）。在你的例子中，只有一个函数实际上返回一些东西 - $（）函数，虽然没有用它来完成，但是你可以继续使用句点替换末尾的分号并使用ready（）方法或者任何方法都是可用于$（文档）返回的对象。实际上，只要您知道要返回的对象类型，就可以执行以下操作：

    $("#message").addClass("alert").fadeIn().delay().fadeOut();

因为这些方法中的每一个都返回相同的对象，所以我们可以执行“方法链接”。 jQuery故意尝试使其大多数方法返回它所执行的DOM对象，以便您可以执行此操作。其他库，如d3.js，使用方法链进行一些非常酷的视觉转换。

我认为开始使用jQuery并不像其他人可能建议的那样可怕。它仍然是JavaScript。可以说，JQuery会强迫你学习高级概念（回调，CSS选择器等），否则你可能会在不知情的情况下蹒跚多年。我还可以说，在学习编程时，JavaScript本身就是一种糟糕的语言。

相反，我会说潜水，玩得开心！最终的目的是建立令人敬畏的东西和不要因为必须以正确的方式去做而瘫痪。在学习和构建之间找到一个很好的平衡，并且不要被那些来到这里的少数嫉妒的stackoverflow用户嗤之以鼻，以扼杀他们曾经在制作令人敬畏的东西时所带来的快乐。

Answer 4

我想知道如何在Javascript中调用不同类型的函数，因此必须了解所有JavaScript函数类型。以下是将您带到的链接：

All JavaScript Function Types?

Answer 5

我个人认为你过度复杂了。是的，编写函数的不同方式往往有不同的名称（函数，匿名函数，colosure，lambda，....）但最后它的所有函数：他们将几个陈述合并为一个。

例如：

// Crating a function (most commomn way)
function a() { 
    alert('a'); 
};

// Creating a anonymous (nameless) function and assigning it to b
var b = function() { 
    alert('b'); 
};

var c = a;
var d = b;

var e = {}; 
// Creating a function that accepts a function and executes it.
// This is in essence what $(document).keypress() does
e.f = function(f){
    f();
};

// Alerts: a
a();

// Alerts: b
b();

// Alerts: a
c();

// Alerts: b
d();

// Sample how you can call $(document).keypress() 
// Alerts: c
e.f( function() {
    alert('c');
});

// Alerts: a
e.f(a);

// Alerts: b
e.f(b);

如何在Javascript中调用不同类型的函数

5 个答案: