<!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. H5内嵌原生app

    前言 其实我们不管是从ios还是安卓都可以看出 原生app能内嵌H5的原因是因为有了webview这个app内嵌浏览器视图,从而使得我们可以开发html然后加载到app中(原理几乎跟pc端请求.加载. ...

  2. 解决Visual Studio:"无法导入以下密钥文件: xxxx.pfx,该密钥文件可能受密码保护"

    [解决方法] 从开始菜单找到并打开Visual Studio 命令提示(2010):开始->Microsoft Visual Studio 2010->Visual Studio Tool ...

  3. 跨平台免费极简的markdown工具

    1. 工具名 typora 2. 工具官网 https://www.typora.io

  4. udf提权小结

    00x1 首先判断mysql版本, mysql版本 < 5.2 , UDF导出到系统目录c:/windows/system32/ mysql版本 > 5.2 ,UDF导出到安装路径MySQ ...

  5. Python 3.x 引入了函数注释

    Python 3.x 引入了函数注释,以增强函数的注释功能,下面是一个普通的自定义函数:   def dog(name, age, species):   return (name, age, spe ...

  6. Javescript——API连接 && json数据处理(待续)

    原文链接1:How to Connect to an API with JavaScript 原文链接2:How to Use the JavaScript Fetch API to Get JSON ...

  7. 阶段5 3.微服务项目【学成在线】_day07 课程管理实战_03-新增课程-课程分类查询

    2 新增课程 2.1 需求分析 用户操作流程如下: 1.用户进入“我的课程”页面,点击“新增课程”,进入新增课程页面 2.填写课程信息,选择课程分类.课程等级.学习模式等. 3.信息填写完毕,点击“提 ...

  8. iis启动异常 0x80072749

    错误提示: “/”应用程序中的服务器错误. 无法向会话状态服务器发出会话状态请求.请确保 ASP.NET State Service (ASP.NET 状态服务)已启动,并且客户端端口与服务器端口相同 ...

  9. elk收集tomcat日志

    1.elk收集tomcat普通日志: 只在logstash节点增加如下文件,重启logstash即可: cat >>/home/logstash-6.3.0/config/tomcat_t ...

  10. java构造方法前加void有什么作用

    构造方法前面是没有任何返回符,不能加任何返回类型,包括void.一个构造方法一旦加了void,那么这个就不是构造方法了,变成了一个普通的方法.至于你程序出现的情况,是这样的.任何一个Java类,如果你 ...