<pre name="code" class="html"><pre name="code" class="html"><pre name="code" class="html">首先解释一下什么是对象：
<span> </span>在JS中对象是对一种具体的事物的抽象。与别的语言不同，JS中没有class类这种说法，所以也就没有类的对象这种说法。
面向对象和基于对象的区别：
<span> </span>JS的对象是基于对象，无法创建自定义类型，不能很好地支持继承和多态。
<span> </span>C，C++，JAVA，C#.....这些语言是面向对象的，与JS相反，能够创建自定义类型，也很好地支持继承和多态。
JS不支持继承和多态：
<span> </span>继承：函数名相同，函数的参数或类型不同
<span> </span>多态：相同的消息赋给不同的对象会有不同的执行结果。
下面让我们跟着下面的代码学会如何一步一步学会使用构造函数创建对象：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
//第一 步：创建一个对象，并给对象添加属性和方法
<span> </span>// 使用new关键字，通过调用构造函数Object()来创建一个student学生“空对象”（这样说其实并不严谨）
// var student = new Object();
<span> </span>// 给对象添加属性和方法
// student.name = "za";
// student.age = "19";
// student.height = "183cm";
// student.speak = function (word) {
// console.log(word + "姓名：" + student.name + "年龄：" + student.age + "身高：" + student.height);
// }
//<span> </span>输出对象属性
// console.log(student);
//<span> </span>调用对象方法
// student.speak("这是我的学生信息：");
这样创建一个一般的对象的工作就完成了。那么如果又有一个新的学生加入，为了记录这个新学生的一些属性和方法是不是又要将上面的代码重写一遍呢？？？答案很显然，如果照上面的做法，要是有一万个学生，那上面的代码是不是就要写一万遍？！！这样很显然是很不科学的做法。为了解决这个问题，我们肯定就要找方法！那么说到方法，方法？我们是不是可以通过函数来解决这个问题？那么接下来第二步就小试牛刀一把。
//第二步：使用函数创建多个对象
<span> </span>//<span> </span> 先定义一个创建对象的函数，输入对象的属性作为参数
// function createOb(name, age, height) {
<span> </span>// 依然是通过new关键字和Object()构造函数创建一个“空对象”
// var student = new Object();
// student.name = name;
// student.age = age;
// student.height = height;
<span> </span>//<span> </span> 使用函数表达式的方法给student对象创建一个行为，也就是函数
// student.speak = function (word) {
// console.log(word + "姓名：" + student.name + "年龄：" + student.age + "身高：" + student.height);
// };
<span> </span>// 函数的三要素之一：返回值，返回我们创建的对象
// return student;
// }
<span> </span>// 使用我们创建的函数创建对象
// var c1 = createOb("za", 19, "183cm");
// var c2 = createOb("ls", 10, "100cm");
// 输出对象属性
// console.log(c1);
// console.log(c2);
// 调用对象方法
// c1.speak("这是我的信息");
// c2.speak("这是我的信息");
通过以上代码，我们就学会使用函数创建对象。但是我们会发现，无论是使用直接创建对象的方法来创建对象还是通过使用函数来创建对象，我们都会用到这样一个语句：var 对象名 = new Object();之前我们也说了这是通过构造函数来创建对象，只是这个构造函数是系统的，而不是我们自己的。经过研究发现使用new关键字+构造函数创建对象会经过如下四步：
<p><span> </span>1、首先，内存开辟空间，存储新创建的对象</p><p><span> </span>2、然后，会把<span style="font-family: Calibri;">this</span><span style="font-family: 宋体;">设置为当前对象</span></p><p><span> </span>3、接下来，执行函数内部的代码，设置对象的属性和方法</p><p><span> </span>4、最后，返回创建的对象</p> 我们发现两点：构造函数方法创建对象，系统会自动返回创建对象，所以我们就不用return 对象，加上this又可以指代当前对象，综合这两点我们发现我们可以不用再函数内部创建空对象，再返回这个对象，但是为了表示函数内部的属性指的是对象的属性，因此我们就用到了this
经过以上分析，我们可以试着使用构造函数的方法来创建对象：
//第三步：使用构造函数创建多个对象
<span> </span>// 依然是先创建一个函数，将对象的属性作为参数
// function CreateOb(name, age, height) {
<span> </span>// 使用this指代对象，来为对象的属性赋值
// this.name = name;
// this.age = age;
// this.height = height;
<span> </span>// 同样的道理创建对象的方法
// this.speak = function (word) {
// console.log(word + "姓名：" + this.name + "年龄：" + this.age + "身高：" + this.height);
// }
// }
<span> </span>// 使用我们的创建的构造函数创建对象，因为我们使用的是构造函数，千万记得new（程序媛的对象都是new出来的）
// var C1 = new CreateOb("za", 19, "183cm");
// var C2 = new CreateOb("ls", 10, "100cm");
// //输出对象属性
// console.log(C1);
// console.log(C2);
// //调用对象方法
// C1.speak("这是我的信息:");
// C2.speak("这是我的信息:");
</script>
</head>
<body>
</body>
</html>
总结：
<p>使用函数创造对象跟使用构造函数创建对象在书写上的区别：</p><p>函数名：构造函数的函数名首字母必须大写！</p><p>函数体：<span style="background: rgb(255, 255, 0);">普通函数</span>的函数体必须先创建一个空对象，然后对空对象添加属性和方法，最后返回这个对象，并且在给这个对象添加属性时可以使用：对象名<span style="font-family: Calibri;">.</span><span style="font-family: 宋体;">属性</span><span style="font-family: Arial, Helvetica, sans-serif;">的方法。</span><span style="font-family: Arial, Helvetica, sans-serif; background-image: initial; background-attachment: initial; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;"><span style="background-color: rgb(255, 255, 0);">构造函</span><span style="background-color: rgb(255, 255, 255);"><span style="font-family: 宋体;"> </span></span><span style="background-color: rgb(255, 255, 0);">数</span></span><span style="font-family: Arial, Helvetica, sans-serif;">刚开始不用定义空对象，同样最后也不用返回这个对象，只需添加对象的属性和方法，但是在添加属性和方法的时候为了显示是当前对象的</span><span style="font-family: Arial, Helvetica, sans-serif;">，所以就用到了：</span><span style="font-family: Calibri;">this.</span><span style="font-family: 宋体;">属<span> </span>性这种方法。</span></p><p>使用函数构造对象的时候：</p><p><span> </span>普通函数只需定义对象（也就是定义普通变量的方法）然后调用普通函数即可。 构造函数需要先定义对象，再通过<span style="font-family: Calibri;">new</span><span style="font-family: 宋体;">方法调用构造函数。</span></p><p>相同点：</p><p><span> </span>无论普通函数还是构造函数，在函数内部都是通过<span style="background: rgb(255, 255, 0);">函数表达式创建对象的方法</span>的。</p><p><span> </span>其他在属性的使用上和对象的方法的调用上并没有太大区别。</p>
4926
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
