DDR爱好者之家

JavaScript中利用构造器函数模拟类的方法
站长资源 2024/11/28 佚名
1 1538
DDR爱好者之家 Design By 杰米

前言

本文小编带大家一起学习的是在 JavaScript 中使用构造器函数（construcor function）模拟类。下面话不多说，感兴趣的朋友们下面来一起看看吧。

构造器函数简介

你可以使用 ES6 的 class 关键字来实现类，不过我建议你使用传统的构造器函数来模拟类，因为这样可以给人一种你是个 JavaScript 老手的错觉，哈哈！

什么是构造器函数？构造器函数是编写对象的方法之一。一般情况下，你可以这样编写一个对象：

var obj = { a:1, b:2 };

但也可以使用构造器函数来编写对象：

function Obj(a, b){
 this.a = a;
 this.b = b;
}
var obj = new Obj(1, 2); //obj 等价于 { a:1, b:2 }

使用构造器函数的好处在于可以传递参数。构造器函数通常首字母大写，而且需要使用 new 关键词来调用。在 JavaScript 中是没有类的，利用构造器函数我们可以模拟一个类。

使用构造器函数编写栈类

了解了构造器函数，我们使用它编写一个迷你的栈类，下面就是实现代码：

Stack.js

function Stack() {
 // 私有变量 items，用于记录数组，对象不能直接操作
 var items = [];
 // 类方法 push，在数组末尾添加项，对象可以直接调用
 this.push = function (element) {
 items.push(element);
 };
 // 删除并返回数组末尾的项
 this.pop = function () {
 return items.pop();
 };
}

上述栈类中，有个私有变量 items ，为何它就不能直接操作呢？为何挂在 this 上的方法可以直接调用？因为 new 操作符会将构造器函数中的 this 指向生成的对象，也就是说挂在 this 上的方法或属性将来会成为生成对象的方法或属性，所以可以直接调用。而 items 则是函数内部的一个局部变量，它在函数外部是不可见的，生成对象只能通过调用自身的方法，沿着作用域链来操作 items。

var stack = new Stack();
// stack 对象不能直接操作items，结果是 undefined
console.log(stack.items) 
 
// stack 对象可以直接操作构造器函数中挂在 this 上的属性和方法
stack.push(1);
// 打印了1
console.log(stack.pop())

如果你不熟悉 JavaScript ，那么你应该先学习一下 JavaScript 作用域、this 和 new 操作符的相关知识。推荐阅读参考 Stoyan Stefanow 的《JavaScript 面向对象编程指南》，这本书里面有很多小的代码片段以及相关的图文解读，可以帮助你更好地理解 JavaScript 的相关特性。

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家学习或者使用Javascript能带来一定的帮助，如果有疑问大家可以留言交流。

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

P70系列延期，华为新旗舰将在下月发布

3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。

而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？

根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米