js面向对象之公有、私有、静态属性和方法详解


Posted in Javascript onApril 17, 2015

现下,javascript大行其道,对于网站开发人员来说,javascript是必需掌据的一门语言,但随着jquery等框架的流行和使用,许多人对于原生javascript缺乏深入的理解,习惯了函数式的编辑风格,对于闭包、原型总是说不清道不明.对于js面向对象蹩脚的用着,而要了解js面向对象,就必需先了解js中什么是公有方法、特权方法、静态方法

方法/步骤

1.公有属性和公有方法

function User(name,age){
  this.name = name;//公有属性
  this.age = age;
}
User.prototype.getName = function(){//公有方法
  return this.name;
}
var user = new User('fire子海',26);
console.log(user.getName());//output:fire子海

2.私有属性和方法

function User(name,age){
  var name = name;//私有属性
  var age = age;
  function alertAge(){//私有方法
     alert(age);
  }
  alertAge(age); //弹出26
}
var user = new User('fire子海',26);

3.静态属性和方法

在php中,无需实例化就可以调用的方法就叫静态方法,js也一样,无需实例化,即用new操作符实化对象,就可调用对象的方法和属性。

function User(){}
User.age = 26;//静态属性
User.myname = 'fire子海';
User.getName =function(){//静态方法
 
  return this.myname;//如果这里使用this.name,返回的将是User,所有改用了myname,
}
console.log(User.getName());//output:fire子海

4.特权方法

function User(name,age){
  var name = name;//私有属性
  var age = age;
  this.getName = function(){ //特权方法
     return name;//私有属性和方法不能使用this调用
  }
}
var user = new User('fire子海',26);
console.log(user.getName());//output:fire子海

5.静态类

对于静态方法和静态属性,我们无需像第三步中那样去创建,如果网友看过我那篇“js如何制作图片轮播”,就知道可以使用字面量的方式来创建。

var user = {
  init:function(name,age){
   this.name = name;
   this.age = age;
  },
  getName:function(){
   return this.name;
 }
}
user.init('fire子海',26);
console.log(user.getName());//output:fire子海

6.公有方法的调用规则

调用公有方法,我们必需先实例化对象

公有方法中通过不this调用公有属性和特权方法,不能使用this调用静态方法和属性,必需裁通过对象本身调用,即对象名。公有方法也不能调用私有方法

function User(){
  this.myname = 'fire子海';//公有属性
  this.age = 26;
  this.do = function(){//特权方法
    return this.myname+'学习js';
  }
}
User.eat = function(food){
 return '晚餐只有'+food;
}
User.prototype.alertAge = function(){
  alert(this.age);
}
User.prototype.alertDo = function(){
  alert(this.do());//调用特权方法
}
User.prototype.alertEat = function(food){
  alert(User.eat(food));//只能通过对象本身调用静态方法
  //alert(this.ear(food))这样调用将出错:this.eat is not a function
}
var user = new User();
user.alertAge();//alert:26
user.alertDo();//alert:fire子海学习js
user.alertEat('方便面')//alert:晚餐只有方便面

7.静态方法的调用规则

使用静态方法时,无需实例化对象,便可以调用,对象实例不能调用对象的静态方法,只能调用实例自身的静态属性和方法

function User(){}
User.age = 26;//静态属性
User.myname = 'fire子海';
User.getName =function(){//静态方法
 
  return this.myname;
}
var user = new User();
console.log(user.getName);//TypeError: user.getName is not a function
user.supper = '方便面';
user.eat = function(){
 return '晚餐只有'+this.supper;
}
user.eat();//晚餐只有方便面

静态方法无法调用公有属性、公有方法、私有方法、私有属性、特权方法和原型属性

function User(){
    this.myname = 'fire子海';//公有属性
    this.age = 26;
    this.do = function(){//特权方法
      return this.myname+'学习js';
    }
}
User.prototype.alertAge = function(){//公共方法,也叫原型方法
  alert(this.age);
}
User.prototype.sex = '男';//原型属性
User.getName= function(){//静态方法
  return this.myname;
}
User.getAge = function(){
   this.alertAge();
 
}
User.getDo = function(){
  return this.do();
}
//console.log(User.getName())//undefined
//console.log(User.getDo());//TypeError: this.do is not a function
//console.log(User.getAge())//TypeError: this.alertAge is not a function

8.特权方法的调用规则

特权方法通过this调用公有方法、公有属性,通过对象本身调用静态方法和属性,在方法体内直接调用私有属性和私有方法

function User(girlfriend){
   var girlfriend = girlfriend;
   function getGirlFriend(){ 
     return '我女朋友'+girlfriend+'是美女!';
   }
  this.myname = 'fire子海';//公有属性
  this.age = 26;
  this.do = function(){//特权方法
    return this.myname+'学习js';
  }
  this.alertAge = function(){
   this.changeAge();//特权方法调用公有方法
    alert(this.age);
  }
  this.alertGirlFriend = function(){
   alert(getGirlFriend());//调用私有方法
  }
}
User.prototype.changeAge = function(){
  this.age = 29;
}
var user = new User('某某');
user.alertAge();//alert:29
user.alertGirlFriend();//alert:我的女朋友某某是美女!

9.私有方法

对象的私有方法和属性,外部是不可以访问的,在方法的内部不是能this调用对象的公有方法、公有属性、特权方法的

function User(girlfriend){
   var girlfriend = girlfriend;
  this.myname = 'fire子海';//公有属性
  this.age = 26;
  function getGirlFriend(){ 
   //this.myname ;//此时的this指向的window对象,并非User对象,
    // this.myname = 'fire子海',此时的this指向的是getGirFriend对象了。
  //如果通过this调用了getGirFriend中不存在的方法呀属性,this便会指向window 对象,只有this调用了getGirlFriend存在的方法和属性,this才会指定getGirlFriend;
     alert(User.eat('泡面'));//alert:晚餐只有方便面
  }
  this.do = function(){//特权方法
    return this.myname+'学习js';
  }
  this.alertAge = function(){
   this.changeAge();//特权方法调用公有方法
    alert(this.age);
  }
  this.alertGirlFriend = function(){
   getGirlFriend();//调用私有方法
  }
}
User.eat = function(supper){
 return '晚餐只有'+supper;
}
var user = new User('某某');
user.alertGirlFriend();

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
Eval and new funciton not the same thing
Dec 27 Javascript
jQuery中用dom操作替代正则表达式
Dec 29 Javascript
javascript中的previousSibling和nextSibling的正确用法
Sep 16 Javascript
javascript下拉列表菜单的实现方法
Nov 18 Javascript
JavaScript学习笔记之数组随机排序
Mar 23 Javascript
浅谈javascript中的constructor
Jun 08 Javascript
js实现简单的计算器功能
Jan 16 Javascript
Vue响应式原理详解
Apr 18 Javascript
微信小程序调用PHP后台接口 解析纯html文本
Jun 13 Javascript
JavaScript之浏览器对象_动力节点Java学院整理
Jul 03 Javascript
bootstrap confirmation按钮提示组件使用详解
Aug 22 Javascript
浅谈Vue服务端渲染框架Nuxt的那些事
Dec 21 Javascript
jQuery中toggle()函数的使用实例
Apr 17 #Javascript
JQuery实现可直接编辑的表格
Apr 16 #Javascript
JS中捕获console.log()输出的方法
Apr 16 #Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
Apr 16 #Javascript
JavaScript通过setTimeout实时显示当前时间的方法
Apr 16 #Javascript
jQuery监控文本框事件并作相应处理的方法
Apr 16 #Javascript
JavaScript动态修改背景颜色的方法
Apr 16 #Javascript
You might like
第十一节--重载
2006/11/16 PHP
一个简单的PHP投票程序源码
2007/03/11 PHP
php将字符串转换为数组实例讲解
2020/05/05 PHP
获得所有表单值的JQuery实现代码[IE暂不支持]
2012/05/24 Javascript
原生js实现改变随意改变div属性style的名称和值的结果
2013/09/26 Javascript
JavaScript中prototype为对象添加属性的误区介绍
2013/10/15 Javascript
用jquery等比例控制图片宽高的具体实现
2014/01/28 Javascript
Jquery 实现checkbox全选方法
2015/01/28 Javascript
javascript中this的四种用法
2015/05/11 Javascript
js实现Select列表内容自动滚动效果代码
2015/08/20 Javascript
jquery对象访问是什么及使用方法介绍
2016/05/03 Javascript
footer定位页面底部(代码分享)
2017/03/07 Javascript
详解JavaScript调用栈、尾递归和手动优化
2017/06/03 Javascript
vue加载自定义的js文件方法
2018/03/13 Javascript
npm scripts 使用指南详解
2018/10/08 Javascript
微信小程序动态显示项目倒计时
2019/06/20 Javascript
node.js文件操作系统实例详解
2019/11/05 Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
2019/11/25 Javascript
详解常用查找数据结构及算法(Python实现)
2016/12/09 Python
用Python3创建httpServer的简单方法
2018/06/04 Python
python爬虫 Pyppeteer使用方法解析
2019/09/28 Python
Python 解决OPEN读文件报错 ,路径以及r的问题
2019/12/19 Python
Tensorflow tf.dynamic_partition矩阵拆分示例(Python3)
2020/02/07 Python
简述python&pytorch 随机种子的实现
2020/10/07 Python
Python中openpyxl实现vlookup函数的实例
2020/10/28 Python
精选奢华:THE LIST
2019/09/05 全球购物
某公司Java工程师面试题笔试题
2016/03/27 面试题
优秀企业获奖感言
2014/02/01 职场文书
高一数学教学反思
2014/02/07 职场文书
经济信息系毕业生自荐信范文
2014/03/15 职场文书
元旦联欢会策划方案
2014/06/11 职场文书
浪漫婚礼主题活动策划方案
2014/09/15 职场文书
党干部专题民主生活会对照检查材料思想汇报
2014/10/06 职场文书
保安2014年终工作总结
2014/12/06 职场文书
2015少先队大队辅导员工作总结
2015/07/24 职场文书
Oracle 数据仓库ETL技术之多表插入语句的示例详解
2021/04/12 Oracle