JS面向对象

1.概念

面向对象不是一种语法,是一种编程的思想。

2.创建对象

var obj = {};

var obj = new Object();

  

Object是一个系统提供的构造函数,这个构造函数专门用来创建对象使用的。

空对象不要紧,知道怎么往对象中添加属性就行

3.工厂函数

定义一个函数,调用函数,传入参数就可以得到对象。

 

function createObj(name,age,sex){

    var obj = new Object();

    obj.name = name;

    obj.age = age;

    obj.sex = sex;

    return obj;

}

//传入参数就可以获得对象

var obj1 = createObj("张三",12,"男");

var obj2 = createObj("李四",13,"女");

var obj3 = createObj("王五",11,"女")

  

这种批量创建对象的函数,叫做工厂函数。

优点:可以同时创建多个对象

缺点:创建出来的类型,都是object类型的。无法精确看到对象类型

解决方案:自定义构造函数。其实相当于自己写一个函数,专门用来new对象。

4.自定义构造函数

根据固定的模板,创建一个对象,创建的对象有构造函数规定的属性和方法。

潜规则:构造函数的首字母需要大写

1.创建了一个新对象

2.this指向了这个新对象(新对象就有了属性,创建了属性)

3.执行构造函数,也就是调用了这个函数(给对象添加属性和方法,给属性和方法赋值)

4.返回这个新对象

 

function Person(name,age,sex){

    this.name = name;

    this.age = age;

    this.sex = sex;

}

var obj1 = new Person("张三",12,"男");

var obj1 = new Person("李四",13,"女");

var obj1 = new Person("王五",11,"女");

  

构造函数的作用:

给对象添加属性和方法。

构造函数注意事项:

1.构造函数天生就是用来创建对象的,所以必须和new配合使用,否则就不具备创建对象的能力

2.构造函数内部不能有return关键字,因为构造函数会自动返回对象。如果返回基本数据类型,和不加效果一样,如果返回复杂数据类型,构造函数就没意义了。

3.如果new的时候,不需要参数,那么下括号可以省略

缺点

  不同的对象应该由相同的方法,但是方法在内存中占用了多个空间-浪费

使用原型可以完美解决这个问题。

5.原型

原型对象:在声明了一个函数之后,浏览器会自动按照一定的规则创建一个对象,通过函数的prototype可以访问到这个对象,这个对象就叫做原型对象。

在声明了一个函数后,这个构造函数(声明了的函数)中会有一个属性prototype,这个属性指向的就是这个构造函数(声明了的函数)对应的原型对象;原型对象中有一个属性constructor,这个属性指向的是这个构造函数(声明了的函数)

 var obj = {
//     name:"张三",
//     age:12
// }
// console.log(obj);

  JS面向对象

1.任何一个对象,天生自带一个属性:__proto__ , 这个东西是一个对象,原型/原型对象;

 

console.log(obj.__proto__);
obj.__proto__.sex = ‘美女‘;
console.log(obj.__proto__);
对象可以访问到原型上的属性和方法
2.
任何函数天生自带一个属性:prototype,这个东西是一个对象,原型/原型对象;
 
0.0!
任何一个原型对象天生自带属性constructor,指向构造函数;
 
6.原型链
任何对象天生自带属性 __proto__ ,这个东西是一个对象,原型/原型对象
原型对象是对象,既然是对象就有 __proto__ 这个属性 ,原型的原型 ....
 这样形成的一条链式结构,叫做原型链
 
 
function Person(){

}

var p = new Person();
Object.prototype.name = ‘李四‘;
Object.prototype.eat = function(){
    // console.log("吃");
}


console.log(p); // 最小的对象

console.log(p.__proto__);

console.log(p.__proto__.__proto__);
console.log(p.__proto__.__proto__.constructor);

console.log(p.__proto__.__proto__.__proto__);

  

当对象在调用一个方法时,首先看自己有没有,有就能调用,没有找他的原型要,原型有就能调用,没有,就找原型的原型要,一直往上找,找到就能调用,一直到了null也没有找到,调用会报错   ... is not a function
JS面向对象

JS面向对象

上一篇:PHP Socket编程 之 fopen / fsockopen区别


下一篇:解决 webpack-dev-server 不能使用 IP 访问