<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript"> /*
*
* 创建一个Person构造函数
* - 在Person构造函数中,为每一个对象都添加了一个sayName方法,目前我们的方法是在构造函数内部创建的,
* 也就是构造函数每执行一次就会创建一个新的sayName方法,也就是所有实例的sayName都是唯一的。
* 这样就导致了构造函数执行一次就会创建一个新的方法,
* 执行10000次就会创建10000个新的方法,而10000个方法都是一摸一样的
* 这是没有必要的,完全可以使所有的对象共享同一个方法
*
*/ function PersonOne(name , age , gender){
this.name = name;
this.age = age;
this.gender = gender;
//向对象中添加一个方法
this.sayName = function(){
alert("Hello大家好,我是:"+this.name);
}
} //创建一个Person的实例
var per = new PersonOne("孙悟空",18,"男");
var per2 = new PersonOne("猪八戒",28,"男");
per.sayName();
per2.sayName(); //------------------------------------------------------------------------------------ //那怎么办呢?试着将sayName方法在全局作用域中定义 function PersonTwo(name , age , gender){
this.name = name;
this.age = age;
this.gender = gender;
//向对象中添加一个方法
this.sayName = fun;
} function fun(){
alert("Hello大家好,我是:"+this.name);
}; //创建一个Person的实例
var per = new PersonTwo("孙悟空",18,"男");
var per2 = new PersonTwo("猪八戒",28,"男");
per.sayName();
per2.sayName(); /*
* 可是将函数定义在全局作用域,污染了全局作用域的命名空间
* 而且定义在全局作用域中也很不安全
*/ //------------------------------------------------------------------------------------ //那么可以怎么改呢?向原型中添加sayName方法 /**
* 以后我们创建构造函数时,可以将这些对象共有的属性和方法,统一添加到构造函数的原型对象中,
* 这样不用分别为每一个对象添加,也不会影响到全局作用域,就可以使每个对象都具有这些属性和方法了
*/ function PersonThree(name , age , gender){
this.name = name;
this.age = age;
this.gender = gender;
}
//向原型中添加sayName方法
PersonThree.prototype.sayName = function(){
alert("Hello大家好,我是:"+this.name);
}; //创建一个Person的实例
var per = new PersonThree("孙悟空",18,"男");
var per2 = new PersonThree("猪八戒",28,"男");
per.sayName();
per2.sayName(); </script>
</head>
<body>
</body>
</html>

JS基础_构造函数修改的更多相关文章

  1. JS基础_构造函数

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. JS基础(三)构造函数

    JS中的构造函数 <script language="JavaScript"> window.onload = function(){ function Bottle( ...

  3. JS基础_对象的简介、对象的基本操作

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. JS基础_函数的简介

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. JS基础_基本数据类型和引用数据类型

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. JS基础_数据类型-String类型

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  7. JS基础_标识符

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. JS基础_使用工厂方法创建对象(了解下就行了,用的不多)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. JS基础_全局作用域

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. Java工作笔记:工作中使用JNA调用C++库的一些细节(转载)

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/zjutzmh/article/detai ...

  2. java类什么时候加载?,加载类的原理机制是怎么样的?

    java类什么时候加载?,加载原理机制是怎么样的?   答: 很多人都不是很清楚java的class类什么时候加载在运行内存中,其实类加载的时间是发生在一下几种情况: 1.实例化对象时,就像sprin ...

  3. bat命令编写大全

    bat命令编写大全 摘自:https://blog.csdn.net/haibo19981/article/details/52161653 2016年08月09日 12:26:31 爱睡觉的猫L 阅 ...

  4. QML加载gif

    AnimatedImage { anchors.fill: parent source: "qrc:/img/timg.gif" }

  5. javascript中的Error对象

    在javascript中一旦代码解析或运行时发生错误,javascript引擎就会自动产生并抛出一个Error对象的实例,然后整个程序就中断在发生错误的地方. Error对象的实例有三个基本的属性: ...

  6. Jmeter与BlazeMeter使用 录制导出jmx

    本文链接:https://blog.csdn.net/weixin_38250126/article/details/82629876JMeter 的脚本录制,除了自带的HTTP代理服务器以外,被大家 ...

  7. 123457123456#0#-----com.twoapp.HuaXueGame01--前拼后广--儿童滑雪大冒险游戏jiemei

    com.twoapp.HuaXueGame01--前拼后广--儿童滑雪大冒险游戏jiemei

  8. windows 10 enterprize LTSC

    to avtivate the windows 10 enterprize LTSC version, do the following command every 6 months. slmgr - ...

  9. python之json处理

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于JavaScript(Standard ECMA-262 3rd Edition - Decembe ...

  10. jQuery学习二

    1.id选择器: // 4.如果页面中多个元素id相同,jquery只会获取第一个id的jquery对象 var jquery = $('#name'); alert(jquery.val()); v ...