很久之前就在用JavaScript了，只是用的比较表层，会写几个函数而已，也没有深入的研究过。最近一段时间，由于项目的需要，看了一些关于JavaScript的书，也写了不少的JavaScript的代码，慢慢开始对这个东东着迷了。现在JavaScript在Web应用中的比重越来越大，各种好用的库也层出不穷，即使对JavaScript了解的比较浅显，也可以利用各种利器做出很不错的作品。但是，较为深入的了解一下JavaScript的特性，对于更熟练的使用它肯定还是有很大的帮助的。
JavaScript是一种基于原型（prototype-based）的语言，而Java是基于类（class-based）的语言。对于我这种先学习Java再学习JavaScript的人来说，总是会不自觉的用一些Java的概念去往JavaScript上套用。比如说，我就很想在JavaScript中使用类似Java中super.someMethod()。但是很多JavaScript的资料上最常见的写法是：
someObject.prototype.someMethod = function(){…};
这样就是完全改写了父类的方法，是无法满足需求的。
借助JavaScript中的apply或者call，就可以实现在子类中调用父类方法。
假设如下场景：根据不同的数据对生成的图形进行不同形式的填充。父类负责生成基本的图形，子类根据需求对父类生成的图像进行填充。
代码如下：
<html>
<head>
<meta content="text/html; charset=UTF-8"/>
<script type="text/javascript">
Shape = function() {
this.id = null;
this.picture = null;
this.draw = function(canvas){
this.picture = "由父类产生的图像已经生成在画布上了";
};
};
CommonShape = function(){};
CommonShape.prototype = new Shape();
CrossFillShape = function(){
this.draw = function(canvas){
CrossFillShape.prototype.draw.apply(this, arguments);
this.picture = this.picture + ", 然后被子类 CrossFillShape 填充";
};
};
CrossFillShape.prototype = new Shape();
SolidFillShape = function(){
this.draw = function(canvas){
SolidFillShape.prototype.draw.apply(this, arguments);
this.picture = this.picture + ", 然后被子类 SolidFillShape 填充";
};
};
SolidFillShape.prototype = new Shape();
function test1() {
var s = new CommonShape();
s.draw();
console.debug(s.picture);
var cs = new CrossFillShape();
cs.draw();
console.debug(cs.picture);
var ss = new SolidFillShape();
ss.draw();
console.debug(ss.picture);
}
</script>
</head>
<body>
<input type="button" value="test1" onclick="test1()"/><br/>
</body>
</html>
（上面代码中的console对象是Firefox的Firebug插件提供的，在这里为Firebug插件做个广告，那是相当的好用啊！）
这里通过apply来调用父类方法。
JavaScript中的apply和call
在JavaScript中，一个对象方法代码中的this并不是一直指向这个对象，通过apply或者call就可以方便的切换this指向的方法。或者说，apply和call方法的最直接的作用就是切换this的指向，并由此可以引发很多非常灵活的用法（可以看看prototype库的代码，有很多apply和call）。apply和call的区别在于调用时参数传入的方式不同:第一个参数都是对象指针（也就是说把原来代码中的this指向哪个对象），apply的第二个参数是数组，call从第二个参数开始是实际的函数调用参数
可以用下面的式子表达：
foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments) == this.foo(arg1, arg2, arg3)
分享到：
相关推荐
在JavaScript中，面向对象编程（OOP）与传统的面向对象语言如Java或C++有所不同，因为JavaScript并没有直接提供子类访问父类方法的语法。然而，开发者可以通过一些技巧来实现这个功能，使得子对象能够调用父对象的...
本文将详细介绍如何在iframe中实现子窗口与父窗口间的JavaScript方法调用以及在操作过程中需要注意的事项。 首先，了解基本的iframe标签结构对于掌握子父窗口间的JS调用非常重要。一个简单的iframe标签可能如下所示...
2. ES5中子类必须通过`call`或`apply`调用父类构造函数，而在ES6中，通过`super`自动处理这一过程。 3. ES6的`super`关键字还可以用于在子类方法中调用父类的方法，这是ES5中没有的特性。 4. 在ES6中，如果子类构造...
3. **重写和调用父类方法：** 子类可以重写父类的方法，但在子类中调用父类同名方法时，需要使用`super`关键字，如`super.someMethod()`。 4. **静态方法和属性：** 类可以有静态方法和属性，它们不属于类的实例...
17. 在继承中子类构造方法特性中，子类构造方法可以调用父类的构造方法，且 super 语句必须是子类构造方法中的第一个可执行语句。 18. BorderLayout 是把窗口分成东、南、西、北、中五个明显区域的布局管理器。 19...
// 在子类构造函数内部使用call方法调用父类构造函数 Animal.call(this, name); this.name = name || 'Tom'; } // 测试代码 var cat = new Cat('Tom'); console.log(cat.name); // 输出 "Tom" console.log(cat....
以上就是在JavaScript中获取兄弟节点和父节点的方法。需要注意的是，当进行节点操作时，节点的实际类型和它们在DOM树中的结构都可能影响最终的结果，所以理解节点类型和DOM树结构对于准确地获取所需的节点至关重要。...
- **super关键字的用法**：super关键字可以用于调用父类的构造方法、普通方法；super与this不能同时存在于同一个构造方法中。 - **正确答案**：ABC ### 17. Visual FoxPro - **Visual FoxPro定位**：Visual FoxPro...