在JS中，如果存在同名同参的方法，它会先调用哪一个？先看两个例子：

例1:

<html>

<head>

    <title></title>

    <script type="text/javascript">

        function btnTest() {

            $f1();

            $f2();

        }

        function A() {

            alert();

        }

        var $f1 = A;

    </script>

    <script type="text/javascript">

        function A() {

            alert();

        }

        var $f2 = A;

    </script>

</head>

<body>

    <form>

        <div>

            <input type="button" name="Testing" onclick="btnTest();" value="TEST" />

        </div>

    </form>

</body>

</html>

结果会弹出：1    2

例2:

<html>

<head>

    <title></title>

    <script type="text/javascript">

        function btnTest() {

            $f1();

            $f2();

        }

        function A() {

            alert(1);

        }

        var $f1 = A;

        function A() {

            alert(2);

        }

        var $f2 = A;

    </script>

</head>

<body>

    <form>

        <div>

            <input type="button" name="Testing" onclick="btnTest();" value="TEST" />

        </div>

    </form>

</body>

</html>

结果会弹出：2    2

这和当前的代码段有很大关系，如果在两个同名同参的JS方法同一个代码段内部，则最后加载的方法会将前一个覆盖掉，反之，如果能在当前代码段找到对应的方法，就立即调用。

在JS中，如果存在同名不同参的方法，它会先调用哪一个？再看两个例子：

例1:

<html>

<head>

    <title></title>

    <script type="text/javascript">

        function btnTest() {

            var val = document.getElementById("txtVal").value;

            if (val > 10) {

                A();

            }

            else {

                A(val);

            }

        }

        function A() {

            alert(1);

        }

        function A(val) {

            alert(2);

            alert(val);

        }

    </script>

</head>

<body>

    <form>

        <div>

            Input Value(INT):<input type="text" id="txtVal"/><br>

            <input type="button" name="Testing" onclick="btnTest();" value="TEST" />

        </div>

    </form>

</body>

</html>

例2:

<html>

<head>

    <title></title>

    <script type="text/javascript">

        function btnTest() {

            var val = document.getElementById("txtVal").value;

            if (val > 10) {

                A();

            }

            else {

                A(val);

            }

        }

        function A() {

            alert(1);

        }

    </script>

    <script type="text/javascript">

        function A(val) {

            alert(2);

            alert(val);

        }

    </script>

</head>

<body>

    <form>

        <div>

            Input Value(INT):<input type="text" id="txtVal"/><br>

            <input type="button" name="Testing" onclick="btnTest();" value="TEST" />

        </div>

    </form>

</body>

</html>

测试结果：同名不同参的方法会用最后加载的方法会将前一个覆盖掉！

JavaScript 同名方法的处理的更多相关文章

  1. 页面 JavaScript 存在多个同名方法的调用分析

    在 JavaScript 中,不存在方法重载的概念,方法重载指的是可以定义不同类型的参数和参数个数的同名方法,然后可以按需调用. 如需实现按参数个数的不同去执行不同的方法主体,正确的做法是通过定义一个 ...

  2. es6 javascript对象方法Object.assign()

    es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1  基本用法 Object.assign方法用于对象的合并,将源对象 ...

  3. JavaScript - reduce方法,reduceRight方法 (Array)

    JavaScript - reduce方法 (Array) 解释:reduce() 方法接收一个函数作为累加器(accumulator),数组 中的每个值(从左到右)开始合并,最终为一个值. 语法:a ...

  4. JavaScript slice() 方法

    JavaScript slice() 方法  JavaScript Array 对象 实例 在数组中读取元素: var fruits = ["Banana", "Oran ...

  5. JavaScript toLocaleString() 方法

    JavaScript toLocaleString() 方法 JavaScript Array 对象 定义和用法 把数组转换为本地字符串. 语法 arrayObject.toLocaleString( ...

  6. 关于JavaScript lastIndexOf() 方法 w3school.com.cn写的不一定全对

    关于JavaScript lastIndexOf() 方法 w3school.com.cn的表述是 定义和用法 lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的 ...

  7. javascript一些方法兼容

    javascript一些方法兼容 标签(空格分隔): javascript 方法收集 [TOC] Object.keys 参考地址 if (!Object.keys) Object.keys = fu ...

  8. 在Swift中使用JavaScript的方法和技巧

    本文作者Nate Cook是一位独立的Web及移动应用开发者,是继Mattt大神之后NSHipster的主要维护者,也是非常知名活跃的Swift博主,并且还是支持自动生成Swift在线文档的Swift ...

  9. 把C编译成javascript的方法

    把C编译成javascript的方法,便于嵌入到HTML5中 https://github.com/kripken/emscripten

随机推荐

  1. JAVA基础知识之多线程——线程组和未处理异常

    线程组 Java中的ThreadGroup类表示线程组,在创建新线程时,可以通过构造函数Thread(group...)来指定线程组. 线程组具有以下特征 如果没有显式指定线程组,则新线程属于默认线程 ...

  2. ADO SQL属性扩展————多表组合成新的更完整的表

    create database guoji--建立数据库 go use guoji go create table xinxi--建立表一 ( name ), minzu ) ) '); '); ') ...

  3. Nginx架构的企业级应用

    Nginx架构的企业级应用 ==================================================== 实现HA高可用集群 实现LB负载均衡集群 Nginx实现反向代理 ...

  4. 微软的决心，开发者的信心！惊喜的 Connect(); // 2016

    微软的决心,开发者的信心!惊喜的 Connect(); // 2016   Visual Studio for Mac 2014 年 11 月 13 日,微软宣布 .NET 开源与跨平台.两年后的今天 ...

  5. （1）编写一个接口：InterfaceA，只含有一个方法int method(int n)； （2）编写一个类：ClassA来实现接口InterfaceA，实现int method(int n)接口方 法时，要求计算1到n的和； （3）编写另一个类：ClassB来实现接口InterfaceA，实现int method(int n)接口 方法时，要求计算n的阶乘（n!）； （4）编写测试类E测试

    package a; public interface InterfaceA { int method(int n); } package a; public class ClassA impleme ...

  6. Spring MVC 详解（一）

    springmvc是spring的一个模块,提供web层解决方案(基于mvc设计架构),mvc是一个设计模式,在b/s系统的应用: spring 的架构 mvc设计模式 spring MVC的框架 第 ...

  7. Gradle的配置实例

    错过了Maven,但是遇到了Gradle. 网上关于Gradle的讲解和培训已经很多了. 我就直接贴几个我测试过的配置文件吧: ① 依赖maven资源库 repositories { mavenCen ...

  8. [51NOD1007] 正整数分组（DP，记忆化搜索）

    题目链接:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1007 dp(id, s)表示第id个数之前,其中一个集合和为s ...

  9. struts2——通配符

    struts2的配置文件是 struts.xml.. 在这个配置文件里面可以使用通配符..其中的好处就是,大大减少了配置文件的内容..当然,相应付出的代价是可读性.. 使用通配符的原则是 约定高于配置 ...

  10. Java Web表达式注入

    原文:http://netsecurity.51cto.com/art/201407/444548.htm 0×00 引言 在2014年6月18日@终极修炼师曾发布这样一条微博: 链接的内容是一个名为 ...