zoukankan      html  css  js  c++  java
  • javascript 函数与对象

           javascript中的函数是非常重要的概念,也是比较难于理解的一个知识点! 下面就来聊聊函数;

           JS基于对象:什么是基于对象呢?简单的说所有代码都是"对象";

           比如函数:

           function person(){

            }

          person();//1 调用函数;

           比如变量: var  x=5;

            x=6     // 2 重新为x赋值;

            上面的函数和变量都是对象;所有的函数都是Function类的对象,x是Number类的对象。相当于 var x=new Number(5);

            注意: function person(){}没有指明是哪个对象的方法,那么默认就是window对象的方法,变量没有指明是谁的变量,那么同样是window对象的属性; 1,2处其实就是window.person() window.x=6;是一样的,只是省略了window罢了。

           函数的创建:3种方式;

            (1) function person(参数){函数体} 这是一种比较常见的方式;

            (2)  var person=function(){};  匿名函数---- 在今后的代码段中基本上使用这种方式;

            (3)   var person=new Function("参数","参数"......"函数体");   这方式基本上不用,函数体多的时候可读性极差!

           局部函数:函数里面的函数;

         var person=function(){

             var name="";

           var getName=function () {    //这个就是局部函数!

            return name;

             }

         };

          new person().getName();//1

          getName();//2

          注意:1正确的调用方式,2是错误的---在函数体之外的地方不可以直接调用局部函数;

         

           函数的4个属性:函数,方法,对象,类;

          在很多人看来函数和方法是一回事,是的,都有点点不同;看完下面就知道。

          先写一个函数:function person(){ retun 0;}

         (1)作为函数:就这样看,我们知道他就是一个实现 return 0的函数;就是这么简单;

         (2)作为对象:不用多说,所有的函数都是Function的对象。这就是函数作为对象;

         (3)作为类:function就是一个类 上面的函数就是一个名叫”person“的类,当然也可以new对象;下面会重点讨论。

         (4)作为方法:就是以属性的形式定义在类里面,称为方法---和函数有点点区别! 其实独立的函数是对象window的方法;具体有什么不同,也说不清楚!

        

            函数作为类时:属性有类属性和对象属性之分(和Java中的static是差不多的)

            function person(name,sex)

           {  

               this.name=name;    this.sex=sex; //这2个是对象属性,不同的对象属性是不一样的。

               person.nation="cn";//  这个是类属性,所有的对象共有;不能使用 对象.nation 的方式调用!

               this.getName=function(){ return this.name;} //对象属性

           }

          从上面可以看出this后面的是对象属性,类名后面的是类属性;

        

           调用函数的3种方式

            第一种:对象.函数名; 这种最常使用,也是最简单的一种;

            第二种:函数名.call(对象,参数列表)==对象.函数名; 几乎上是一样的;

            第三种:函数名.apply(对象,数组);

            下面来演示第二种:

          <script type="text/javascript">
          var each=function (array,fn)
         {
           for(x=0;x<array.length;x++)
          {
              fn.call(null,x,array[x]);
              //fn(x,array[x]);这样也是可以的;
          }
         }

         each([4,20,3],function(x,a){
            document.write("第"+x+"个元素值为:"+a+"<br/>");
        });

          函数的独立性:很有意思的特性;

           每个函数都是有自己的归属(对象或者是类),怎么说他有独立性呢?看下面代码:

           function person(name,sex)

           {  

               this.name=name;    this.sex=sex;

               person.nation="cn";

               this.getName=function(){ return this.name;}  //这是属于person类的函数,在这里习惯称为方法;

           }

         var p=new person(("andy","man"));//创建一个对象

          p.getName(); //这样是可以的,对象.方法 this此时是指p对象;

          p.name="ANDY1995";

          p.getName.call(window); //这样居然也是可以的,输出的是ANDY,this代表的是window对象;

          看来上面的代码,我们知道,getName()函数不仅仅是属于person类的,也是属于其他类或者对象的。所以getName()函数确实是有独立性;一句话总结这个独立性就是:所有的函数都可以通过对象来调用;那么再看

     一个有趣的例子,前面写过,直接复制过来:

         var person=function(){

             var name="";

           var getName=function () {   

            return name;

             }

         };

          new person().getName();//1

           既然函数具独立性,那分析一下1;在这里 new person().getName()与window.new person().getName()是不一样的,就是前者的前面不会默认的加上window字样;前一种this是person对象,或者是window对象;

          函数的参数问题:看代码;

            function person(name,sex)

           {  

               this.name=name;    this.sex=sex;

                var getNum=function()

                 {

                   return arguements.length;

                 }

           }

         new person().getNum();//没有输入参数;运算结果是0;

         new person("ok").getNum();// 输入一个参数; 结果是1;

        看上面的代码,都是可以的,在我们没有输入参数是默认输入undefined;值得注意的是每一个对象(注意不是类)都有一个arguements属性值----用来记录构造函数中输入参数,可以看出它是一个数组;

        参数类型处理

        var dealPerson= function( p)   //参数P是一个person对象;

        {      return  p.getName(); 

         }

        注意:假如我们传入的参数不是person对象,而是一个数值;那么数值是没有getName()方法的,会导致程序强制结束;本来我们是想要拿到name的,结果发生错误,我们应该怎么处理呢? ------那就是加上类型判断

       var dealPerson= function( p)   //在这里P是一个person对象;

        {    if(type p person )  return p.getName();  

              else return "wrong";

       {

         

        以上函数的有关讨论,下面讨论类与对象

         对象的创建方法:3种;

        (1)  new

        (2)  通过object创建对象;

                var ob=new Object();//创建了一个空对象;

                ob.name="ad";//为对象创建一个属性name

              ob.setName()=function(){}//为对象创建方法;

              

        (3) 通过 {}代码块创建对象----json(Javascript Object Notation) 注意书写方法;

             var  p={

                name:"huan",

                sex:"man"

              } ;

      重中之重---prototype属性实现类的"伪继承";

      先看看这个代码:

       var person=function(name,sex)

     {this.name=name;   this.sex=sex;//属性

        this.getName=function()//方法;

         {return this.name;

          }

     }

        这个程序有什么问题呢? 有二个

       (1) 因为函数作为类时,这个函数也就是他的构造器---那么new一个对象就会调用一次函数,导致function重复

        定义,假如有十个对象, 那么实际上就有十个getName()方法; 即使使用动态加载也是一样的问题;

       (2) 假如有局部变量的存在,那么可能会导致"闭包问题"----局部变量的作用域范围变大;

       针对上面的问题:可以使用prototype属性来解决;将上面的代码改为:

        var person=function(name,sex)

     {this.name=name;   this.sex=sex;//属性

      }

        person.prototype.getName=function()//方法;

         {return this.name;

          }

      这种书写方式就可以避免问题的发生;

      prototype功能比较强大,它可以为类添加属性和方法,这里说的类可以是自定义的也可以是js内置类(Object ,String

    ,Array, Number ect);这种方式类似于Java中的继承,但是有区别:Java中继承之后父类和子类是共存的,JS中只是添加属性,方法;

       

     

      

     

         


     

         

                                           

  • 相关阅读:
    Redis-命令-脚本
    Redis-命令-事务
    Redis-命令-发布订阅
    Redis-命令-HyperLogLog
    Redis-命令-有序集合(sorted set)
    Redis-命令-集合(Set)
    Redis-命令-列表(List)
    Python实例浅谈之三Python与C/C++相互调用
    python调用(运行)外部程序
    Sublime Text3 配置设置攻略
  • 原文地址:https://www.cnblogs.com/huang-1995/p/5399653.html
Copyright © 2011-2022 走看看