哥被逼得要当全栈工程师，今天练习了下各种对象的创建方式。代码较多参考了https://www.cnblogs.com/ImmortalWang/p/10517091.html
为了方便测试，整合了一个Student的类，包含了各种属性。
myboj.js内容
/** * 这是一个关于js的简单测试 * 一个关于student的基本测试 * student，具有基本的属性：subject,class,family,和其它基本信息 * 要实现的动作： * 专业：添加课程，删除课程 * 课程：添加课程，删除课程，上课，考试，成绩统计，成绩打印 * 家庭：添加，删除，打印家庭成员信息 * * 使用对象人：老师 */ /** * 工厂模式--工厂模式通过将对象的创建封装到一个方法中，再通过在调用该方法时传入参数而实现对象的实例化，解决了以上提到的产生大量重复代码的问题 * 但是工厂模式也存在一个不足，就是通过该方法创建的对象的构造函数全都是Object，没有辨识度。 * 没有办法通过构造函数辨别一个对象到底是Person还是Dog，亦或是Cat。于是乎，为了解决这个问题，就引入了构造函数模式 */ /** * @description 工厂模式结合object 创建对象--家庭成员。严重的问题：不符合，不类似其它高级语言的类定义 * @param {*} name * @param {*} sex * @param {*} relation */ function createFamily(name,sex,relation){ let m=new Object(); m.name=name; m.sex=sex; m.relation=relation; m.toString=function(){ return "姓名:"+this.name+",性别:"+this.sex+",关系:"+this.relation; } return m; } /** * 构造函数模式 -- 遵循大峰驼命名对象 */ function Subject(name,teachderName, passScore){ this.name=name; this.teachderName=teachderName; this.passScore=passScore; this.toString=function(){ return "课程名称:"+this.name+",老师名称:"+this.teachderName+",及格分数线:"+this.passScore; } } /** * 构造函数+原型模式结合 * 构造函数模式和原型模式结合在一起，继承了它们优点的同时又避免了各自的缺点。 * 它将具有各自特点的属性和方法定义在构造函数中，将实例间共享的属性和方法定义在prototype上， * 成为了在es6出现之前使用最普遍的一种创建对象模式。 */ function Classes(subject,teacher,studyTime){ this.subject=subject; this.teacher=teacher; this.studyTime=studyTime; } Classes.prototype={ constructor:Classes, toString:function(){ return this.teacher+"在"+this.studyTime+" 上 " +this.subject.name; } } /** * class定义-es6标准 * 注意内部的不同方法之间，不需要逗号分好隔离，更加类似其余语言的类定义 */ class Student{ // #subjects; // #classes; // #families; constructor(name,sid,sex) { this.name=name; this.sid=sid; this.sex=sex; this.subjects=new Array(); this.classes=new Array(); this.families=new Array(); } addSubject(subject) { this.subjects.push(subject) ; } addClasses(classes){ this.classes.push(classes); } addFamilies(family){ this.families.push(family); } print(){ console.log(this.families.length+":"+this.subjects.length+":"+this.classes.length); for(let i=0,len=this.families.length;i<len;i++){ console.log(this.families[i]); console.log(this.families[i].toString()); } for(let i=0,len=this.subjects.length;i<len;i++){ console.log(this.subjects[i]); console.log(this.subjects[i].toString()); } for(let i=0,len=this.classes.length;i<len;i++){ console.log(this.classes[i]); console.log(this.classes[i].toString()); } } }
objtest.html内容
<html> <head> <meta charset="UTF-8"> </head> <body> <input type="button" value="regme" onclick="fn_click()"> </body> <script type="text/javascript" src="myobj.js"></script> <script> var modelMap={ match:function(fileName){ return this.newMatch(fileName); }, newMatch:function(fileName){ return '11111--'+fileName; } }; function fn_click(){ let str="sd23"; let nstr=str.search("bsd"); alert(nstr); } function test(){ let student= new Student("luzhifei","103","man"); let girl=createFamily("lml","girl","女儿"); student.addFamilies(girl); let hanyu=new Subject("汉语","luzhifei",75); student.addSubject(hanyu); let cls=new Classes(hanyu,"luzhifei","星期一"); student.addClasses(cls); student.print(); } </script> </html>
在控制台运行test(),结果如下：
姓名:lml,性别:girl,关系:女儿 课程名称:汉语,老师名称:luzhifei,及格分数线:75 luzhifei在星期一 上 汉语
总结：
还是用Class的方式好，这是长久以来的习惯！希望老浏览器尽快淘汰吧！