JavaScript高级知识

1 Function对象

第一节:Function 对象引入

Function 是 js 的方法对象,可以用 Function 实例化出任何 js 方法对象

第二节:用 Function 创建方法对象

<script type="text/javascript">
 /* function say(name,age){
  alert(name+"今年"+age+"岁了");
 }
 say("张三",3); *///这个是传统的方法创建Functino对象
 
 var sayFunc=new Function("name","age","alert(name+'今年'+age+'岁了')");
 sayFunc("李四",4);
 
</script>

第三节:Function 对象属性

<script type="text/javascript">
 var sayFunc=new Function("name","age","alert(name+'今年'+age+'岁了')");
 // sayFunc("李四",4);
 alert("sayFunc方法对象的方法参数个数:"+sayFunc.length);//Function对象属性
 
</script>

第四节:Function 对象方法

<script type="text/javascript">
 var sayFunc=new Function("name","age","alert(name+'今年'+age+'岁了')");
 // sayFunc("李四",4);
 // alert("sayFunc方法对象的方法参数个数:"+sayFunc.length);
 alert(sayFunc.toString());//Function对象的方法
 alert(sayFunc.valueOf());
</script>

2 Javascript闭包

第一节:Js 变量的作用域

作用域分为全局变量和局部变量
(1)声明全局变量

<script type="text/javascript">
 var a=22;
 
 function func(){
  alert(a);
 }
 
 func();
</script>

(2)全局变量的第二种声明方法:在方法体内部不用var关键字,在方法体内用关键字声明的变量是局部变量

<script type="text/javascript">
 function func(){
  // var a=22;//比如这个a就是局部变量
  a=22;//这个a就是全局变量
 }
 
 func();
 alert(a);
 
</script>

第二节:从外部读取方法内部的局部变量

下面的代码就是一个闭包

<script type="text/javascript">
 function func(){
  var a=22;
  
  function func2(){
   return a;
  }
  
  return func2;
 }
 
 var result=func();
 alert("访问func的私有局部变量a:"+result());
 //这里的result相当于func2,所以后面想要执行func2就要result()
 //上面两行代码等同于alert(func()())
</script>

第三节:闭包的概念

各种专业文献上的“闭包” (closure)定义非常抽象,很难看懂。我的理解是,闭包就是能够读取其他函数内部 变量的函数。 由于在 Javascript 语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个 函数内部的函数”。 所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁

第四节:闭包的用途

一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中
第五节:闭包的使用注意点
1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性 能问题,在 IE 中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。
2)闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包 当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随 便改变父函数内部变量的值

<script type="text/javascript">
 var name="The Window";
 //用键值对(即对象初始化器)声明一个对象,下面分别声明了一个属性和一个方法
 var object={
   name:"My object",
   getNameFunc:function(){
    var name="object func";
    return function(){
     return name;//如果这里用的是“return this.name”,此时返回的是The Window,因为this就是指window对象,window对象里面有name属性,object属性。在闭包里面的this才是指window对象,如果在父方法里面用this则是指object对象。(即内部方法里面的this,默认是最顶层的也就是window)
    };
   }
 };
 alert(object.name);//My Object
 alert(object.getNameFunc()());//Object func
</script>

以上定义的都是方法,但是方法是一个Function对象,所以可以用new来新建。

3 JS面向对象特征

3.1 面向对象的三大特征——封装、继承、多态

3.2 JS自定义对象

1、创建对象方式:
方式一,对象初始化器方式;

var marry={
  name:"marry",
  age:2,
  shout:function(){
   alert("我是:"+this.name+",今年:"+this.age);
  },
  action:function(){
   alert("会吃");
  }
 };
 
 alert(marry.name);
 alert(marry.age);
 marry.shout();
 marry.action();

方式二,构造函数方式;

 function Dog(name,age){
  this.name=name;
  this.age=age;
  this.shout=function(){
   alert("我是:"+this.name+",今年:"+this.age);
  };
  this.action=function(){
   alert("会吃");
  };
 }
 
 var jack=new Dog("jack",1);
 alert(jack.name);
 alert(jack.age);
 jack.shout();
 jack.action();

2、对象属性定义:私有属性;对象属性;类属性;

<script type="text/javascript">
 function C(){
  this.objPro="对象属性";
  C.prototype.objPro2="对象属性2";
  var privatePro="私有属性";//私有属性的获取用前面讲的闭包
 }
 C.classPro="类属性";
 
 alert(C.classPro);//获取类属性
 var c=new C();//获取对象属性之前首先要获取对象
 alert(c.objPro);
 alert(c.objPro2);
</script>

3、对象方法定义:私有方法;对象方法;类方法

<script type="text/javascript">
 function C(){
  var privateFunc=function(){
   alert("私有方法");
  };
  privateFunc();//私有方法只能直接调用
  this.objFunc=function(){
   alert("对象方法");
  };
  C.prototype.objFunc2=function(){
   alert("对象方法2");
  };
 }
 C.classFunc=function(){
  alert("类方法");
 };
 
 C.classFunc();//直接调用类方法
 var c=new C();//调用对象方法首先要获取对象
 c.objFunc();
 c.objFunc2();
</script>

3.3 JS实现封装特性

3.4 JS实现继承特性

Apply() 实现属性和方法的继承;

<script type="text/javascript">
 function Animal(name,age){
  this.name=name;
  this.age=age;
  this.shout=function(){
   alert("我是:"+this.name+",今年:"+this.age);
  };
  this.action=function(){
   alert("会吃");
  };
 }
 
 function Dog(name,age){
  Animal.apply(this, [name,age]);
  //这里的this指的是dog(),dog参数用方法头的传进来的参数列表
 }
 
 var jack=new Dog("jack",1);//这里的jack是属于dog对象的
 alert(jack.name);
 alert(jack.age);
 jack.shout();
 jack.action();
</script>

Prototype 实现原型的继承

<script type="text/javascript">
 function Animal(name,age){
  this.name=name;
  this.age=age;
  this.shout=function(){
   alert("我是:"+this.name+",今年:"+this.age);
  };
  this.action=function(){
   alert("会吃");
  };
 }
 
 function Dog(name,age){
  Animal.apply(this, [name,age]);
 }
 Dog.prototype=new Animal();//加多了这句话,就变成了基于原型的继承******
 
 var jack=new Dog("jack",1);//这里的jack类是属于Animal对象的
 alert(jack.name);
 alert(jack.age);
 jack.shout();
 jack.action();
</script>

3.5 JS实现多态特性

<script type="text/javascript">
 function Animal(){
  this.say=function(){
   alert("我是动物");
  };
 }
 
 function Dog(){
  this.say=function(){
   alert("我是狗");
  };
 }
 Dog.prototype=new Animal();
 
 function Cat(){
  this.say=function(){
   alert("我是猫");
  };
 }
 Cat.prototype=new Animal();
 
 function say(animal){
  if(animal instanceof Animal){
   animal.say();
  }
 }
 
 var dog=new Dog();
 var cat=new Cat();
 say(dog);
 say(cat);
</script>
JavaScript高级知识JavaScript高级知识 ybbinRush 发布了4 篇原创文章 · 获赞 0 · 访问量 113 私信 关注
上一篇:Linux_用户和权限


下一篇:JAVA代理