JavaScript学习-创建自定义对象方式

一、对象字面量

对象的字面量就是一个{}。里面的属性和方法均是键值对

	var student={
	 name:"小明",
	 age:18,
	 fn:function(){
	 console.log(this.name+"会唱歌");
	 }
}

二、工厂模式(不常用)

function Student(name,age,likename){
	var student={
	   name:name,
	   age:age,
	   like:function(){
		console.log(this.name+"喜欢"+likename)
		}
}
			return student;
		}
		var s1=Student("小明",18,"画画")
		var s2=Student("小李",16,"唱歌")
			console.log(s1);
			console.log(s2);

三、利用构造函数

function Teacher(name,age,likename){
	this.name=name;
	this.age=age;
	this.like=function(){
	  console.log(this.name+"喜欢"+likename)
	}
	console.log(this)
}
//new 创建1个新的对象，将函数内部的this指向新的对象
var t1=new Teacher("小白",30,"画画")

运行结果：

构造函数和普通函数的区别
构造函数就是一个普通的函数，创建方式和普通函数没有区别，不同的是构造函数习惯上首字母大写。

• 构造函数和普通函数的区别就是调用方式的不同：普通函数是直接调用，而构造函数需要使用new关键字来调用。

• this的指向也有所不同：

1. 以函数的形式调用时，this永远都是window。比如fun();相当于window.fun();
2. 以方法的形式调用时，this是调用方法的那个对象
3. 以构造函数的形式调用时，this是新创建的那个对象

四、class创建对象（es6新出规范）

//class创建对象
class Student{
	constructor(name,age,likename) {
	this.name=name;
	this.age=age;
	this.like=function(){
	console.log(this.name+"喜欢"+likename);
		}
    }
}
 var s1=new Student("xiaoli",19,"sing");
console.log(s1);

运行结果：

原型对象

由于用上述创建对象方法创建时，每个对象相同的方法都占用内存，可以用以下方法改进

    var tlike=function(){
		console.log(this.name+"喜欢"+likename)
	}	
		//自定义构造函数
		function Teacher(name,age,likename){
			this.name=name;
			this.age=age;
			this.like=tlike
			
		}
		//new 创建1个新的对象，将函数内部的this指向新的对象
		var t1=new Teacher("小白",30,"画画")
		var t2=new Teacher("小黑",28,"唱歌")

由以上思想衍生出原型对象,设定prototype，将一类型都需要用的方法进行封装，封装到一个对象上。

function Teacher(name,age,likename){
			this.name=name;
			this.age=age;
			this.likename=likename;
		}
		var teacherProty={
			like:function(){
			  console.log(this.name+"喜欢"+this.likename)
			},
			teach:function(){
			  console.log("教书")
			}
		}
		Teacher.prototype=teacherProty;
		//new 创建1个新的对象，将函数内部的this指向新的对象
		var t1=new Teacher("小白",30,"画画")
		var t2=new Teacher("小黑",28,"唱歌")
		console.log(t1)
		console.log(t2)

运行结果：

class中的原型对象:

class Student{
	constructor(name,age,likename) {
		 this.name=name;
		this.age=age;
	}
	like(){
	console.log(name+"喜欢"+likename);
  }
}
var s1=new Student("xiaoli",19,"sing");
var s2=new Student("tiantian",20,"game");

控制台操作：