搜索
首页web前端js教程javascript 面向对象编程 function是方法(函数)_js面向对象

好程序不是写给computer的,而是写给human的。遇到复杂功能,应该想着把它简化、组件化,把小功能封装成小组件,小功能块可以任意的组合得到千变万化的复杂功能。function就可以帮助我们把功能进行封装。那什么是封装呢。要我说,只要把具体实现给打包,对外提供调用接口那就是封装,方法也好、类也好就做了这些事。

      javascript中的function可以用来创建方法、也可以用来创建类,实际上我们可以认为是用function来模拟出的类(说到类一般都会要去了解闭包的知识)。还是先看一下方法吧。

       javascript函数分为有名函数、匿名函数和在匿名函数基础上延伸出来的立即执行函数。

       普通函数就是用function直接声明的有名函数。

    <SPAN class=kwrd>function</SPAN> Hello() {
      alert(<span class="str">"hello , everybody!"</span>);
    };
 
    Hello();
 
    <SPAN class=kwrd>function</SPAN> SayHelloTo(somebody) {
      alert(<span class="str">"hello , "</span> + somebody + <span class="str">"!"</span>);
    };
 
    SayHelloTo(<SPAN class=str>"张三"</SPAN>);

      上面分别创建了Hello和SayHelloTo方法。Hello不带有参数,直接通过Hello()来完成调用。SayHelloTo方法带有一个参数,向谁问候时需要知道是在问候谁。在调用SayHelloTo(“张三”)时要传入参数。这些代码和java、C#都没有什么太大区别。在方法重载上却有较大改变,javascript本身并不支持什么重载,一个方法名就对应一个方法。如果强制的写出多个同名方法,其实会出现先写的方法被覆盖掉的情况。

    <SPAN class=kwrd>function</SPAN> Hello() {
      alert(<span class="str">"hello , everybody!"</span>);
    };
 
    Hello();
 
    <SPAN class=kwrd>function</SPAN> Hello(somebody) {
      alert(<span class="str">"hello , "</span> + somebody + <span class="str">"!"</span>);
    };
 
    Hello(<SPAN class=str>"张三"</SPAN>);

 

               image image

      第一个Hello方法被覆盖掉,执行时直接调用Hello()则认为调用第二个Hello方法但没有传递参数值,所以弹出了undefined信息。调用Hello(“张三”)时很正常的完成执行。其实javascript也可以用一些直白的方式来完成重载。学过C#的人都会知道有个params关键字,通过它可以实现向方法传递不定个数的参数。我们可以通过对参数的信息做手动的判断也可以模拟出类似重载的效果。而在javascript中根本就不需要什么params关键字,就可以很自然的实现任意个数参数的传递。function中有个arguments属性,可以把它看成一个数组,它按传递进来的参数的顺序来保存所有的参数。也就是说我们在定义方法时可以不声明参数名。

    <SPAN class=kwrd>function</SPAN> ShowArguments() {
      <span class="kwrd">var</span> args = <span class="str">""</span>;
      <SPAN class=kwrd>for</SPAN> (<SPAN class=kwrd>var</SPAN> i = 0; i < arguments.length; i++) {
        args += arguments[i] + <span class="str">","</span>;
      };
      alert(args.substr(0, args.length - 1));
    };
 
    ShowArguments(1, 2, 3, 4, 5, 6, 7);

          image
      试着用argements来模拟一下重载。

    <SPAN class=kwrd>function</SPAN> Hello() {
      <span class="kwrd">if</span> (arguments.length == 0) {
        alert(<SPAN class=str>"hello , everybody!"</SPAN>);
      }
      <SPAN class=kwrd>else</SPAN> {
        alert(<span class="str">"hello , "</span> + arguments[0] + <span class="str">"!"</span>);
      };
    };
 
    Hello();
    Hello(<SPAN class=str>"张三"</SPAN>);

      基于参数个数不同的重载。

    <SPAN class=kwrd>function</SPAN> Increase(arg) {
      <span class="kwrd">if</span> (<span class="kwrd">typeof</span> arg == <span class="str">"undefined"</span>) {
        alert(<SPAN class=str>"请输入参数"</SPAN>);
      }
      <SPAN class=kwrd>if</SPAN> (<SPAN class=kwrd>typeof</SPAN> arg == <SPAN class=str>"string"</SPAN>) {
        alert(String.fromCharCode(arg.charCodeAt(0) + 1));
      }
      <span class="kwrd">if</span> (<span class="kwrd">typeof</span> arg == <span class="str">"number"</span>) {
        alert(arg + 1);
      }
    };
    Increase();
 
    Increase(<span class="str">"a"</span>);
    Increase(1);
      基于参数类型不同的重载。

      函数除了有名函数之外也可以是匿名函数,匿名函数就是没有名子的函数,不论函数有名还是没有名子,都是一个完整的函数对象。匿名函数还是用function来声明,但不用为它指定名称。其它的方面,比如参数等等和有名函数没什么区别。

    <SPAN class=kwrd>function</SPAN>() {
      ……
    };

      匿名函数一般可以满足临时的函数需求,不需要有变量对其进行引用(有名的函数可以认为是有变量引用的函数)。比如需要一个函数做为值对象做为参数传入方法、需要编程的方式为对象添加事件,用匿名函数都可以很好的完成。当然你也可以单独声明变量来引用某个匿名函数对象,这和普通有名函数就没什么区别了。

    <SPAN class=kwrd>function</SPAN> Each(array, fun) {
      <span class="kwrd">for</span> (<span class="kwrd">var</span> i = 0; i <pre class='brush:php;toolbar:false;'>        fun(array[i]);
      };
    };
    <span class="kwrd">var</span> nums = [1, 2, 3, 4, 5, 6, 7];
    Each(nums, <SPAN class=kwrd>function</SPAN>(arg) {
      alert(arg);
    });

      上面代码执行,依次输出数组中的元素。

    <SPAN class=rem>//在窗体加载时,在标题上显示当前时间</SPAN>
    window.onload = <span class="kwrd">function</span>() {
      document.title = <SPAN class=kwrd>new</SPAN> Date().toString();
    };
 
    <span class="rem">//也可以将匿名方法传入定时器中</span>
    setInterval(<SPAN class=kwrd>function</SPAN>() {
      document.title = <span class="kwrd">new</span> Date().toString();
    }, 1000);

      使用匿名函数绑定事件和进行定时操作。

    <SPAN class=kwrd>var</SPAN> Hello = <SPAN class=kwrd>function</SPAN>() {
      alert(<span class="str">"hello , everybody!"</span>);
    };

      如果将匿名函数赋给变量,那和有名的普通函数就没区别了。但不管是变量引用还是普通地有名函数,这样的函数在内存上都持久的占有一定资源。有时候我们只想执行一次大不必使用有引用的函数,直接执行匿名函数可能是最好的选择。把匿名函数包起来,加个括号执行,一切ok,这就是由匿名函数延伸出来的立即执行函数。

    (<SPAN class=kwrd>function</SPAN>() {
      alert(<span class="str">"hello , everybody!"</span>);
    })();
 
    (<SPAN class=kwrd>function</SPAN>(somebody) {
      alert(<span class="str">"hello , "</span> + somebody + <span class="str">"!"</span>);
    })(<SPAN class=str>"张三"</SPAN>);

      立即执行函数在做事件绑定,设置回调函数等方面往往会有意想不到的效果,可以解决诸如对象引用等问题。

    <SPAN class=kwrd>var</SPAN> student = {
      Name: <span class="str">"张三"</span>,
      Age: 20,
      Introduce: <span class="kwrd">function</span>() {
        alert(<SPAN class=str>"我叫"</SPAN> + <SPAN class=kwrd>this</SPAN>.Name + <SPAN class=str>",今年"</SPAN> + <SPAN class=kwrd>this</SPAN>.Age + <SPAN class=str>"岁了!"</SPAN>);
      } };
    window.onload = (<SPAN class=kwrd>function</SPAN>(obj) { <SPAN class=kwrd>return</SPAN> <SPAN class=kwrd>function</SPAN>() { obj.Introduce(); }; })(student);

      因为javascript中函数的这些特点加之它的对象的特征,我们还可以写出一些有functional意味的程序出来。其实javascript中function真的是老大。

    <SPAN class=kwrd>function</SPAN> Sum(fun, x) {
      <span class="kwrd">if</span> (x <pre class='brush:php;toolbar:false;'>        <SPAN class=kwrd>return</SPAN> 0;
      <span class="kwrd">return</span> fun(x) + Sum(fun, x - 1);
    };
  
    alert(Sum(<SPAN class=kwrd>function</SPAN>(i) { <SPAN class=kwrd>return</SPAN> i * i; }, 100));

      下面这又是什么呢?是方法吗?是类吗?

    <SPAN class=kwrd>function</SPAN> Point() {
      
    };

      先啰嗦到这,下次再看看类。

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
JavaScript评论:使用//和 / * * / * / * /JavaScript评论:使用//和 / * * / * / * /May 13, 2025 pm 03:49 PM

JavaScriptusestwotypesofcomments:single-line(//)andmulti-line(//).1)Use//forquicknotesorsingle-lineexplanations.2)Use//forlongerexplanationsorcommentingoutblocksofcode.Commentsshouldexplainthe'why',notthe'what',andbeplacedabovetherelevantcodeforclari

Python vs. JavaScript:开发人员的比较分析Python vs. JavaScript:开发人员的比较分析May 09, 2025 am 12:22 AM

Python和JavaScript的主要区别在于类型系统和应用场景。1.Python使用动态类型,适合科学计算和数据分析。2.JavaScript采用弱类型,广泛用于前端和全栈开发。两者在异步编程和性能优化上各有优势,选择时应根据项目需求决定。

Python vs. JavaScript:选择合适的工具Python vs. JavaScript:选择合适的工具May 08, 2025 am 12:10 AM

选择Python还是JavaScript取决于项目类型:1)数据科学和自动化任务选择Python;2)前端和全栈开发选择JavaScript。Python因其在数据处理和自动化方面的强大库而备受青睐,而JavaScript则因其在网页交互和全栈开发中的优势而不可或缺。

Python和JavaScript:了解每个的优势Python和JavaScript:了解每个的优势May 06, 2025 am 12:15 AM

Python和JavaScript各有优势,选择取决于项目需求和个人偏好。1.Python易学,语法简洁,适用于数据科学和后端开发,但执行速度较慢。2.JavaScript在前端开发中无处不在,异步编程能力强,Node.js使其适用于全栈开发,但语法可能复杂且易出错。

JavaScript的核心:它是在C还是C上构建的?JavaScript的核心:它是在C还是C上构建的?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; saninterpretedlanguagethatrunsonenginesoftenwritteninc.1)javascriptwasdesignedAsalightweight,解释edganguageforwebbrowsers.2)Enginesevolvedfromsimpleterterterpretpreterterterpretertestojitcompilerers,典型地提示。

JavaScript应用程序:从前端到后端JavaScript应用程序:从前端到后端May 04, 2025 am 12:12 AM

JavaScript可用于前端和后端开发。前端通过DOM操作增强用户体验,后端通过Node.js处理服务器任务。1.前端示例:改变网页文本内容。2.后端示例:创建Node.js服务器。

Python vs. JavaScript:您应该学到哪种语言?Python vs. JavaScript:您应该学到哪种语言?May 03, 2025 am 12:10 AM

选择Python还是JavaScript应基于职业发展、学习曲线和生态系统:1)职业发展:Python适合数据科学和后端开发,JavaScript适合前端和全栈开发。2)学习曲线:Python语法简洁,适合初学者;JavaScript语法灵活。3)生态系统:Python有丰富的科学计算库,JavaScript有强大的前端框架。

JavaScript框架:为现代网络开发提供动力JavaScript框架:为现代网络开发提供动力May 02, 2025 am 12:04 AM

JavaScript框架的强大之处在于简化开发、提升用户体验和应用性能。选择框架时应考虑:1.项目规模和复杂度,2.团队经验,3.生态系统和社区支持。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

EditPlus 中文破解版

EditPlus 中文破解版

体积小,语法高亮,不支持代码提示功能

SecLists

SecLists

SecLists是最终安全测试人员的伙伴。它是一个包含各种类型列表的集合,这些列表在安全评估过程中经常使用,都在一个地方。SecLists通过方便地提供安全测试人员可能需要的所有列表,帮助提高安全测试的效率和生产力。列表类型包括用户名、密码、URL、模糊测试有效载荷、敏感数据模式、Web shell等等。测试人员只需将此存储库拉到新的测试机上,他就可以访问到所需的每种类型的列表。

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

Atom编辑器mac版下载

Atom编辑器mac版下载

最流行的的开源编辑器