JS中类的静态方法，静态变量，实例方法，实例变量区别与用法实例分析

2024-08-02 15:24:25

本文实例讲述了JS中类的静态方法，静态变量，实例方法，实例变量区别与用法。分享给大家供大家参考，具体如下：

1.类的静态方法

先来段代码之后分析

// JS类静态函数
function BaseClass() {
}
// 类添加add函数
BaseClass.add = function() {
  console.log("BaseClass add()方法被调用");
};
// 类方法(类的静态函数)直接调用
// 类名.类方法名
BaseClass.add(); //BaseClass add()方法被调用
var instance = new BaseClass();
// 实例不能调用类方法(即类的静态方法)
//instance.add();

a.类的静态方法通过[类名.类方法名称]赋值；
b.调用时用[类名.类方法名称()]直接调用；
C.类的实例无法调用类的静态函数。
原因：因在js中function也是对象，即给函数对象添加了一个函数

2.类的静态成员

先来段代码之后分析

// JS类的静态成员变量
function BaseClass(params) {
}
// 类添加静态变量nameTest
BaseClass.nameTest = "jadeshu";
// 类的静态变量直接调用
// 类名.类变量名
console.log(BaseClass.nameTest); // jadeshu
var instance = new BaseClass();
// 实例不能调用类的静态成员变量)
console.log(instance.nameTest);  // undefined

a.类的静态变量通过[类名.类变量名称]赋值；
b.调用时用[类名.类变量名称]直接调用；
C.类的实例调用类的静态变量为undefined。
-----原因：因在js中function也是对象，即给函数对象添加了一个属性

3.实例方法(两种情况)

I.单个实例的方法

// JS的单个实例方法
function BaseClass() {
}
var instance1 = new BaseClass();
// 单个实例添加成员方法
instance1.add = function (params) {
  console.log("BaseClass类实例的add方法被调用" + params);
};
instance1.add(11222); // BaseClass类实例的add方法被调用11222
var instance2 = new BaseClass();
//instance2.add(); // Error: instance2.add is not a function

II.所有实例创建时都创建了同名的方法

// JS所有实例的共享方法
function BaseClass() {
  // 所有实例创建时都创建了同名的方法
  this.add = function (params) {
    console.log("BaseClass类实例的add方法被调用" + params);
  };
}
var instance1 = new BaseClass();
instance1.add(11); // BaseClass类实例的add方法被调用11
var instance2 = new BaseClass();
//实例1和实例2各有一个add函数的本地方法
instance2.add(22); // BaseClass类实例的add方法被调用22
console.log(instance1.add === instance2.add); // false

方法也是每个实例各存在一个，占用内存，这既没有必要，又浪费系统资源，所以不建议这样添加实例的本地方法，或者在外部定义函数，然后直接赋给一个变量即可，就可以做到所有创建的实例都引用一份代码，但这样做代码不优雅。

// JS所有实例的共享方法
function add(params){
  console.log("BaseClass类实例的add方法被调用" + params);
}
function BaseClass() {
  // 所有实例创建时都创建了同名的方法
  this.add = add;
}
var instance1 = new BaseClass();
instance1.add(11); // BaseClass类实例的add方法被调用11
var instance2 = new BaseClass();
//实例1和实例2则共用add函数的代码
instance2.add(22); // BaseClass类实例的add方法被调用22
console.log(instance1.add === instance2.add); // true

单个实例添加方法建议直接如第一种方法，如果是共享方法就加入prototype属性上[即js中采用原型]。

4.实例变量(两种情况)---即是实例的本地属性

I.单个实例的变量

// JS的单个实例成员变量
function BaseClass() {
}
var instance1 = new BaseClass();
// 单个实例添加成员变量
instance1.nameTest = "jadeshu";
console.log(instance1.nameTest); // jadeshu
var instance2 = new BaseClass();
console.log(instance2.nameTest); // instance2.nameTest is undefined

II.所有实例创建的时候都创建了同名的各自本地属性变量

// JS所有实例共享的成员变量
function BaseClass() {
  // 所有实例创建时都有的同名实例变量
  this.nameTest = "jadeshu";
}
var instance1 = new BaseClass();
instance1.nameTest = "shu"; // 改变实例1的变量nameTest的值为shu
console.log(instance1.nameTest);  // shu
var instance2 = new BaseClass();
//实例1和实例2各自都有一个nameTest
console.log(instance2.nameTest);; // jadeshu

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

javascript定义类和类的实现实例详解

本文实例讲述了javascript定义类和类的实现.分享给大家供大家参考,具体如下: 最近在几个群上经常看到有人问在一个类里的一个 function 怎么调用 this. 定义后公开的方法.现发一篇类实现的随笔. 首先说说类,在一个类里我们会有以下的几个特征: 1. 公有方法 2. 私有方法 3. 属性 4. 私有变量 5. 析构函数我们直接看一个例子: /***定义类***/ var Class = function(){ var _self = this;//把本身引用负值到一变量上 va
js静态方法与实例方法分析

js静态方法复制代码代码如下: function foo(){} // 声明类 foo.method = function(){} // 方法体使用:foo.method() js实例方法 function foo(){ // 声明类 this.method = function(){ // 方法体 } } 使用:var f = new foo(); f.method();
JavaScript中的类与实例实现方法

本文实例讲述了JavaScript中的类与实例实现方法.分享给大家供大家参考.具体如下: JavaScript 中没有父类, 子类的概念, 也没有class 和 instance 的概念, 全靠 prototype chain来实现继承. 当查找一个对象的属性时, JavaScript 会向上遍历 prototype chain, 直到找到对应的属性为止. 有几种方法, 可以使得 JavaScript 模拟出 class 和 instance 的概念. 1. 直接使用构造函数来创建对象, 在构造
浅谈js函数中的实例对象、类对象、局部变量(局部函数)

定义 function Person(national,age) { this.age = age; //实例对象,每个示例不同 Person.national = national; //类对象,所用实例公用 var bb = 0; //局部变量,外面不能访问(类似局部函数) } 调用 var p = new Person("中国", 29); document.writeln("age:" + p.age); document.writeln("obj
JavaScript面向对象之私有静态变量实例分析

本文实例分析了JavaScript面向对象之私有静态变量.分享给大家供大家参考,具体如下: 大家知道,私有实例变量的原理是根据作用域. 私有实例变量是在Javascript的function内部用var关键字实现,只在function内部有效. 仿照这个,提出私有静态变量的解决方案: <script language="javascript" type="text/javascript"> var JSClass = (function() { var
JavaScript 实现类的多种方法实例

构造方法复制代码代码如下: function coder(){ this.name = '现代魔法'; this.job = 'Web 开发者'; this.coding = function () { alert('我正在写代码'); }} var coder = new coder();alert(coder.name);coder.coding(); 工厂方法复制代码代码如下: function createCoderFactory(){ var ob
Js类的静态方法与实例方法区分及jQuery拓展的两种方法

上学时C#老师讲到对象有两类方法,静态方法(Static)和实例方法(非Static),当时不理解静态是为何意,只是强记. 后来从事了前端的工作,一直在对类(即对象,Js中严格来说没有类的定义,虽众所周知,这里还是赘述一番,以免产生歧义)的操作上,严重缺乏整体概念,最近看extetnd中再次提到拓展静态方法与实例方法,故而再次百度,才幡然领悟,其实一直有用,只是不知其专业术语呀,哈哈~ 静态方法,属于类的方法,即类可以直接调用的方法.为类所有实例化对象所共用(但不能用实例对象之间调用),所以静态
JavaScript类继承及实例化的方法

本文实例讲述了JavaScript类继承及实例化的方法.分享给大家供大家参考.具体如下: (function(){ var Class = { //扩展类 create: function(aBaseClass, aClassDefine){ var $class = function(){ for(var member in aClassDefine){ this[member] = aClassDefine[member]; } if('undefined'===typeof aClassD
JavaScript创建类/对象的几种方式概述及实例

在JS中,创建对象(Create Object)并不完全是我们时常说的创建类对象,JS中的对象强调的是一种复合类型,JS中创建对象及对对象的访问是极其灵活的. JS对象是一种复合类型,它允许你通过变量名存储和访问,换一种思路,对象是一个无序的属性集合,集合中的每一项都由名称和值组成(听起来是不是很像我们常听说的HASH表.字典.健/值对?),而其中的值类型可能是内置类型(如number,string),也可能是对象. 一.由一对大括号括起来复制代码代码如下: var emptyObj = {
JS中类的静态方法，静态变量，实例方法，实例变量区别与用法实例分析

本文实例讲述了JS中类的静态方法,静态变量,实例方法,实例变量区别与用法.分享给大家供大家参考,具体如下: 1.类的静态方法先来段代码之后分析 // JS类静态函数 function BaseClass() { } // 类添加add函数 BaseClass.add = function() { console.log("BaseClass add()方法被调用"); }; // 类方法(类的静态函数)直接调用 // 类名.类方法名 BaseClass.add(); //BaseCl
js中apply()和call()的区别与用法实例分析

本文实例讲述了js中apply()和call()的区别与用法.分享给大家供大家参考,具体如下: 每个函数都包括两个非继承而来的方法:apply()和call().两者用途都是在特定的作用域中调用函数,等于重新设置了函数体内this对象的值. 两者区别仅在于接收参数方式不同,apply()第一个参数是调用apply的函数运行的作用域,的第二个参数可以是Array的实例(数组),也可以是arguments对象,call()第一个参数是this的值没有变化,而其余参数都直接传递给函数(也就是逐个列举出
JS中for,for...in,for...of和forEach的区别和用法实例

for循环基本语法格式: for(初始化变量;条件表达式;操作表达式){ 循环体语句; } 普通for循环在Array和Object中都可以使用.for循环中可以使用return.break等来中断循环. //遍历数组 var arr = [1,2,3,4,5]; for(var i=0;i<arr.length;i++){ console.log(arr[i]); } //遍历对象 var obj={ x0:10, x1:20, x2:30 } for(va
JavaScript中callee和caller的区别与用法实例分析

本文实例讲述了JavaScript中callee和caller的区别与用法.分享给大家供大家参考,具体如下: 1.callee 在函数的内部,有两个特殊的对象:arguments和this.其中arguments是一个类似数组的对象,包含着传入函数的所有参数. 虽然arguments的主要用途是保存函数参数,但这个对象有一个属性--callee,该属性是一个指针,指向拥有这个arguments对象的函数所以callee的作用就是来指向当前对象看一个阶层函数的例子就会明白他的用途了: /* *
Spring @Valid和@Validated区别和用法实例

两者区别 @Valid @Validated 标准标准JSR-303规范增强JSR-303规范包 javax.validation org.springframework.validation 验证结果 BindingResult result BindingResult result 分组支持不支持支持分组序列不支持支持类型注解 ? 支持方法注解支持支持方法参数注解支持支持构造函数注解支持 ? 成员属性注解支持不支持嵌套验证支持不支持分组示例 pu
python中sort()和sorted()的区别及用法实例

目录一. 二. python中输入字符串转列表的注意问题总结本文主要讲sort与sorted的主要区别,以便正确使用一. sort()只能用于列表:sorted()可以用于所有可迭代对象: 比如: str_a = "blue" print(sorted(str_a)) >>>['b', 'e', 'l', 'u'] 二. sort()对列表排序是进行原处排序,并不会返回新的列表: sorted()排序后会返回一个新的列表: 比如: 对于sort()来说: li
js面向对象之静态方法和静态属性实例分析

本文实例讲述了js面向对象之静态方法和静态属性.分享给大家供大家参考.具体分析如下: 先看如下代码: 复制代码代码如下: <script type="text/javascript"> function Bird(){ this.wing = 2; this.fly = function(){ alert("我是鸟,我会飞"); } } var maque = new Bird();//创建maque对象后,我们可以使用Bird的方法和属性
python中的实例方法、静态方法、类方法、类变量和实例变量浅析

注:使用的是Python2.7. 一.实例方法实例方法就是类的实例能够使用的方法.如下: 复制代码代码如下: class Foo: def __init__(self, name): self.name = name def hi(self): print self.name if __name__ == '__main__': foo01 = Foo('letian') foo01.hi() print type(Foo) p
Ruby类实例变量、类实例方法和类变量、类方法的区别

在Ruby中类实例变量.类实例方法和类变量.类方法的区别比较微妙,而且用法也有相当的区别.本文探讨一下他们的定义和基本的使用场景,以抛砖引玉... 一.类实例变量和类变量类变量大家都很熟悉了,就是在类定义中用@@开头的变量.类变量是用于存储类的全局信息,它只属于类,不同与类实例变量(即用@开头定义的变量)每一个类的对象都有一份数据. 类变量是可以被继承的,也就是说如果我们派生一个子类,那么在子类中是可以访问父类的类变量的.子类和父类共享一份数据,对一个类的修改会反映到另一个类中.如下边