从面试题学习Javascript 面向对象（创建对象）

2024-09-27 03:52:05

题目：

代码如下:

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>

js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)

在上篇文章给大家介绍了javascript面向对象基础,本篇文章继续深入学习javascript面向对象,JS的语法非常灵活,简单的对象创建就有好几种不同的方法.这些过于灵活的地方有时候确实很让人迷惑,那么今天我们就来梳理一下JS中常用的创建对象的几种方法吧. 前言虽然使用 Object构造函数或者使用对象字面量可以很方便的用来创建一个对象,但这种方式有一个明显的缺点:使用一个接口创建多个对象会产生很多冗余的代码.因此为了解决这个问题,人们开始使用以下几种方式来常见对象. 工厂模式该模
JavaScript创建对象的写法

对象是什么从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值.对象或函数.也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象. 最简单的对象JavaScript的一对花括号{}就可以定义一个对象,这样的写法实际上和调用Object的构造函数一样复制代码代码如下: var obj={};var obj2=new Object(); 这样构建出来的对象仅仅包含一个指向Object的prototype的指针,可以使用一些value
js创建对象的几种常用方式小结(推荐)

第一种模式:工厂方式复制代码代码如下: var lev=function(){ return "我们"; }; function Parent(){ var Child = new Object(); Child.name="脚本"; Child.age="4"; Child.lev=lev; return Child; }; var x = Parent(); alert(x.name); alert(x.lev()); 说明: 1.在函数
JavaScript 创建对象

第一种:JSON方式/对象直接量格式: var 对象名 = { 变量1: 变量1的值, 变量1: 变量1的值, --, 函数1: function() { 函数体 }, 函数2: function() { 函数体 }//Note:最后的逗号要去除为了和IE兼容. }; 说明: (1) 大括号内直接填写变量或者函数: (2) 对象的内容与值以冒号分隔,成对出现: (3) 包含的变量或者函数之间以逗号分隔: (4) 函数需要写在function(){}的大括号之内. 例子: var 对象名 = {
JavaScript 三种创建对象的方法

JavaScript中对象的创建有以下几种方式: (1)使用内置对象 (2)使用JSON符号 (3)自定义对象构造一.使用内置对象 JavaScript可用的内置对象可分为两种: 1,JavaScript语言原生对象(语言级对象),如String.Object.Function等: 2,JavaScript运行期的宿主对象(环境宿主级对象),如window.document.body等. 我们所说的使用内置对象,是指通过JavaScript语言原生对象的构造方法,实例化出一个新的对象.如: 复
JavaScript创建对象_动力节点Java学院整理

JavaScript对每个创建的对象都会设置一个原型,指向它的原型对象. 当我们用obj.xxx访问一个对象的属性时,JavaScript引擎先在当前对象上查找该属性,如果没有找到,就到其原型对象上找,如果还没有找到,就一直上溯到Object.prototype对象,最后,如果还没有找到,就只能返回undefined. 例如,创建一个Array对象: var arr = [1, 2, 3]; 其原型链是: arr ----> Array.prototype ----> Object.proto
javascript的函数、创建对象、封装、属性和方法、继承

一,function 从一开始接触到js就感觉好灵活,每个人的写法都不一样,比如一个function就有N种写法如:function showMsg(){},var showMsg=function(){},showMsg=function(){} 似乎没有什么区别,都是一样的嘛,真的是一样的吗,大家看看下面的例子复制代码代码如下: ///----------------------------------------------------------------------------
js使用对象直接量创建对象的代码

对象直接量提供了另一种创建新对象的方式.对象直接量允许将对象描述文字嵌入到JavaScript代码中,就像将文本数据嵌入在JavaScript代码中,就像将文本数据嵌入在JavaScript代码中作为引用的字符串一样.对象直接量是由属性说明列表构成的,这个列表包含在大括号之中,其中的属性说明用逗号隔开.对象直接量中的每个属性说明列表都由一个属性名及跟在其后的冒号和属性值构成.使用对象直接量创建对象的一般格式如下: var myobject = {属性名1:属性值1,属性2:属性值,...,属性名
js中创建对象的几种方式示例介绍

JavaScript中的所有事物都是对象:字符串.数组.数值.函数等.JS中并没有类的概念, 但我们可以利用JS的语法特征,以类的思想来创建对象. 原始方法复制代码代码如下: <script type="text/javascript"> var obj = new Object(); obj.name = "Koji"; //为对象添加属性 obj.age = 21; obj.showName = function(){ //为对象添加方法 ale
JS 创建对象(常见的几种方法)

贴个代码先: function O(user,pwd){ //use constructor this.user=user; this.pwd=pwd; this.get=get; return this; } function O2(user,pwd){ //use factory var obj=new Object(); obj.user=user; obj.pwd=pwd; obj.get=get; return obj; } function O3(){ //use prototype

从面试题学习Javascript 面向对象（创建对象）

相关推荐

随机推荐