<!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. PHP判断是否在微信内部浏览器访问

    <?php if(is_weixin()){ echo "这是微信内部浏览器"; }else{ echo "这是微信外部浏览器"; } function ...

  2. springboot集成调用Azkaban

    springboot集成调用Azkaban 一. 说明 1.Azkaban是由Linkedin公司推出的一个批量工作流任务调度器,主要用于在一个工作流内以一个特定的顺序运行一组工作和流程,它的配置是通 ...

  3. pytorch0.4.1安装

    pytorch官网:https://pytorch.org/ 这里安装pytorch0.4.1版本(最新版本为1.3.0系列,但是在跑github上的一些项目时会不断地报“ UseWarinig:Le ...

  4. JBPM使用

    jbpm+mysql5.7 https://blog.csdn.net/tyn243222791/article/details/79033555

  5. python：一行代码实现局域网共享文件

    其实就是使用python内置的一个模块http server 在python2中是下面这样的 python -m SimpleHTTPServer 80 解释下上面的参数,-m表示让python使用一 ...

  6. Jupter Notebook常用快捷键与常用的魔法命令

    jupter notebook快捷键整理 Part1 1.删除Cell——双击D 2.撤销删除——Z 3.新建Cell——A/B (向上/向下) 4.命令窗口——P 5.运行——Ctrl+Enter ...

  7. Python爬取链家二手房源信息

    爬取链家网站二手房房源信息,第一次做,仅供参考,要用scrapy.   import scrapy,pypinyin,requests import bs4 from ..items import L ...

  8. Ubuntu下搜狗拼音输入法打不出汉字的解决方法

    问题 (1)Ubuntu下,搜狗拼音输入法能启动(系统托盘处有图标),但是打不出汉字,打字时选框不正常. 或者 (2)Deepin下,搜狗输入法无法启动,托盘处不显示图标,fcitx运行正常(这个可以 ...

  9. vue中的.passive修饰符

    一.passive作用 详情请参考MDN(https://developer.mozilla.org/zh-CN/docs/Web/API/EventTarget/addEventListener)中 ...

  10. SpringBoot开发

    创建一个Spring Boot,可以直接使用构建工具(Maven或Gradle)创建,也可以使用spring.io网站创建,一般会选择使用spring.io创建 使用IDEA创建一个Spring Bo ...