js面向对象编程

1.js面向对象之对象

1.1js代码

<script>
function hello(){
    alert("hi!");
}
//使用prototype属性为类添加属性和方法
hello.prototype={
    name:"lihua",
    say:function(){
        alert(this.name);
    }
}
//测试
function test(){
    var people=new hello();
    people.say();
    alert(people.name);
}
test();  //hi!  lihua   lihua
</script>

向一个对象添加实例方法和属性,我们可以采用上述的方式,即使用prototype关键字进行赋值,格式如下:

对象名称.prototype = {
属性一 : 属性值,
属性二 : 属性值,
方法一 : function(参数列表) {
    方法体;
  },
方法二 : function(参数列表) {
    方法体;
  }
}

可以按照如上方式对一个对象进行多个属性和方法的定义,这样在new一个对象后,就可以使用实例名称.属性或方法来获取属性或执行方法了。

  1.2上述代码中属性和方法类似于java中共有属性和方法,如何声明私有属性和方法?

javascript中函数允许嵌套,我们可以利用内嵌函数和属性声明私有方法和属性

js代码

<script>
//借助javascript允许函数嵌套机制实现类
function hello(){
    var privatePro="hi";
    this.say=function(){
        alert(privatePro);
    }
}
//测试
function test(){
    var people=new hello();
    people.say();             //调用say()方法打印hi
    alert(people.privatePro); //打印undefined
}
test();                       //hi!    undefined
</script>

1.3上面所说的都是定义一个类的实例方法和属性。在JAVA中类有实例方法和属性与类方法和属性之分。所谓类属性和方法就是该类的所有实例都只维护一份类属性和类方法的副本,而不是每个实例都维护一套,这和实例属性和实例方法是不一样的。那么在JS中如何为一个类定义静态类方法和类属性呢?

直接为类添加静态属性和静态方法

注意:静态属性和静态方法只能通过类名进行访问,不能通过实例进行访问

js代码

<script>
//借助javascript允许函数嵌套机制实现类
function hello(){
    var privatePro="hi";
    this.say=function(){
        alert(privatePro);
    }
}
//为hello类添加静态属性和方法
hello.age=23;
hello.getAge=function(){
    alert(hello.age)
}
//测试
function test(){
    var people=new hello();
    people.say();             //正确,实例方法,通过实例调用say()方法打印hi
    alert(people.privatePro); //打印undefined
    hello.getAge();           //正确,静态方法通过类名进行访问
    people.getAge();          //错误,不能通过实例访问静态方法,回报js错误
}
test();
</script>

2.js面向对象之继承

2.1js继承大体分为两种:对象冒充,原型方式

时间: 2024-08-04 18:17:16

js面向对象编程的相关文章

简单粗暴地理解js原型链--js面向对象编程

简单粗暴地理解js原型链--js面向对象编程 原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈就是原型.原型也是对象,叫原型对象. 2)人他妈和人他爸啪啪啪能生出一堆人宝宝.妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗

js面向对象编程:如何实现方法重载

js中如何实现方法重载?这涉及到三个问题 1同名函数的调用问题 2函数中特殊的参数arguments 3如何利用arguments实现方法重载 1同名函数的调用问题 都知道在js中如果存在多个名称相同的函数,则调用实际每次都只使用最后一个,js其实是没有重载的,也就是说,如果定义了多个同名的函数,单参数不一样,在调用时,js不管参数个数,只管前后顺序 例如: function test1(arg1) { alert("参数1:"+arg1); } function test1(arg1

js面向对象编程:如何定义常量?

js中有一个关键字const,但目前的浏览器似乎还不支持,如果一定要定义一些常量,其实可以使用闭包,匿名函数实现常量的定义. 例如: var Class = (function() { var UPPER_BOUND = 100;//定义了常量 var Test={}; // 定义了一个静态方法 获取常量的方法 Test.getUPPER_BOUND=function() { return UPPER_BOUND; } return Test; })(); 用法: var k=Class.get

js面向对象编程:两个小括号的使用

在查看很多jQuery的过程中,经常遇到两个小括号的情况. 例如: (function() { alert("测试1"); })(); (function() { alert("测试3"); }()); 其实这段代码,就是定义了一个匿名函数,并且进行了调用, 相当于如下几行代码: (function ListCommon2() { alert("测试1"); })(); (function ListCommon3() { alert("

js面向对象编程:this到底代表什么?

在js中this的用法很让人迷惑,有些像Java或者C#中的this,但又不完全一样.按照流行的说法this总是指向调用方法的对象. 1.纯粹函数调用. function ListCommon2(x) { this.x=x; alert("this 是 ListCommon2"+(this instanceof ListCommon2)); alert("this.constructor"+this.constructor); } function test(){

js面向对象编程:如何检测对象类型

在js中检测对象类型主要有三种,typeof,instanceof,constructor,这几种都可以检测对象的类型,但又有一定的区别.   1使用typeof检测对象类型. typeo作为最常用的检测类型的方法,返回字符串类型,具体使用如下: function testType(value) { var str=typeof(value); // alert(str); switch(str) { case 'undefined': // undefined类型 case 'object'

JavaScript强化教程-JS面向对象编程

本文为H5EDU机构官方HTML5培训教程,主要介绍:JavaScript强化教程--JS面向对象编程  对事物的抽象描述  描述这类事物的特征和行为  对象是类的实例代码实现:创建一个类  function peple(){        this.hp=0;         this.act = 30;         this.name = "";         this.x=0;         this.y=0;         this.move =function(x,

js面向对象编程(二) 构造函数继承

构造函数绑定 //基类建筑物var building = function () {    this.spec = "building";}; //address:房子地址,toward:房子朝向var house = function (address, toward) {    this.address = address;    this.toward = toward;}; //使房子继承建筑物 //使用call或者apply方法,将父对象的构造函数绑定在子对象上,在子对象构造

js面向对象编程:this到底代表什么?第二篇

总认为自己弄明白了js中this的含义,this总是指向调用方法的对象,作为方法调用,那么this就是指实例化的对象.但前几天自己写脚本却遇到了一个很奇怪的问题. 代码如下: //内部对象AutoCompleteInner function AutoCompleteInner(transformResultInner) { if(transformResultInner) { this.transformResultInner=transformResultInner; } } AutoComp

js面向对象编程: js类定义函数时prototype和this区别?

在面向对象编写js脚本时,定义实例方法主要有两种 如下: function ListCommon2(afirst) { var first=afirst; this.do1=function () { alert("first do"+first); } } ListCommon2.prototype.do2=function() { // alert("first do"+first);//会出错,不能访问first this.do1(); } this.do1=