首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >构造函数和原型

构造函数和原型

作者头像
星辰_大海
发布于 2020-10-23 04:13:29
发布于 2020-10-23 04:13:29
58900
代码可运行
举报
文章被收录于专栏:h5学习笔记h5学习笔记
运行总次数:0
代码可运行

1.概述:

在典型的OOP的语言中(如Java) , 都存在类的概念,类就是对象的模板,对象就是类的实例,但在ES6之前, JS中并没用引入类的概念。 ES6,全称ECMAScript6.0 , 2015.06发版。但是目前浏览器的JavaScript是ES5版本,大多数高版本的浏 览器也支持ES6 ,不过只实现了ES6的部分特性和功能。 在ES6之前,对象不是基于类创建的,而是用一种称为构建函数的特殊函数来定义对象和它们的特征。

对象的三种创建方式--复习
  1. 字面量方式 var obj = {};
  2. new关键字 var obj = new Object();
  3. 构造函数方式 function Person(name,age){  this.name = name;  this.age = age; } var obj = new Person('zs',12);

2.构造函数

构造函数是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与new一起使用。我 们可以把对象中一些公共的属性和方法抽取出来 ,然后封装到这个函数里面。

new在执行时会做四件事情:

①在内存中创建一个新的空对象。 ②让this指向这个新的对象。 ③执行构造函数里面的代码,给这个新对象添加属性和方法。 ④返回这个新对象(所以构造函数里面不需要return ) .

静态成员和实例成员

JavaScript的构造函数中可以添加一些成员,可以在构造函数本身上添加,也可以在构造函数内部的this.上添 加。通过这两种方式添加的成员,就分别称为静态成员实例成员

  • 静态成员:在构造函数本上添加的成员称为静态成员,只能由构造函数本身来访问
  • 实例成员:在构造函数内部创建的对象成员称为实例成员,只能由实例化的对象来访问
2.1实例成员

实例成员就是构造函数内部通过this添加的成员 如下列代码中uname age sing 就是实例成员,实例成员只能通过实例化的对象来访问

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 function Star(uname, age) {
     this.uname = uname;
     this.age = age;
     this.sing = function() {
     console.log('我会唱歌');
    }
}
var ldh = new Star('刘德华', 18);
console.log(ldh.uname);//实例成员只能通过实例化的对象来访问
//console.log(Star.uname); //不可以通过构造函数来访问实例成员
2.2静态成员

静态成员 在构造函数本身上添加的成员 如下列代码中 sex 就是静态成员,静态成员只能通过构造函数来访问

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 function Star(uname, age) {
     this.uname = uname;
     this.age = age;
     this.sing = function() {
     console.log('我会唱歌');
    }
}
Star.sex = '男';
var ldh = new Star('刘德华', 18);
console.log(Star.sex);//静态成员只能通过构造函数来访问
//console.log(ldh.sex); //不能通过对象来访问

3.构造函数的问题

构造函数方法很好用,但是存在浪费内存的问题

4.构造函数原型prototype(原型对象)

构造函数通过原型分配的函数是所有对象所共享的。

JavaScript 规定,每一个构造函数都有一个prototype 属性,指向另一个对象。

注意这个prototype就是一个对象,这个对象的所有属性和方法,都会被构造函数所拥有。

我们可以把那些不变的方法,直接定义在 prototype 对象上,这样所有对象的实例就可以共享这些方法。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function Star(uname, age) {
    this.uname = uname;
    this.age = age;
}
Star.prototype.sing = function() {
    console.log('我会唱歌');
}
var ldh = new Star('刘德华', 18);
var zxy = new Star('张学友', 19);
ldh.sing();//我会唱歌
zxy.sing();//我会唱歌

注意:

  1. 原型是一个对象prototype,我们也称为原型对象
  2. 原型的作用是共享方法

5.对象原型

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
对象都会有一个属性 __proto__ 指向构造函数的 prototype 原型对象,之所以我们对象可以使用构造函数 prototype 原型对象的属性和方法,
就是因为对象有 __proto__ 原型的存在。
__proto__对象原型和原型对象 prototype 是等价的
__proto__对象原型的意义就在于为对象的查找机制提供一个方向,或者说一条路线,但是它是一个非标准属性,
因此实际开发中,不可以使用这个属性,它只是内部指向原型对象 prototype
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function Star( uname,age) {
    this .uname = uname ;
    this.age = age ;
}
Star.prototype.sing = function() {
    console.log( '我会唱歌' );
}
var ldh = new Star('刘德华'18);
var zxy = new Star('张学友'19);
1dh.sing();
console.log(1dh);
console.log(1dh.__proto__ === Star.prototype); //true

6.constructor构造函数

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
对象原型( __proto__)和构造函数(prototype)原型对象里面都有一个属性 constructor 属性 ,constructor 我们称为构造函数,因为它指回构造函数本身。
constructor 主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。
一般情况下,对象的方法都在构造函数的原型对象中设置。如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,
但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象 constructor 就不再指向当前构造函数了。
此时,我们可以在修改后的原型对象中,添加一个 constructor 指向原来的构造函数。

如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数如:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 function Star(uname, age) {
     this.uname = uname;
     this.age = age;
 }
 // 很多情况下,我们需要手动的利用constructor 这个属性指回 原来的构造函数
// Star.prototype.sing = function() {
        // console.log('我会唱歌');
// };
// Star.prototype.movie = function() {
        //console.log( '我会演电影');
// }
 Star.prototype = {
 // 如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数
   constructor: Star, // 手动设置指回原来的构造函数
   sing: function() {
     console.log('我会唱歌');
   },
   movie: function() {
     console.log('我会演电影');
   }
}
var zxy = new Star('张学友', 19);
console.log(zxy)
// console.1og(Star.prototype); 
// console.1og(1dh.__proto__) ;
//console.log(Star.prototype.constructor); 
//console.1og(1dh.__proto__.constructor) ; 

以上代码运行结果,设置constructor属性如图:

如果未设置constructor属性,如图:

7. 构造函数实例和原型对象三角关系

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
1.构造函数的prototype属性指向了构造函数原型对象
2.实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数的原型对象
3.构造函数的原型对象的constructor属性指向了构造函数,实例对象的原型的constructor属性也指向了构造函数

8.原型链

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    每一个实例对象又有一个__proto__属性,指向的构造函数的原型对象,构造函数的原型对象也是一个对象,也有__proto__属性,这样一层一层往上找就形成了原型链。

9.原型链和JavaScript的成员查找机制

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
任何对象都有原型对象,也就是prototype属性,任何原型对象也是一个对象,该对象就有__proto__属性,这样一层一层往上找,就形成了一条链,我们称此为原型链;

注意:如果访问的对象本身有这个属性,这个对象的原型也有此属性时,实行就近原则,得到的是对象本身的这个属性值

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
1、当访问一个对象的属性(包括方法)时,首先查找这个对象自身有没有该属性。
2、如果没有就查找它的原型(也就是 __proto__指向的 prototype 原型对象)。
3、如果还没有就查找原型对象的原型(Object的原型对象)。
4、依此类推一直找到 Object 为止(null)。
5、__proto__对象原型的意义就在于为对象成员查找机制提供一个方向,或者说一条路线。

10.原型对象中this指向

构造函数中的this和原型对象的this,都指向我们new出来的实例对象

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function Star(uname, age) {
    this.uname = uname;
    this.age = age;
}
var that;
Star.prototype.sing = function() {
    console.log('我会唱歌');
    that = this;
}
var ldh = new Star('刘德华', 18);
// 1. 在构造函数中,里面this指向的是对象实例 ldh
ldh.sing();
// 2.原型对象函数里面的this 指向的是 实例对象 ldh
console.log(that === ldh);//true

11.通过原型为数组扩展内置方法

可以通过原型对象,对原来的内置对象进行扩展自定义的方法。比如给数组增加自定义求偶数和的功能。

注意:数组和字符串内置对象不能给原型对象覆盖操作Array.prototype= { },

只能是Arrayprototype.xx = function(){}的方式。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 Array.prototype.sum = function() {
   var sum = 0;
   for (var i = 0; i < this.length; i++) {
   sum += this[i];
   }
   return sum;
 };
 //此时数组对象中已经存在sum()方法了  可以使用 数组.sum()进行数据的求和
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-10-11 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
近10年“女性向”游戏深度解读
导语|  本文的创作和思考定位不是单纯的女性向游戏,而是尝试提供一个更全面的视角——广义女性向游戏构建。笔者将在本文中尝试对近十年流行的女性向内容进行大致的总结,将综合言情小说、影视、女性向游戏、同人等内容媒介,基于个人心得和定性分析,提供女性向内容的构建方法,并在解析女性玩家的内容诉求基础上,进行未来趋势的预判。 简言之,笔者认为未来的“女性向”趋势不再是单纯的女性向游戏,而是在传统游戏品类中尝试接纳女性视角,即将游戏从常见的男性向为主的方向调整为中性化,形成对所有“玩家”皆友好、没有明显偏向的游戏。
腾讯大讲堂
2021/10/18
4.6K1
基于英雄联盟的知识图谱问答系统
代码地址:https://github.com/taishan1994/lol_knowledge_graph_qa
西西嘛呦
2022/09/19
6070
游戏性与IP互动的基本规律
为什么需要IP 影视、小说作品的IP应用于游戏,很多年前就有这样的例子。但是很长一段时间以来,这样的做法并不太受市场欢迎。本人很小的时候就玩过红白机上的《蝙蝠侠》,除了人物、背景有点味道外,整个游戏难
韩伟
2018/03/05
2K0
游戏性与IP互动的基本规律
都说IP当道,看看游戏中IP是如何建设的
IP建设是一个要素众多,适用领域广泛的话题,而我今天要分享的是它在游戏领域中经常会被关注的两个模块:人设与世界观。 这里有两本很有趣的书,左侧这一本叫《完美人设》,副标题为“如何塑造一个不会崩塌的人设”。你其实从这两行字中也可以看出来,这本书实际上比较适用于娱乐圈;而放到游戏的领域来看,为了塑造一个不会崩塌的人设,完美的人设在策划设计时恰恰是要去避免的。因为一个角色要有成长的曲线,那他的人生肯定会有高低起伏,不会完美。 再看右边这本书,爱因斯坦在书中就他自身的世界观展开了探讨。书中有这样一句话:“要是
腾讯大讲堂
2020/05/25
9620
万字长文详解:游戏叙事结构和任务编排设计
‍ ‍导语|让玩家感知到叙事的妙趣,产生探索欲延伸是叙事体验的核心。简要聊聊叙事落入游戏生产,使用任务形式的叙事载体,或将赋予叙事于游戏设计层的真正含义。 本文作者:clampwang,腾讯IEG游戏策划 前言 现如今好的叙事结构不仅与玩法有相互促进耦合的作用,也可把控玩家情感,强化游戏沉浸感。在笔者上一篇文章里,已阐述过玩法叙事的制衡平衡重要性,这里便不再赘述。 而在这篇文章中,笔者除了会简单阐述一下游戏叙事结构的基本理论和叙事结构分类的不同设计,还会聊聊叙事如何化作任务的体验形式,能让玩家感知体验并落
腾讯大讲堂
2022/03/29
7.8K0
《源震》今日正式登录viveport,1元即可抢先体验
冰穹互娱宣布《源震》抢先体验版价格为1元!真可谓是任性霸道!今日14时,由冰穹互娱发行,黑将网络研发的3A级VR游戏《源震》抢先体验版已在viveport正式登陆。 《源震》抢先体验版支持中文英语双
VRPinea
2018/05/15
8740
从《孤岛惊魂》系列出发,聊聊如何打造一个引人入胜的开放世界
前言 扎根真实世界,方能构筑无限幻想。如何讲好一个引人入胜的故事?如何让人在开放世界之中身临其境?如何根据游戏故事设定营造对应的视觉氛围?作为五感之中最为直接的感官,视觉画面总是人们对一款游戏能否产生好感的第一关。而不断追求美与真实,则需要无数游戏工作者对于概念定位的精准分析与把控。 在由腾讯游戏学堂主办的TGDC2022游戏开发者大会上,来自腾讯互娱天美Y1工作室的美术总监廖俊豪就从多年从业经验出发,围绕“高概念美术风格”主题,为我们讲述了他对于游戏世界观和美术风格的探索心得,并为大家解析了开放世界的设计
腾讯ISUX
2022/09/19
4720
从《孤岛惊魂》系列出发,聊聊如何打造一个引人入胜的开放世界
念叨了一年的游戏叙事书中文版终于出了!
👆点击“博文视点Broadview”,获取更多书讯 Video Game Storytelling中文版 《扣人心弦:游戏叙事技巧与实践》 终于来啦! 本书封面取自游戏《藏梦》,大家可以关注一下这款有着独特韵味的独立作品。 原作者Evan Skolnick,是一名长期活跃在游戏界传道授业的人士。放上他的简介: Evan Skolnick在世界级娱乐公司(如漫威、动视和卢卡斯电影)拥有超过25年的叙事和游戏开发经验,他为游戏的叙事体验带来了独特的视角。作为一名国际化的演说家和教育家,他为超过1000名游戏
博文视点Broadview
2023/04/19
6360
念叨了一年的游戏叙事书中文版终于出了!
左手持着枪,右手变成光 | 又get到一个英雄射击的新知识点!
作者:nclshuang 腾讯互动娱乐游戏策划  导语|  随着传统射击赛道富营养化趋势愈演愈烈,英雄射击逐渐崛起并成为市场上极其受玩家青睐的细分射击品类。而作为构成英雄射击体系的决定性因素,能否设计好技能体系往往是英雄射击游戏的安身立命之本。本文旨在从市场上热门英雄射击游戏的技能体系设计切入,尝试性还原在架构英雄射击体系时沉淀下来的【PS4R】思考体系。 前言 当提到对于【英雄射击】品类的第一印象,大部分人的最初记忆可能还来源于《守望先锋》,还有部分老玩家可能会提到《植物大战僵尸:花园战争》或者
腾讯大讲堂
2021/08/23
8180
游戏开发完整流程
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/125557.html原文链接:https://javaforall.cn
全栈程序员站长
2022/07/22
2.8K0
运营探索 | QQ游戏中心宣发设计
导语 印象中的游戏宣发平台的设计,可能会联想到“lol新英雄”的绝美CG、也可能是“一刀999”的洗脑画面…运营类型琳琅满目,风格亦大相径庭,市场上不同的平台宣发游戏的手段、宣发的广告形式也是层出不穷。 游戏的运营宣发是用户对于游戏的第一直观感知,宣发的设计对于游戏有着重要影响,因此设计师需要不断思考探索如何准确触达用户、完成转化。 每款游戏注定只能陪你一段路  "你也许或多或少经历过喜欢的一款游戏,从开始、到好友公会逐渐壮大、再到好友一个个离线、最后停服…这是每个玩家和游戏制作者不想要但大多数都
腾讯ISUX
2021/06/30
1.3K0
SE与迪士尼强强联合下的《王国之心》,如何用VR重温延续了17年的经典?
作为一款结合了日式RPG经典风格和迪士尼经典IP的重量级作品,王国之心系列可谓无人不知,无人不晓,并且成功地在差异明显的欧美游戏市场和日本游戏市场实现两开花。但在国内,这款今年方才支持中文的游戏,就远没有国外那么出名了。那么这款游戏究竟有着什么样的魅力?
VRPinea
2019/08/06
4340
PAX East 2019|索尼展示PS VR游戏《Golem》,《无主之地》全员回归!
当地时间3月28日,PAX East 2019已于波士顿会展中心正式开幕了!这一届还恰逢PAX East十周年,着实吸引了不少游戏厂商!
VRPinea
2019/04/28
6910
PAX East 2019|索尼展示PS VR游戏《Golem》,《无主之地》全员回归!
一看就懂【来自英雄联盟盖伦的怒吼】与 Python 详解设计模式(二)观察者模式
观察者模式(有时又被称为模型-视图(View)模式、源-收听者(Listener)模式或从属者模式)是软件设计模式的一种。在此种模式中,一个目标物件管理所有相依于它的观察者物件,并且在它本身的状态改变时主动发出通知。这通常透过呼叫各观察者所提供的方法来实现。此种模式通常被用来实现事件处理系统。
崔庆才
2018/12/13
6890
VR游戏推荐之:论《如何让小盆友们好好地度过这个暑假》
已时至七月中旬,又到了令小朋友们喜大普奔的暑假时间。同时,也是家长们更加劳心劳力的一段时期。如何平平安安、“你好、我好、大家好”地度过这个假期,又成了摆在家长眼前的老问题。小编已经可以脑补出一场又一场的“世纪大战”了。
VRPinea
2018/07/26
5520
VR游戏推荐之:论《如何让小盆友们好好地度过这个暑假》
英雄联盟 源代码_c语言游戏源码
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/04
4.1K0
《超神学院》/《雄兵连》影评
每一个时代都有它独特的记忆风景。我不能说我青春的回忆就是英雄联盟,一是我的青春还未逝去,二是那样说也显得我的记忆太过苍白。可我永远也无法忘记和室友们一起去开黑的日子。
用户2145057
2018/10/10
1.4K0
《游戏专业概论》总结+笔记
毕业设计心得:开篇先来写一写这个吧,我把它藏在这个这篇博客的开头,如果也有希望入行产品/游戏策划、设计有关的行业的同学,也可以看看这只愣头青是怎么设计一款lj游戏的。 同时,我认为编写博客,可以让我总结以往失败的教训以及成功的经验,对于我来说,这笔课堂记在本子上的笔记有用多了。 我的毕业设计,是设计一款能够让小学2-6年级的学生自学C++的严肃游戏。得益于我的高中老师,我本身从事编程教育工作应该说是有一些年头了,而这次毕业设计也算是一次很好的实践机会。 先说一下团队配置,1个策划(我)6个写代码的,2个美术
[Sugar]
2022/09/21
7420
论可复用的游戏服务器端开发框架(一)
本文试图以游戏服务器端开发的角度,探讨在需求高度变化的环境下,可重用模块构建的可能性和基本方案。 可复用框架的必要性与可行性 在现代游戏产品的开发中,游戏服务器端程序已经几乎成为了标配。从最简单的正版保护功能,到玩家档案、成就的存储功能,到复杂的主要游戏逻辑运算,游戏服务器端系统都是必不可少的。但是和客户端丰富的游戏引擎不同,服务器端比较少这类可复用的软件产品出现。其原因可能有以下几个:一是欧美、日本的服务器端逻辑一般比较少,所以这类产品的需求也比较少;二是游戏服务器端本身涉及大量不同的运行平台、环境、语
韩伟
2018/03/05
2.6K0
论可复用的游戏服务器端开发框架(一)
2023年与游戏相关的网络威胁:《我的世界》继续领跑
眼下,游戏产业持续火爆,全球领先的游戏调研机构Newzoo发布的《2023年全球游戏业调查报告》显示,全球游戏玩家已超30亿,比去年增加了6.3%。全球游戏收入约为2423.9亿美元,其中近一半来自亚太地区。到2030年,这一全球总额预计将增加一倍以上,达到5836.9亿美元。
FB客服
2023/11/29
5730
2023年与游戏相关的网络威胁:《我的世界》继续领跑
推荐阅读
相关推荐
近10年“女性向”游戏深度解读
更多 >
LV.1
深圳市腾讯计算机系统有限公司
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验