<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script type="text/javascript">
// 1/原始的创建方法
// 对象字面量
var student={
name:'小花',
age:16,
school:"王者荣耀",
like:function(){
console.log(this.name+"喜欢狄大人!")
}
}
//2/ 工厂模式创建对象
// 快速创建学生的内容
function Student(name,age,Likename){
var student={
name:name,
age:age,
school:"王者荣耀",
like:function(){
console.log(this.name+"喜欢"+Likename)
}
}
return student;
}
var s1=Student("小红",16,'小明');
console.log(s1)
var s2=Student("小强",17,'小花');
console.log(s2)
console.log("-------------")
// 3/构造函数创建对象,Object浏览器自带的函数对象
// 自定义构造函数
// function teacher(name,age,Likename){
// this.name=name;
// this.age=age;
// this.like=function(){
// console.log(this.name+"喜欢😍"+likename)
// }
// }
// 完整构造函数创建对象的方式
// 1/ 创建构造函数
// 2/ 创建原型对象
// 3/ 设置构造函数原型对象属性prototype
function teacher(name,age,likename){
this.name=name;
this.age=age;
this.likename=likename
// this.like=tlike;
}
// 原型对象
// 将这一类都需要用到的方法进行封装,封装到一个对象上,并且将这个对象到构造函数prototype
var teacherProto={
like:function(){
console.log(this.name+"喜欢😍"+this.likename)
},
teach:function(){
console.log("比较喜欢")
}
}
// 所有的函数对象都有一个方法prototype属性
teacher.prototype=teacherProto
//构造函数,new创建1个新的对象,将函数内部的this指向此对象
var t1= new teacher("阿宝",18,"干饭干饭")
console.log(t1)
//console.log(t1.name)
//console.log(t1.age)
//console.log(t1.like)
var t2=new teacher("阿猪",16,"阿宝")
console.log(t2)
console.log("------------")
//第四种方式,class--->es6 新出的规范,允许使用class创建对象
class Cat{
// 定义构造函数
constructor(name,color,like) {
this.name = name;
this.color = color;
// this.like=function(){
// console.log(this.color+"的"+this.name+"喜欢"+like)
// }
}
// 在原型上了,看不见喜欢什么内容了
likeName(){
console.log(this.color+"的"+this.name+"喜欢"+like)
}
}
var c1=new Cat("灰色","肥波","鱼")
console.log(c1)
</script>
</body>
</html>
JavaScript对象的创建和构造函数(工厂模式创建对象,构造函数,class创建对象,原型对象)
最新推荐文章于 2024-08-27 00:00:00 发布