js基础知识(公有方法、私有方法、特权方法)


Posted in Javascript onNovember 06, 2015

本文涉及的主题虽然很基础,在许多人看来属于小伎俩,但在JavaScript基础知识中属于一个综合性的话题。这里会涉及到对象属性的封装、原型、构造函数、闭包以及立即执行表达式等知识。

公有方法
公有方法就是能被外部访问并调用的方法。

// 在对象中
var Restaurant = {
 name: 'McDonald',
 // 公有方法
 getName: function() {
 return this.name;
 }
}

// 在构造函数中
function Person(name, age) {
 this.name = name;
 this.age = age;
 // 公有方法
 this.getName = function() {
 return this.name;
 }
}

// 在原型中
Person.prototype.getAge = function() {
 return this.age;
}

私有方法特权方法
这两个方法一般放在一起讨论,原因在于我们定义的特权方法是指有权访问内部私有属性和私有方法的公有方法,而私有方法是指外部不可见且不可访问的方法。

通常定义一个对象的方式有二种,一是使用Object实例化或者对象表达式,二是使用构造函数。同样在不同的方式下面定义私有方法和特权方法的形式也不相同。

在对象中
这里我们通过Object对象表达式来创建一个对象并添加一些属性和方法,然后直接采用静态的方式调用。对象的私有数据放置在一个匿名函数立即执行表达式(IIFE)中。这意味着这个函数只存在于被调用的瞬间,一旦执行后就立即被销毁了。

在对象中创建私有数据的方式在对象的模式(指创建对象的模式)中被称之为模块模式,它的基本格式如下:

var yourObject = (function() {

 // 私有属性和方法

 return {
 // 公有方法和属性
 }
}) ();

在模块模式中,返回的对象字面量中只包含可以公开的属性和方法。

var Restaurant = (function() {
 // 私有属性
 var _total = 10;

 // 私有方法
 var _buyFood = function() {
 _total--;
 };
 var _getTotal = function() {
 return _total;
 }

 return {
 name: 'McDonald',
 getTotal: _getTotal,
 buy: _buyFood
 }
}) ();

Restaurant.buy();
console.log(Restaurant.name); // 'McDonald'
console.log(Restaurant.getTotal()); // 9

注意我们使用了闭包的方式来间接使用内部私有变量,同时对餐厅(Restaurant)名(name)进行了初始化。

在构造函数中
在上面介绍的模块模式创建私有方法时,公有方法和特权方法并没有什么本质上的区别,原因在于这个概念是来自于使用构造函数创建私有数据的时候定义出来的。

在构造函数中定义私有属性和方法很方便,我们不需要使用闭包,可以在调用的时候初始化数据。

function Restaurant(name) {
 // 私有属性
 var _total = 10;

 // 公有属性
 this.name = name;

 // 私有方法
 function _buyFood() {
 _total--;
 }

 // 特权方法
 this.buy = function() {
 _buyFood();
 }

 this.getTotal = function() {
 return _total;
 }
}

// 公有方法, 注意这里不能访问私有成员_total
Restaurant.prototype.getName = function() {
 console.log(_total); // Uncaught ReferenceError: _total is not defined
 return this.name;
}

var McDonald = new Restaurant('McDonald');
console.log(McDonald.getName()); // 'McDonald'
McDonald.buy();
console.log(McDonald.getTotal()); // 9

合二为一,更加灵活的方式
使用模块模式我们可以多次调用,每次执行完后都会被销毁掉。使用构造函数方式可以传入一些初始化的数据,但在公有方法中无法访问到私有成员属性,如果有很多公有方法需要访问私有数据,我们全部用特权方法来写,最后会给每个实例带去很多没有必要的方法。因此,将两者结合在一起可以长短互补,结合方式也很简单

var Restaurant = (function() {
 // 私有属性
 var _total = 10;

 // 私有方法
 function _buyFood() {
 _total--;
 }

 // 构造函数
 function restaurant(name) {
 this.name = name;
 this.getTotal = function() {
 return _total;
 }
 }

 restaurant.prototype.buy = function() {
 console.log(_total); // 10
 _buyFood();
 }

 restaurant.prototype.getName = function() {
 return this.name;
 }

 return restaurant;
}) ();

var McDonald = new Restaurant('McDonald');
console.log(McDonald.getName()); // 'McDonald'
McDonald.buy();
console.log(McDonald.getTotal()); // 9

以上就是本文的全部内容,小编只是总结了其中一小部分,还有许多未提及到的知识点,大家可以自己摸索研究,希望本文可以对初学者有所帮助。

Javascript 相关文章推荐
新鲜出炉的js tips提示效果
Apr 03 Javascript
JS控件的生命周期介绍
Oct 22 Javascript
jquery 延迟执行实例介绍
Aug 20 Javascript
js 金额格式化来回转换示例
Feb 23 Javascript
jQuery中实现prop()函数控制多选框(全选,反选)
Aug 19 Javascript
Javascript 调用 ActionScript 的简单方法
Sep 22 Javascript
vue-cli入门之项目结构分析
Apr 20 Javascript
vue和webpack安装命令详解
Jun 15 Javascript
详解关于element el-button使用$attrs的一个注意要点
Nov 09 Javascript
Vue + Node.js + MongoDB图片上传组件实现图片预览和删除功能详解
Apr 29 Javascript
实现一个简单得数据响应系统
Nov 11 Javascript
js面向对象编程OOP及函数式编程FP区别
Jul 07 Javascript
JS实现的N多简单无缝滚动代码(包含图文效果)
Nov 06 #Javascript
javascript中的altKey 和 Event属性大全
Nov 06 #Javascript
JS日期加减,日期运算代码
Nov 05 #Javascript
程序员必知35个jQuery 代码片段
Nov 05 #Javascript
js如何实现淡入淡出效果
Nov 18 #Javascript
JavaScript数组去重的五种方法
Nov 05 #Javascript
javascript实现tab切换的两个实例
Nov 05 #Javascript
You might like
php调用c接口无错版介绍
2014/03/11 PHP
一个用js实现的页内搜索代码
2007/05/23 Javascript
jQuery怎么解析Json字符串(Json格式/Json对象)
2013/08/09 Javascript
JavaScript动态改变HTML页面元素例如添加或删除
2014/08/10 Javascript
微信小程序 animation API详解及实例代码
2016/10/08 Javascript
Bootstrap基本插件学习笔记之按钮(21)
2016/12/08 Javascript
boostrapTable的refresh和refreshOptions区别浅析
2017/01/22 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
JavaScript数组和对象的复制
2017/03/21 Javascript
bootstrap datepicker插件默认英文修改为中文
2017/07/28 Javascript
详细介绍RxJS在Angular中的应用
2017/09/23 Javascript
浅析Visual Studio Code断点调试Vue
2018/02/27 Javascript
vue-image-crop基于Vue的移动端图片裁剪组件示例
2018/08/28 Javascript
对vue中methods互相调用的方法详解
2018/08/30 Javascript
原生js添加一个或多个类名的方法分析
2019/07/30 Javascript
浅谈Vue为什么不能检测数组变动
2019/10/14 Javascript
Javascript幻灯片播放功能实现过程解析
2020/05/07 Javascript
[01:57]2016完美“圣”典风云人物:国士无双专访
2016/12/04 DOTA
[59:42]Secret vs Alliacne 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python中getattr函数和hasattr函数作用详解
2016/06/14 Python
python中defaultdict的用法详解
2017/06/07 Python
Python如何实现MySQL实例初始化详解
2017/11/06 Python
python的pandas工具包,保存.csv文件时不要表头的实例
2018/06/14 Python
python去重,一个由dict组成的list的去重示例
2019/01/21 Python
python实现证件照换底功能
2019/08/20 Python
CSS3制作轮播图的一种方法
2019/11/11 HTML / CSS
加拿大著名的奢侈品购物网站:SSENSE(支持中文)
2020/06/25 全球购物
建筑公司文秘岗位职责
2013/11/29 职场文书
中英文自我评价语句
2013/12/20 职场文书
简历自我评价怎么写呢?
2014/01/06 职场文书
《一株紫丁香》教学反思
2014/02/19 职场文书
学习演讲稿范文
2014/05/10 职场文书
大学生党员承诺书
2014/05/20 职场文书
普通党员四风问题对照检查材料
2014/09/27 职场文书
餐厅收银员岗位职责
2015/04/07 职场文书
2015年个人实习工作总结
2015/05/28 职场文书