JS之面向对象

 函数在js中是非常重要的一个概念，当使用js定义一个函数时，实际上得到的如下五项：

1.函数：就像java方法一样可以被调用。

2.对象：定义一个函数时，系统也会创建一个对象，该对象时function的实例。

3.方法：定义一个函数时，该函数通常都会附加给某个对象，作为该对象的方法。

4.变量：在定义函数的同时，也会的到一个变量。

5.类：在定义函数的同时，也会得到一个与函数同名的类。

 

函数不仅可以作为函数使用，它本身也时一个对象，是Function的实例。如下：

var f = function(){
  console.log(aa);
};
console.log(f instanceof Function);

结果：

true

可以看到在创建function 的时候也创建了一个function的实例，并将function实例赋值给f；

 

js的函数不仅仅是一个函数，更是一个类，在定义一个js的函数时，也会的到一个与该函数名相同的类，该函数也是该类唯一的构造器。

所以函数在调用的时候有两种方法

一：直接调用；直接调用返回该函数体内最后一个return语句的返回值；如果函数体内没有返回值，则返回值为空。

二：通过“new”关键字来调用；返回的是一个js对象。

var f = function(name){
  return "你好"+name;
};
var demo1 =f("骚小孩");
var demo2 = new f("小明");
console.log(demo1);
console.log(demo2);

结果：

你好骚小孩
f {}

可以看到第一demo1（直接调用）返回的是一个字符串，然后通过new关键字来调用返回的是一个f{}对象。

 

为js对象添加属性和方法

我们可以通过在函数nei使用this.属性名=属性值；为js对象添加属性或方法。

var f = function(name,age){
    this.name=name;
    this.age=age;
    this.introduce=function(){
        console.log(this.name);
        console.log(this.age);
    }
};
var demo2 = new f("小明","11");
demo2.introduce();

结果：

小明
11

被this关键字修饰的变量不再是局部变量，他是函数的实例属性。

 

js的函数可以附加到某个对象上的，如果没有指定将函数加到那个对象上，那么就会附加到window上。

function say(word){
    console.log("say "+word);
}
window.say("aaa");

结果：

say aaa

 

函数在定义的时候也会产生也会引入一个变量，该变量名与函数名相同，所以尽量避免函数名与变量名重复。

function say(word){
    console.log("say "+word);
}
say("aaa");
say="nihao";
say("bb");

结果：

say aaa
报错

 

上面说了函数不仅仅是一个对象还是一个类，那么在这个类中有：

1：局部变量；通过var 来声明；

2：实例属性：通过this前缀修饰；

3：类属性：通过函数名前缀修饰；

局部变量只能在函数中使用，实例属性是单个对象的属性，通过对象来访问，类属性属于整个类的，通过类来访问。

var f = function(name,age,country){
    this.name=name;
    this.age=age;
    f.country=country;
    this.introduce=function(){
        console.log(this.name);
        console.log(this.age);
        console.log(this.country);
    }
};
var per = new f("小名",20,"中国");
per.introduce();
console.log(f.country);

结果：

小明
20
undefined
中国

可以看出，只有通过正确的方法才能正确访问到对应的属性。

同一个类（函数）只占用一块内存，因此每个类属性都在同一块内存；同一个类每创建一个对象，系统将为该对象的实例属性分配一块内存。

 

js与java不同，他是一个动态语言，他允许随时为对象增加属性和方法，当直接为对象某个属性赋值时，即为对象增加属性。

var f = function(name,age){
    this.name=name;
    this.age=age;

};
var per = new f("小明",20,);
per.country="china";
per.intro=function(){
    with(console){
        log(per.name);
        log(per.age);
        log(per.country);
    }
};
per.intro();

结果：

小明
20
china