推荐阅读
JQuery简介 普通JavaScript的缺点：每种控件的操作方式不统一，不同浏览器下有区别，要编写跨浏览器的程序非常麻烦。因此出现了很多对JavaScript的封装库，比如Prototype、Dojo、ExtJS、JQuery等，这>>>详细阅读
本文标题：从面试题学习Javascript 面向对象（创建对象）
地址：http://www.17bianji.com/kaifa2/JS/23497.html
1/2 1
从面试题学习Javascript 面向对象（创建对象）
作者： 来源：www.28hudong.com 2013-03-30 00:30:43 阅读次 我要评论
题目： 复制代码 代码如下: try{ var me = Man({ fullname: "小红" }); var she = new Man({ fullname: "小红" }); console.group(); console.info("我的名字是：" + me.attr("fullname") + "n我的性别是：" + me.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小红 我的性别是：<用户未输入> ------------------*/ me.attr("fullname", "小明"); me.attr("gender", "男"); me.fullname = "废柴"; me.gender = "人妖"; she.attr("gender", "女"); console.group(); console.info("我的名字是：" + me.attr("fullname") + "n我的性别是：" + me.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小明 我的性别是：男 ------------------*/ console.group(); console.info("我的名字是：" + she.attr("fullname") + "n我的性别是：" + she.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小红 我的性别是：女 ------------------*/ me.attr({ "words-limit": 3, "words-emote": "微笑" }); me.words("我喜欢看视频。"); me.words("我们的办公室太漂亮了。"); me.words("视频里美女真多！"); me.words("我平时都看优酷！"); console.group(); console.log(me.say()); /*------[执行结果]------ 小明微笑："我喜欢看视频。我们的办公室太漂亮了。视频里美女真多！" ------------------*/ me.attr({ "words-limit": 2, "words-emote": "喊" }); console.log(me.say()); console.groupEnd(); /*------[执行结果]------ 小明喊："我喜欢看视频。我们的办公室太漂亮了。" ------------------*/ }catch(e){ console.error("执行出错，错误信息: " + e); } 知识点： （1）JS面向对象基础：ECMA-262把对象定义为：“无序属性的集合，其属性可以包含基本值、对象或者函数”。 （2）JS创建对象的方法： （a）工厂模式：用函数来封装以特定接口创建对象的细节。 function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; return o; } var person1 = createPerson(“Nicholas”, 29, “Software Engineer”); var person2 = createPerson(“Greg”, 27, “Doctor”); 缺点：工厂模式虽然解决了创建多个相识对象的问题，但却没有解决对象识别的问题（即怎样知道一个对象的类型）。 （b）构造函数模式：ECMAScript中的构造函数可以用来创建特定类型的对象。可以创建自定义的构造函数，从而定义自定义对象类型的属性和方法。 function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.sayName = function(){ alert(this.name); }; } var person1 = new Person(“Nicholas”, 29, “Software Engineer”); var person2 = new Person(“Greg”, 27, “Doctor”); 缺点：使用构造函数的主要问题，就是每个方法都要在每个实例上重新创建一遍。不要忘了——ECMAScript中的函数是对象，因此每定义一个函数， 就是实例化一个对象。 （c）原型模式：我们创建的每个函数都有一个prototype（原型）属性，这个属性是一个指针，指向一个对象，而这个对象的用途是包含可以由特定类型 的所有实例共享的属性和方法。使用原型对象的好处是可以让所有对象共享它包含的属性和方法 function Person(){ } Person.prototype.name = “Nicholas”; Person.prototype.age = 29; Person.prototype.job = “Software Engineer”; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = new Person(); person1.sayName(); //”Nicholas” var person2 = new Person(); person2.sayName(); //”Nicholas” alert(person1.sayName == person2.sayName); //true 缺点：原型中所有属性是被很多实例共享的，这种共享对于函数非常合适。但是对于引用类型值的属性来说，问题就比较突出了。 （d）组合使用构造函数模式和原型模式：创建自定义类型的最常见方式，就是使用组合使用构造函数模式和原型模式。构造函数模式用于定义实例属性， 而原型模式用于定义方法和共享的属性。 function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.friends = [“Shelby”, “Court”]; } Person.prototype = { constructor: Person, sayName : function () { alert(this.name); } }; var person1 = new Person(“Nicholas”, 29, “Software Engineer”); var person2 = new Person(“Greg”, 27, “Doctor”); person1.friends.push(“Van”); alert(person1.friends); //”Shelby,Court,Van” alert(person2.friends); //”Shelby,Court” alert(person1.friends === person2.friends); //false alert(person1.sayName === person2.sayName); //true 答案： 复制代码 代码如下: <!DOCTYPE html> <html> <head> <style type="text/css" rel="stylesheet"> </style> <title></title> </head> <body> </body> <script type="text/javascript"> window.onload=function() { var Man; //+++++++++++答题区域+++++++++++ Man=function(obj){ if(!(this instanceof Man)) { return new Man(obj); } this.attrObj=obj||{}; this.wordsObj=[]; } Man.prototype={ constructor:Man, words:function(word){ word!=undefined&&this.wordsObj.push(word); }, attr:function(attribute,attributeValue) { var defaultVaule="<用户未输入>"; if(arguments.length==2){ this.attrObj[attribute]=attributeValue; } else if(!(attribute instanceof Object)) { if((this.attrObj[attribute]===undefined)) { return defaultVaule; } else { return this.attrObj[attribute]; } } else{ for(property in attribute) { this.attrObj[property]=attribute[property]; } } }, say:function() { var limit=this.attrObj['words-limit'], outputString, wordsLen=this.wordsObj.length; outputString=this.attr("fullname")+this.attr("words-emote")+":"; for(var i=0;i<limit;i++) { outputString+=this.wordsObj[i]; } return outputString; } }; //+++++++++++答题结束+++++++++++ try{ var me = Man({ fullname: "小红" }); var she = new Man({ fullname: "小红" }); console.group(); console.info("我的名字是：" + me.attr("fullname") + "n我的性别是：" + me.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小红 我的性别是：<用户未输入> ------------------*/ me.attr("fullname", "小明"); me.attr("gender", "男"); me.fullname = "废柴"; me.gender = "人妖"; she.attr("gender", "女"); console.group(); console.info("我的名字是：" + me.attr("fullname") + "n我的性别是：" + me.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小明 我的性别是：男 ------------------*/ console.group(); console.info("我的名字是：" + she.attr("fullname") + "n我的性别是：" + she.attr("gender")); console.groupEnd(); /*------[执行结果]------ 我的名字是：小红 我的性别是：女 ------------------*/ me.attr({ "words-limit": 3, "words-emote": "微笑" }); me.words("我喜欢看视频。"); me.words("我们的办公室太漂亮了。"); me.words("视频里美女真多！"); me.words("我平时都看优酷！"); console.group(); console.log(me.say()); /*------[执行结果]------ 小明微笑："我喜欢看视频。我们的办公室太漂亮了。视频里美女真多！" ------------------*/ me.attr({ "words-limit": 2, "words-emote": "喊" }); console.log(me.say()); console.groupEnd(); /*------[执行结果]------ 小明喊："我喜欢看视频。我们的办公室太漂亮了。" ------------------*/ }catch(e){ console.error("执行出错，错误信息: " + e); } } </script> </html>
关键词： 探索发现
乐购科技部分新闻及文章转载自互联网，供读者交流和学习，若有涉及作者版权等问题请及时与我们联系，以便更正、删除或按规定办理。感谢所有提供资讯的网站，欢迎各类媒体与乐购科技进行文章共享合作。
网友点评
精彩导读
科技快报
品牌展示© 2013-2016 IT技术 京ICP备11016124号-4
京公网安备 11011202000261号