Javascript基础--成员函数(六)

成员函数:也叫方法

1.常用方法

比如:我们希望对象不但有属性,还希望他有行为。(行为在程序中要靠函数来体现)
(1) 添加speak函数,输出我是一个好人
(2) 添加jisuan函数,可以计算从1+..+1000的结果
(3) 修改jisuan函数,该方法可以接收一个数n,计算从1+..+n的结果
(4) 添加add成员函数,可以计算两个数的和

 function Person(name,age){
//这个就是使用传入的实际参数,去初始化属性。
this.name = name;
this.age = age
//输出自己的名字,这里 this.show 就是一个公开的函数,函数名是show
this.show = function(){
document.writeln("名字=" + this.name);
} //添加jisuan函数,可以计算从1+..+1000的结果
this.jisuan = function(){
var res = 0;
for(var i=0;i<1000;i++)
{
res+=i;
}
return res;
} //修改jisuan函数,该方法可以接收一个数n,计算从1+..+n的结果
this.jisuans = function(n){
var res = 0;
for(var i=0;i<=n;i++)
{
res+=i;
}
return res;
}
} var p1 = new Person("宋江",90);
p1.show();
var p2 = new Person("林冲",72);
p2.show();
document.writeln("<br/> res=" + p1.jisuan());
document.writeln("<br/> res=" + p1.jisuans(100));

2.给对象添加方法还有其它三种方式:
  2.1 方式一
  function 类名()
  {
  this.属性;
  }

  var 对象名 = new 类名();
  function 函数名(){
  //执行
  }

  对象名.属性名 = 函数名;//这样就相当于把函数赋给 对象名.属性名,此时这个属性 对象

  名.属性名就表示一个函数。

  对象名.属性名();

  具体案例:

 function Person(){
this.name = "abc";
this.age =900;
}
function show1(){
window.alert("hello" + this.name);
} //创建一个p1对象
var p1 = new Person();
//把show1函数,给p1.abc
p1.abc = show1; //如果是这样写:p1.abc = show1(),会把show1()的计算结果返回给p1.abc,当前要调用show1(),则返回undefine给p1.abc
p1.abc();//调用 注意:
window.alert(p1.abc); //会输出什么
window.alert(show1) //会输出什么

Javascript基础--成员函数(六)

p1.abc和show1 输出的都是上图show1的构造函数

  2.2 方式二
  对象名.属性名 = function(参数列表){
    //代码
  };
  调用
  对象名.属性名(实际参数);

  具体案例:

  

  function Person(){
this.name = "abc";
this.age = 900;
}
var p1 = new Person();
p1.abc = function show1(){
window.alert("hello" + this.name);
};
p1.abc();

  2.3 方式三:
  前面的几种方法有一个问题,那就每个对象独占函数代码,这样如果对象很多,则会影响效率

  ,js的设计者,给我们提供另一个方法 原型法:这样多个对象可以共享函数代码:

    function Dog(){
}
//使用prototype[类]去绑定一个函数给shout
Dog.prototype.shout = function(){
window.alert('小狗');
}
var dog1 = new Dog();
dog1.shout();
var dog2 = new Dog();
dog2.shout(); //这里ok

  对代码的原理说明

  Javascript基础--成员函数(六)

   //判断dog1和dog2的方法是否调用同一个内存地址的方法
window.alert(dog1.shout == dog2.shout);

  

  =号的作用
  (1) 当 == 的两边都是字符串,则比较内容是否相等
  (2) 当 == 的两边都是数字,则比较数的大小是否相等
  (3) 当 == 是对象 或者是 对象函数,则比较地址是否相等

  2.4 案例分析
  分析能输出什么?
  案例一:

 function Person(){
this.name = "abc1";
this.age = 900;
} function show1(){
window.alert("hello" + this.name); //这里的this 是表示window 对象,没有给window.name 赋值,输出的时候只输出hello。
}
var p1 =new Person();
p1.abc = show1;
show1();

案例二:

 function Person(){
this.name = "abc1";
this.age = 900;
} var name = "北京"; // 这句话等同于window.name = "北京"function show1(){
window.alert("hello" + this.name); //这里的this 是表示window 对象
}
var p1 = new Person();
p1.abc = show1;
window.show1(); //下面跟案例二没有关系
function Person(){
this.name ="abc";
this.age =900;
this.abc = function(v1,v2){
window.alert(this.name + " " + this.age +" "+v1+" "+v2);
}
}
var p1 = new Person();
p1.abc();
p1.abc("北京","天津");
var p2 = new Person();
p2.abc();
p2.abc("南京","东京"); function Person(){
this.name = "abc";
this.age = 900;
this.abc = function(v1,v2){
window.alert(this.name + " " + this.age +" " +v1+" " +v2);
}
} var p1 = new Person();
p1.name = "中国"; //动态添加一个属性
p1.abc("北京","天津");
var p2 = new Person();
p2.abc("南京","东京");

Javascript基础--成员函数(六)

每次new一个类的实例后,都会创建两个公共属性name,age和一个公共方法abc(),而不是共享

 function Dog(){
} var dog1 = new Dog();
//动态绑定一个函数给shout属性
dog1.shout = function(){
window.alert('小狗');
} dog1.shout(); var dog2 = new Dog();
dog2.shout();//这里报错 //希望所有的对象,共享某个函数

解决方案:

function Dog(){

   }
//使用prototype[类]去绑定一个函数给shout
Dog.prototype.shout = function(){
window.alert('小狗');
}
var dog1 = new Dog();
dog1.shout();
var dog2 = new Dog();
dog2.shout(); //这里ok
   //判断dog1和dog2的方法是否调用同一个内存地址的方法
window.alert(dog1.shout == dog2.shout); //扩展 var dog3 = new Dog();
var dog4 = new Dog();
var dog5 = dog4;
window.alert("dog3==dog4" +(dog3==dog4)); //判断对象是否为同一个对象
window.alert("dog5==dog4" +(dog4==dog5)); //判断对象是否为同一个对象

3、Object 类

  3.1 创建Person实例

/*function Person(){

   }
var p1 = new Person();
p1.name ="sp";*/ //初步体验Object类,通过Object直接创建对象。
var p1 = new Object();
p1.name="sp";
window.alert(p1.constructor);
  Javascript基础--成员函数(六) var i1= new Number(10);
window.alert(i1.constructor);
Javascript基础--成员函数(六)
var i2 =10;
window.alert(i2.constructor);
Javascript基础--成员函数(六) var i=new Number(10);
Number.prototype.add = function(a){
return this + a;
}
window.alert(i.add(10).add(30));
var b = 90;
window.alert(b.add(40)); var arr = new Array(3);
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas"; for(var i=0;i<arr.length;i++){
document.writeln(arr[i] +"&nbsp;");
}
//使用Array提供的方法,颠倒数据。
arr.reverse();
document.writeln("<br/>");
for(var i=0;i<arr.length;i++){
document.writeln(arr[i] +"&nbsp;");
}

  

  

  3.2 加深对类和对象的认识
  如何给类添加方法(如何给某类型的所有对象添加方法) 

   /*
请思考给js的Array对象扩展一个find(val)方法,
当一个Array对象调用该方法的时候,如果能找到val则返回其下标,否则返回-1
*/ var arr = new Array(3);
arr[0] = "George";
arr[1] = "John";
arr[2] = "Thomas";
//现在我们一起看看如何给所有Array对象添加一个方法find(val);
Array.prototype.find = function(val){
//遍历数组 this
for(var i=0;i<this.length;i++){
if(val == this[i]{
return i;
}
}
return -1;
} document.writeln("John 下标 =" +arr.find("John"));

  3.3 成员函数-细节
    3.3.1 成员函数的参数可以是多个
    比如:function 函数名(参数1...){}
    3.3.2 成员函数可以有返回值,也可以没有,但是有的话,最大只能有一个
    3.3.3 js中不支持函数的重载,具体案例如下:

     function test(a,b,c){
window.alert("hello");
} function test (a){
window.alert(a);
}

//三个同名的函数,后面的函数会覆盖前面的函数,js中没有重载的概念,只会执行下面标红的函数
function test(a,b){
10 window.alert(a + "" + b);
11 }
//test(23);
window.test(3,"hello");
Javascript基础--成员函数(六) //结论:js在调用一个函数的时候,是根据函数名来调用。如果有个多个函数名相同,则认最后那个函数。 function abc(){
var s=0;
for(var i=0;i<arguments.length;i++){
s+=arguments[i]; //arguments[i]的下标是从1开始的,而不是0
}
return s;
}
window.alert(abc(1,2));
window.alert(abc(7,8,9));

      Javascript基础--成员函数(六)Javascript基础--成员函数(六)


 
上一篇:CSS从大图片上截取小图标的操作(转)


下一篇:phyton 相关学习