Javascript中怎么定义类（私有成员、静态成员）？

最新推荐文章于 2021-12-12 16:40:34 发布
最新推荐文章于 2021-12-12 16:40:34 发布
阅读量165 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/Langzi127/archive/2012/09/08/2677089.html
版权

本文将从一个简单例子演绎怎么定义一个具有私有成员、静态成员的类。

 

好，看简单原型：

var Book =  function (isbn, title, author) {
     if (isbn === undefined) {
         throw  new Error('Book constructor requires an isbn.');
    }

     this.isbn = isbn;
     this.title = title || 'No title specified';
     this.author = author || 'No author specified';
};
Book.prototype.display =  function () {
    alert("isbn: " +  this.isbn + ", title: " +  this.title + ", author: " +  this.author);

}; 

实例中再简单不过，不过就是定义了一个有3个参数的构造函数和一个diplay实例方法。问题在于：Book的isbn属性虽然在构造中进行了简单判断，但是这还不够。改进如下：

var Book =  function (isbn, title, author) {
     if (!isValidIsbn(isbn)) {
         throw  new Error('The isbn passed in is invalid.');
    }

     this.isbn = isbn;
     this.title = title || 'No title specified';
     this.author = author || 'No author specified';
};
Book.prototype = {
    isValidIsbn:  function (isbn) {
         if(isbn === undefined ||  typeof isbn != 'string') {
             return  false;
        }

        isbn = isbn.replace(/-/, '');  //  Remove dashes.
         if(isbn.length != 10 && isbn.length != 13) {
             return  false;
        }
         var sum = 0;
         if(isbn.length === 10) {  //  10 digit ISBN.
             if(!isbn.match(/^\d{9}/)) {  //  Ensure characters 1 through 9 are digits.
                 return  false;
            }
             for( var i = 0; i < 9; i++) {
                sum += isbn.charAt(i) * (10 - i);
            }
             var checksum = sum % 11;
             if(checksum === 10) checksum = 'X';
             if(isbn.charAt(9) != checksum) {
                 return  false;
            }
        } else {  //  13 digit ISBN.
             if(!isbn.match(/^\d{12}/)) {  //  Ensure characters 1 through 12 are digits.
                 return  false;
            }
             for( var i = 0; i < 12; i++) {
                sum += isbn.charAt(i) * ((i % 2 === 0) ? 1 : 3);
            }
             var checksum = sum % 10;
             if(isbn.charAt(12) != checksum) {
                 return  false;
            }
        }

         return  true;
    },
    display:  function(){
        alert("isbn: " +  this.isbn + ", title: " +  this.title + ", author: " +  this.author);
    }

}; 

新加入的isValidIsbn实例方法主题来源于Pro Javascript Design Pattern(同时修正了里面的部分错误)。借鉴于主流OOP语言做法，我们继续也为Book类增加访问器。如下：

 

// var Publication = new Interface("Publication", ['getIsbn', 'setIsbn', 'getTitle', 'setTitle', 'getAuthor', 'setAuthor', 'display']);

var Book =  function (isbn, title, author) {
     this.setIsbn(isbn);
     this.setTitle(title);
     this.setAuthor(author);
};
Book.prototype = {
    isValidIsbn:  function (isbn) {
         if (isbn === undefined ||  typeof isbn != 'string') {
             return  false;
        }

        isbn = isbn.replace(/-/, '');  //  Remove dashes.
         if (isbn.length != 10 && isbn.length != 13) {
             return  false;
        }
         var sum = 0;
         if (isbn.length === 10) {  //  10 digit ISBN.
             if (!isbn.match(/^\d{9}/)) {  //  Ensure characters 1 through 9 are digits.
                 return  false;
            }
             for ( var i = 0; i < 9; i++) {
                sum += isbn.charAt(i) * (10 - i);
            }
             var checksum = sum % 11;
             if (checksum === 10) checksum = 'X';
             if (isbn.charAt(9) != checksum) {
                 return  false;
            }
        }  else {  //  13 digit ISBN.
             if (!isbn.match(/^\d{12}/)) {  //  Ensure characters 1 through 12 are digits.
                 return  false;
            }
             for ( var i = 0; i < 12; i++) {
                sum += isbn.charAt(i) * ((i % 2 === 0) ? 1 : 3);
            }
             var checksum = sum % 10;
             if (isbn.charAt(12) != checksum) {
                 return  false;
            }
        }

         return  true;
    },
    getIsbn:  function () {
         return  this.isbn;
    },
    setIsbn:  function (isbn) {
         if (! this.isValidIsbn(isbn)) {
             throw  new Error('The isbn passed in is invalid.');
        }
         this.isbn = isbn;
    },
    getTitle:  function () {
         return  this.title;
    },
    setTitle:  function (title) {
         this.title = title || 'No title specified';
    },
    getAuthor:  function () {
         return  this.author;
    },
    setAuthor:  function (author) {
         this.author = author || 'No author specified';
    },
    display:  function () {
        alert("isbn: " +  this.getIsbn() + ", title: " +  this.getTitle() + ", author: " +  this.getAuthor());
    }
};   

 

但是，这就够了么？实际上，我们还是可以绕过访问器，直接通过对象的属性来操作对象。比如this.isbn="abc"，这显然是invalid的，但是可以赋值成功。我们要做的是让isbn、title、author这些成员私有！


好，先采用业界普遍认同的方法——将伪私有变量已下划线开头:

// var Publication = new Interface("Publication", ['getIsbn', 'setIsbn', 'getTitle', 'setTitle', 'getAuthor', 'setAuthor', 'display']);

var Book =  function (isbn, title, author) {
     this.setIsbn(isbn);
     this.setTitle(title);
     this.setAuthor(author);
};
Book.prototype = {
    _isValidIsbn:  function (isbn) {
         if (isbn === undefined ||  typeof isbn != 'string') {
             return  false;
        }

        isbn = isbn.replace(/-/, '');  //  Remove dashes.
         if (isbn.length != 10 && isbn.length != 13) {
             return  false;
        }
         var sum = 0;
         if (isbn.length === 10) {  //  10 digit ISBN.
             if (!isbn.match(/^\d{9}/)) {  //  Ensure characters 1 through 9 are digits.
                 return  false;
            }
             for ( var i = 0; i < 9; i++) {
                sum += isbn.charAt(i) * (10 - i);
            }
             var checksum = sum % 11;
             if (checksum === 10) checksum = 'X';
             if (isbn.charAt(9) != checksum) {
                 return  false;
            }
        }  else {  //  13 digit ISBN.
             if (!isbn.match(/^\d{12}/)) {  //  Ensure characters 1 through 12 are digits.
                 return  false;
            }
             for ( var i = 0; i < 12; i++) {
                sum += isbn.charAt(i) * ((i % 2 === 0) ? 1 : 3);
            }
             var checksum = sum % 10;
             if (isbn.charAt(12) != checksum) {
                 return  false;
            }
        }

         return  true;
    },
    getIsbn:  function () {
         return  this._isbn;
    },
    setIsbn:  function (isbn) {
         if (! this._isValidIsbn(isbn)) {
             throw  new Error('The isbn passed in is invalid.');
        }
         this._isbn = isbn;
    },
    getTitle:  function () {
         return  this._title;
    },
    setTitle:  function (title) {
         this._title = title || 'No title specified';
    },
    getAuthor:  function () {
         return  this._author;
    },
    setAuthor:  function (author) {
         this._author = author || 'No author specified';
    },
    display:  function () {
        alert("isbn: " +  this.getIsbn() + ", title: " +  this.getTitle() + ", author: " +  this.getAuthor());
    }

}; 

这样貌似可以，至少老鸟们一般不会再Book实现外部去碰它们。但是，有没有更纯的？ 有！请看：

 

var Book =  function (isbn, title, author) {
     var _isbn, _title, _author;

     function isValidIsbn(isbn) {
         if (isbn === undefined ||  typeof isbn != 'string') {
             return  false;
        }

        isbn = isbn.replace(/-/, '');  //  Remove dashes.
         if (isbn.length != 10 && isbn.length != 13) {
             return  false;
        }
         var sum = 0;
         if (isbn.length === 10) {  //  10 digit ISBN.
             if (!isbn.match(/^\d{9}/)) {  //  Ensure characters 1 through 9 are digits.
                 return  false;
            }
             for ( var i = 0; i < 9; i++) {
                sum += isbn.charAt(i) * (10 - i);
            }
             var checksum = sum % 11;
             if (checksum === 10) checksum = 'X';
             if (isbn.charAt(9) != checksum) {
                 return  false;
            }
        }  else {  //  13 digit ISBN.
             if (!isbn.match(/^\d{12}/)) {  //  Ensure characters 1 through 12 are digits.
                 return  false;
            }
             for ( var i = 0; i < 12; i++) {
                sum += isbn.charAt(i) * ((i % 2 === 0) ? 1 : 3);
            }
             var checksum = sum % 10;
             if (isbn.charAt(12) != checksum) {
                 return  false;
            }
        }

         return  true;
    }

     this.getIsbn =  function () {
         return _isbn;
    }
     this.setIsbn =  function () {
         if (!isValidIsbn(isbn)) {
             throw  new Error('The isbn passed in is invalid.');
        }
        _isbn = isbn;
    };
     this.getTitle =  function () {
         return _title;
    };
     this.setTitle =  function () {
        _title = title || 'No title specified';
    };
     this.getAuthor =  function () {
         return _author;
    };
     this.setAuthor =  function () {
        _author = author || 'No author specified';
    };

     this.setIsbn(isbn);
     this.setTitle(title);
     this.setAuthor(author);
};
Book.prototype.display =  function () {
    alert("isbn: " +  this.getIsbn() + ", title: " +  this.getTitle() + ", author: " +  this.getAuthor());
};    

 

可以看到，3个被期望为私有的属性，先不在绑定在this上了，而是通过var声明在构造器内。显然，它们真的成为私有了，你是无法通过类似于new Book()._isbn来直接访问和改写它们了。然而，这个实现也有一个明显的缺点，那就是对于每个Book实例，它们的访问器都是各有一份，当需要创建多个Book对象实例时，内存就需要被多占用一些了。不过，这对于目前主流的机器来说，可能不是一个问题。

 

 

私有成员的实现到此为止，那静态成员的实现呢？关于静态方法，前面已无声无息的有涉及和实现，这里不再累赘。但是，我这里要讲的是怎么实现涉及到内部私有成员信息的静态成员。比如，我想知道Book被实例了多少次，即想要给Book内部定制一个计数器。先看看一个demo：

var Class = ( function () {
     var constants = {
        UpperBound: 100,
        LowerBound: -100
    };
     var instanceCount = 0;

     var _Class =  function (id, name) {
         var _id, _name;

         this.getId =  function () {
             return _id;
        };
         this.setId =  function (id) {
            _id = id;
        };
         this.getName =  function () {
             return _name;
        };
         this.setName =  function (name) {
            _name = name;
        };

         this.setId(id);
         this.setName(name);
        ++instanceCount;
    };
    _Class.getUpperBound =  function () {
         return constants.UpperBound;
    };
    _Class.getLowerBound =  function () {
         return constants.LowerBound;
    };
    _Class.getInstanceCount =  function () {
         return instanceCount;
    };

     return _Class;
})();

var c1 =  new Class(1, "Zhangsan");
var c2 =  new Class(2, "Lisi");
alert(Class.getLowerBound());

alert(Class.getInstanceCount()); 

Class类共有3个静态方法：getUpperBound()、getLowerBound()、getInstanceCount()，它们均实际为Class类内部私有属性的外部访问器。缘于该私有属性的实现方式和方法的性质，我思考再三，终于自己找到了解决方案！即通过声明内部_Class类，并将它绑定静态方法，以访问闭包内变量，然后将_Class引用抛出。真的是闭包功力无敌！好，终极的Book实现如下：



         var Book = (function () {         

            var numOfBooks = 0;

            function checkIsbn(isbn) {
                if (isbn === undefined || typeof isbn != 'string') {
                    return false;
                }

                isbn = isbn.replace(/-/, ''); // Remove dashes.
                if (isbn.length != 10 && isbn.length != 13) {
                    return false;
                }
                var sum = 0;
                if (isbn.length === 10) { // 10 digit ISBN.
                    if (!isbn.match(/^\d{9}/)) { // Ensure characters 1 through 9 are digits.
                        return false;
                    }
                    for (var i = 0; i < 9; i++) {
                        sum += isbn.charAt(i) * (10 - i);
                    }
                    var checksum = sum % 11;
                    if (checksum === 10) checksum = 'X';
                    if (isbn.charAt(9) != checksum) {
                        return false;
                    }
                } else { // 13 digit ISBN.
                    if (!isbn.match(/^\d{12}/)) { // Ensure characters 1 through 12 are digits.
                        return false;
                    }
                    for (var i = 0; i < 12; i++) {
                        sum += isbn.charAt(i) * ((i % 2 === 0) ? 1 : 3);
                    }
                    var checksum = sum % 10;
                    if (isbn.charAt(12) != checksum) {
                        return false;
                    }
                }

                return true;
            }

            var _Book = function (newIsbn, newTitle, newAuthor) {
                var isbn, title, author;

                this.getIsbn = function () {
                    return isbn;
                };
                this.setIsbn = function (newIsbn) {
                    if (!checkIsbn(newIsbn)) {
                        throw new Error('Book: Invalid ISBN.');
                    }
                    isbn = newIsbn;
                };
                this.getTitle = function () {
                    return title;
                };
                this.setTitle = function (newTitle) {
                    title = newTitle || 'No title specified';
                };
                this.getAuthor = function () {
                    return author;
                };
                this.setAuthor = function (newAuthor) {
                    author = newAuthor || 'No author specified';
                };

                numOfBooks++;
                if (numOfBooks > 50) {
                    throw new Error('Book: Only 50 instances of Book can be created.');
                }

                this.setIsbn(newIsbn);
                this.setTitle(newTitle);
                this.setAuthor(newAuthor);
            };
            _Book.getBookTotalCount = function () {
                return numOfBooks;
            };

            return _Book;
        })();

// Public static method.
Book.convertToTitleCase = function (inputString) {
    return inputString.toUpperCase();
};

// Public, non-privileged methods.
Book.prototype = {
    display: function () {
        alert("isbn: " + this.getIsbn() + ", title: " + this.getTitle() + ", author: " + this.getAuthor()); 
    }
};

var b1 = new Book("9787533668293", "How Apple works", "Steve Jobs");
var b2 = new Book("7883653519", "Biography Bill Gates", "Raymond");
b1.display();
//b2.display();
//Book.convertToTitleCase("It's only a test.");
alert(Book.getBookTotalCount());

好好学习，这边文章含金量绝对很高哦。全部源码download

转载于:https://www.cnblogs.com/Langzi127/archive/2012/09/08/2677089.html

dengxie4419
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
javascript中的静态成员
猿来儒此
11-20 1850
我的Blog原文： 点击打开链接 静态成员是在类的层次上操作，而不是在实例的层次上操作。静态属性和方法也就是那些从一个实例到另一个实例都不会发生改变的属性和方法。 在javascript中并没有特殊的语法来表示静态成员。但是可以通过使用构造函数并且向其添加属性这种方式，从而获得与“类式”语言相通的语法。 在基于类的语言中，静态成员是通过特殊的语法创建的，并且在使用过程中如同类本身的成员一样。
JavaScript中的私有成员（转载）
gischen
02-15 860
JavaScript中的私有成员Douglas Crockfordwww.crockford.com翻译：ShiningRayhttp://www.nirvanastudio.org/ JavaScript 是世界上最被误解的语言。很多人认为它缺乏信息隐藏的特性所以对象不能有私有实例变量和方法。但这是一个误解。JavaScript对象同样可以拥有私有变量。下面就讲解一下：对
JavaScript基础对象创建模式之静态成员(027)
weixin_34380948的博客
09-17 118
在支持“类”的面向对象语言中，静态成员指的是那些所有实例对象共有的类成员。静态成员实际是是“类”的成员，而非“对象”的成员。所以如果 MathUtils类中有个叫max()的静态成员方法，那么调用这个方法的方式应该是这样的：MathUtils.max(3, 5)。 1. 公有静态成员 JavaScript里并没有“类”的实际语言表示，所以也就没有静态成员的语义表示。但由于构造函数本身就是个...
JavaScript如何定义类的属性成员
背着空空的行壤，一路走来，收拾着点点滴滴...
12-11 207
[code="java"] function Car(color,w,h){ //通过this来定义--类似java的 public成员 this.color = color; this.width = w; this.height = h; //通过this来定义--类似java的 private成员 this.area = function(){retur...
javascript 类的三种成员
houlc的专栏
07-13 793
实现类的公有成员　　前面定义的任何类成员都属于公有成员的范畴，该类的任何实例都对外公开这些属性和方法。　　实现类的私有成员　　私有成员即在类的内部实现中可以共享的成员，不对外公开。JavaScript中并没有特殊的机制来定义私有成员，但可以用一些技巧来实现这个功能。　　这个技巧主要是通过变量的作用域性质来实现的，在JavaScript中，一个函数内部定义的变量称为局
JS高级之静态成员和实例成员
李建雨的博客
12-12 1083
成员 就是指属性、方法的统称 静态成员是指 由构造函数直接调用的属性、方法叫静态成员 实例成员是指 由构造函数创建出来对象才能调用的属性和方法就叫实例成员 实例化： 创建一个对象，也可以叫实例化一个对象 静态成员优势 调用方法 实例成员优势 操作不同数据 成员：就是指属性、方法的统称 静态...
Javascript类定义语法,私有成员、受保护成员、静态成员等介绍
12-04
JavaScript 类定义语法是一种模仿传统面向对象编程语言中的类概念的方式，它允许开发者通过JSON对象来描述对象的模板，从而创建具有私有成员、受保护成员和静态成员的类。这种语法通常是由一些自定义函数实现的，...
Javascript 构造函数,公有,私有特权和静态成员定义方法
10-29
其中公有方法声明的部分采用的两种方式，在实际应用中一般采取一种方式就可以了，如果两种方式都要采用的话，应注意顺序，防止前面写的方法被清空或覆盖。
JavaScript中的公有、私有、特权和静态成员用法分析
10-25
主要介绍了JavaScript中的公有、私有、特权和静态成员用法,以实例形式分析了其使用方法,简单易懂,对于初学javascript的朋友具有不错的学习与借鉴价值,需要的朋友可以参考下
Javascript类定义语法,私有成员、受保护成员、静态成员等
weixin_33681778的博客
01-18 83
JS只是一门支持面向对象编程的语言，通过OO可以让我们的代码组织更加人性化。可是与传统基与类的面向对编程语言不同它没有类概念并且没成员访问修饰符。这多少会给我们编程工作会带来一些束缚。 其实通俗的讲类就是对象的模板，为了增强JS的OO特性，受mootoos框架启发我们可以使用一个JSON对象来描述这个对象的模板。在这个模板中我们可以模拟实现私有成员，受保护成员，静态成员。 这是一个在JS中模拟的类...
js 区别（类、成员、属性、对象、方法）
boss2967的博客
11-16 3125
JavaScript Array 对象 Array 对象 Array 对象用于在单个的变量中存储多个值。 创建 Array 对象的语法： new Array(); new Array(size); new Array(element0, element1, ..., elementn); 参数 参数 size 是期望的数组元素个数。返回的数组，length 字段将被设
JS定义一个类
weixin_53126056的博客
12-18 4699
在JS中定义类的方式有两种 第一种 function 类名（形式参数列表）{ this.属性名=参数； this.方法名=function(){ } } 第二种 类名= function(形式参数列表){ this.属性名=参数； this.方法名=function(形式参数列表){ } } <html> <head> <meta charset="utf-8"> <ti
js 类的成员变量和方法
热门推荐
回家换拖鞋的专栏
10-09 1万+
面向对象的基础就是定义类,js 也有类的概念，可以tong
JS-定义类
dxm809的博客
02-07 4472
定义：function 类名称(){…} 看上去与方法语法类型，区别是类名称的首字母大写 获取对象：new 类名称(); 访问：对象.成员   &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt;     &lt;meta charset="utf-8" /&gt;     &lt;title&gt;&lt;/title&gt; &l
python定义类的私有成员_python私有成员 Python如何为类元素
weixin_39983427的博客
12-09 702
Python如何为类元素(属性和方法)提供私有性的方式 ?Python如何为类元素(属性和方法)提供私有性的方式 ? 请简述各自的作用域.Python不支持私有成员。所有Python类中的成员都是公共的，可以从类外部调用或存取的。 所谓成员名前加一条或两条下划线“_func”或“__member”的方式只是一种约定俗成，提示用户这个成员函数或变量只用于内部调用，不是设计给用户使用的。python的...
JavaScript中的静态成员
weixin_30271335的博客
01-04 248
静态：共享 一、公有静态成员(作为函数的属性即可): 1 var Gadget = function(price) { 2 this.price = price; 3 } 4 Gadget.isShiny = function(){ 5 var msg = 'you bet';//公有静态 6 if(this instanceof Gadget...
Javascript 构造函数和成员函数（类的声明及定义基本）
霖林烟雨
08-19 4102
简述： 类有不同的构造函数，和成员函数 这里定义一个类，其中使用prototype声明定义该类的成员函数 知识点： 1 . javascript构造函数 2.prototype 写成员函数 代码： CONSTRUCTOR AND PROTOTYPE /*************************CONSTRUCTOR*************
JavaScript对象的类的成员变量与静态变量
lspgdut的博客
03-12 363
 &lt;script type="text/javascript"&gt;     function Person(name){       //  var y=10;         this.name=name;    //定义一个成员变量         this.y=10;    //定义一个静态变量     }      Person.prototype.alertName=func...
java面向对象——定义2个类，并进行测试
tt 博客
03-15 4710
定义一个Father和Child类，Father为外部类，类中定义一个私有的String类型的属性name；Child为Father的内部类，其中定义一个introFather（）方法，方法中调用Father类的name属性；再定义一个测试类，在类的main方法中创建Child对象，并调用introFather（）方法。 class Father{ private String name=...
TypeScript 与 JavaScript - 详细比较.docx
最新发布
12-23
TypeScript的优势不仅限于基本类型，还包括对类、枚举、类成员访问控制（私有、保护、公开）和装饰器的支持，这些高级特性的存在让JavaScript开发人员能够构建更为复杂和模块化的应用程序。 TypeScript与JavaScript...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值