对象初识

2017-12-23

对象的定义、调用

  • 三种定义方式：1、var obj={};2、var obj=new Object();3、var obj=Object.create();
  • 对象是由其本身和原型构成的，对象的原型是__proto__,原型本身也是一个对象，所以就有了原型链的概念。
  • 对象的调用方式
    obj.属性名或者obj['属性名']
  • 原型链：原型链是指对象在访问属性或方法时的查找方法。
  • 1.当访问一个对象的属性或方法时，会先在对象自身上查找属性或方法是否存在，如果存在就使用对象自身的属性或方法。如果不存在就去创建对象的构造函数的原型对象中查找，以此类推，直到找到为止。如果顶层对象中还找不到，则返回undefined。
  • 2.原型链中最顶层为object构造函数的prototype原型对象，给object.prototype添加属性或方法可以被除null和undefined之外的所有数据类型对象使用。

工厂模式

  • 这种模式可以防止变量污染
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    //例如🐶
    function Dog(){
    	var obj={};
    	obj.name="大黄";
    	obj.sex="男";
    	obj.action=function(){
    		console.log("吃、撒欢、玩");
    	}
    	return obj;
    }
    var myDog=Dog();

ES5构造函数

  • 构造函数的定义、调用、继承(call、apply、bind)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    //约定俗称的首字母大写
    function Person(name,age){
    	this.name=name;
    	this.age=age;
    	this.hobby=function(){
    		console.log("lala");
    	}
    }
    //继承Person的构造函数Student
    function Student(name,age){
    	Person.call(this,name,age);
    	// 改变this的指向
    	// Person.apply(this,[name,age]);
    	// Person.bind(this)(name,age);
    	this.action=function(){
    		console.log("hhaa");
    	}
    }
    var person=new Person("lala",20);

  • new关键字在此过程中做了哪些东西？

  1. 创建一个空的对象
    var obj={};
  2. 改变this的指向
    Person.call(this,name,age);
  3. 给原型赋值
    obj.__proto__=person.prototype;
  • 还可以通过原型找到构造函数本身
    var fn=Person.prototype.constructor;

ES6类

  • 出现就是为了取代ES5构造函数，比构造函数更完善一些，但是具有兼容性
  • 类的定义、调用、继承extends、super
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    class Person{
    	constructor(name,age){
    		this.name=name;
    		this.age=age;
    	}
    	hobby(){
    		console.log("lala");
    	}
    }
    class Student extends Person{
    	constructor(name,age){
    		super(name,age);
    	}
    	action(){
    		console.log("haha");
    	}
    }
    var person=new Person("lala",20);