什么是JavaScript函数接受变量的正确方法

我是新来的JS和关于这个问题，我希望你能理解这个问题有点糊涂：什么是JavaScript函数接受变量的正确方法

当我想在一个功能的使用变量从另一个到来，或事件来如onClick等。这将是它从HTML或其他功能移动到执行功能

工作的正确方法（尚未很好。）例如：我有几个多选择题页面，每个问题是一种新的形式，我想有一个功能对所有提交按钮，并提交检测形式的名称时，所以我应该使用onsubmit="validate(this)？还是有更好的方式来采取的形式的名称，并把它放到validate功能，

，并在一般情况下，当我使用function something(){}，我想让它变得变量从外面做我必须做function something(a,b,c){}或做它取决于变量的范围？嗯..我甚至不知道我的理解不够，制定一个很好的问题，所以对这个主题的文章或教程的任何引用都会有很大的帮助。

来源

2011-05-12 ilyo

因此，JavaScript有几个核心功能概念应该能够提供帮助。首先和formost：为了处理DOM事件，你可能会想要依赖一个库，除非你真的有0浏览器兼容性的期望。我建议看看jQUery。

这就是说，不显眼的JavaScript（每@Raynos答案）是绑定的事件在JavaScript中以正确的方式，并为您提供了很大的灵活性。采取下面的例子：

function setup_events(){ 
    var my_form = document.form[0], 
     form_name = my_form.name; 
    my_form.addEventListener("submit", function(event) { 
    console.log(form_name); // this is retained through the closure. 
    }); 
}

你看你可以通过使用闭合的概念，或外部范围的上下文中，外范围已从内部范围内返回后结合数据转换成事件的功能。现在，当您执行setup_events时，您将绑定submit事件与一个内部有权访问外部变量form_name的函数。这可能会产生一些讨厌的副作用，如果你不明白的功能范围，从而寻找出这样的代码：

// XXX : BAD CODE 
function setup_events(){ 
    var ul = document.getElementsByTagName('ul')[0], // assumes there is a <ul> 
     count = 0; 
    for (var li in ul.childNodes) { 
    li.addEventListener('click', function(event){ 
     alert(count ++); // this will always alert the count of list, not the list position 
    } 
    } 
}

您可以使用Immediately Invoked Function Expressions创造必要关闭，以保持正确的状态。因此，“修复”上面的代码，你会使用类似：

// XXX : BETTER CODE 
/** 
* NOTE: NEVER CREATE FUNCTIONS INSIDE A LOOP 
* this example only shows the immediate solution to the above problem 
* with regard to function scope and closures. 
*/ 
function setup_events(){ 
    var ul = document.getElementsByTagName('ul')[0], // assumes there is a <ul> 
     count = 0; 
    for (var li in ul.childNodes) { 
    li.addEventListener('click', (function(count){ 
     return function (event){ 
     alert(count); // this will alert the position in the list 
     }; 
    })(count ++)) 
    } 
}

来源

2011-05-12 16:08:28 Gabriel

骨干非常棒，但它不是一个DOM库，它是一个代码结构库。 jQuery的一个好的替代方法是ender。（骨干的一个很好的选择是脊柱）。第二个例子还有在循环中创建函数的_BIG_问题。这是一个缺乏块范围的常见例子，但它仅仅是糟糕的代码。 – Raynos 2011-05-12 16:16:49

@Raynos我同意在循环中创建函数是不好的代码，但不想变出另一个使用示例。我会在示例中注意代码的不好之处。 – Gabriel 2011-05-12 16:20:55

我们需要一个很好的例子来理解块范围的问题:)我还没有找到一个，这只是一个陷阱而不是糟糕的代码。 – Raynos 2011-05-12 16:24:28

那么如果你有一个功能，如：

function something(){ 
... 
}

你仍然可以做这样的事情：

something(1,2,3);

的结果将是一个关联对象的功能，这样你就可以访问它们像这样：

function something(){ 
    //check for args: 
    if(arguments === undefined){...} 
    arguments[0]; //which is 1 in our case 
    //etc 
}

但参考一on{something}，你通常要通过this，或者使用某种类型的事件处理程序

来源

2011-05-12 15:48:09 Neal

的，我会建议取消碍眼的JavaScript。

document.form[0].addEventListener("submit", function(event) { 
    switch (event.target.name) { 
     // switch form name. 
    } 
});

当你设计一个通用函数时，你应该考虑你想接受的参数。

例如

function addNumbers(one, two) { 
    // add them 
}

旨在利用两个数字。因为他们是设计以正确的参数，你应该用你的功能。

<div id="bar"> 3 </div> 

... 

(function() { 
    // local variables 
    var one = 1; 
    var two = 2; 

    // Your getting number 3 globally from the HTML. 
    var three = document.getElementById("bar").textContent; 

    // passed in as parameters 
    console.log(addNumbers(one, two)); // 3 
    console.log(addNumbers(two, three)); // 5 

})(); 
console.log(one) // undefined.

来源

2011-05-12 15:49:27 Raynos

好，但是说一两是全球性的，如果我只是使用函数addNumbers（）{ someUseForOne =一个 }' – ilyo 2011-05-12 15:55:45

@llyaD，我们会不惜一切代价避免全局变量。 – Raynos 2011-05-12 15:57:50

@Raynos好的，但如果他们来自外部功能，他们已经是全球性的，或者我误会了？ – ilyo 2011-05-12 16:02:00

你可以做这样的事情，不完全是，但你的想法：

function onSubmitClick(){ 
    if(document.getElementById('choice1').checked==true){ 
     //store result 
    }else if((document.getElementById('choice2').checked==true){ 
     //store result 
    }else if(document.getElementById('choice3').checked==true){ 
     //store result 
    }else if(document.getElementById('choice4').checked==true){ 
     //store result 
    }else{ 
     //they didn't choose any

来源

2013-06-28 03:51:55

什么是JavaScript函数接受变量的正确方法

回答

相关问题