`
linvar
  • 浏览: 255323 次
  • 性别: Icon_minigender_1
  • 来自: 未定
社区版块
存档分类
最新评论

javascript 的面向对象编程

阅读更多
现在要想掌握好javascript,必须搞懂,搞清楚javascript的对象,函数(function)的概念
其中函数又是比较特殊的对象.javascript很强大,很灵活.但必须深刻理解它.

1.javascript对象是字典
与其他高级语言(如java)不同,javascript将对象看成是包含"字符串关键字"的字典,
我们可以使用"."或"[]"来设置和获取对象的属性:
var person = {}; //或var person = new Object();
person.age = 12;
person['name'] = 'lulu';
alert(person.name); //print lulu

也可以在var person = {};中定义
var person = {
    age: 12,
    time: new Date(),
    name: 'lulu'
}

2.javascript的函数
对象一般都有属性跟方法,要理解方法必须先理解javascript的函数
在javascript中,函数跟对象差别比较小,函数实际上是具有与它关联的可执行代码的对象.
普通定义函数的方式:
function func(x){
    alert("hello " + x);
}
也可以构建匿名函数赋给变量
var func = function(x){
    alert("hello " + x);
}
甚至可以这样(但很少用)
var func = new Function("x", "alert(x);“);

就像对象一样,你可以对函数增加属性
func.name = 'lulu';
func['age'] = 41;

作为对象,函数还可以赋给变量、作为参数传递给其他函数、作为其他函数的值返回,
并可以作为对象的属性或数组的元素进行存储等等

javascript对象与函数中的this
var gObj = {
    "name": "touo",
     get: function(){
         return this.name; //这里的this是指gObj对象
     }
}
function say(){
    alert(this.greet); //这里的this根据调用者而变.见nObj
}
var nObj = {
    "greet": "hello,hi",
    sayIt: say    //这时函数say里面的this就是指nObj对象了.
}
var bObj = {
    "greet": "hehe"
    //这里没有调用say方法,而是用下面的方法调用
}
每个函数都有一个call方法
say.call(bObj); //print hehe
//作为函数第一个参数传递给 call 的任何对象都将在函数调用中成为“this”的值

3.使用javascript函数类似构造函数初始化对象本地变量
function Dog(name){
    this.name = name;
    this.resp = function(name){
         if(this.name == name){
             alert("woof");
         }
    }
}
当我们使用new时会初始化name这个变量
var d1 = new Dog('oo');
var d2 = new Dog('tt');
d1,d2的name变量值不同,这是我们想要的,
但是他们有相同的resp方法副本,这是重复的,可以将resp方法在全局定义
但是如果方法很多就将是个维护灾难.
所以可以使用将讲到的原型方法

4.原型
在使用 JavaScript 的面向对象编程中,原型对象是个核心概念。在 JavaScript 中对象是作为现有示例(即原型)对象的副本而创建的,该名称就来自于这一概念。此原型对象的任何属性和方法都将显示为从原型的构造函数创建的对象的属性和方法。可以说,这些对象从其原型继承了属性和方法。
在 JavaScript 中,每个函数都有名为“prototype”的属性,用于引用原型对象。此原型对象又有名为“constructor”的属性,它反过来引用函数本身。这是一种循环引用
JavaScript 中的 Object.prototype 是所有原型的最终基础原型。(Object.prototype 的原型是 null)
在此示例中,请记住 Dog.prototype 是对象。它是通过调用 Object 构造函数创建的(尽管它不可见):

Dog.prototype = new Object();

因此,正如 Dog 实例继承 Dog.prototype 一样,Dog.prototype 继承 Object.prototype。这使得所有 Dog 实例也继承了 Object.prototype 的方法和属性。

所以当我们定义原型对象的resp方法后,所有的Dog的对象都具有resp这个方法
Dog.prototype.resp = function(name){
    if(this.name == name){
        alert("woof"); //这里this指Dog对象,根据对象的不同而变
    }
}

5.闭包

函数中使用var定义的变量不能直接通过"."号访问, 它的作用域是函数体内.
function makeGreaterThanPredicate(lowerBound) {
    return function(numberToCheck) {
        return (numberToCheck > lowerBound) ? true : false;
    };
}
通过观察函数 makeGreaterThanPredicate 返回的内部匿名函数,可以发现,该匿名内部函数使用 lowerBound,后者是传递给 makeGreaterThanPredicate 的参数。按照作用域的一般规则,当 makeGreaterThanPredicate 退出时,lowerBound 超出了作用域!但在这里,内部匿名函数仍然携带 lowerBound,甚至在 makeGreaterThanPredicate 退出之后的很长时间内仍然如此。这就是我们所说的闭包:因为内部函数关闭了定义它的环境(即外部函数的参数和本地变量)

6.模拟命名空间
如果要创建一个 JavaScript 库,则可以将它们包装在命名空间内,而不需要定义全局函数和类
var MSDNMagNS = {};

MSDNMagNS.Pet = function(name) { // code here };
MSDNMagNS.Pet.prototype.toString = function() { // code };

var pet = new MSDNMagNS.Pet(“Yammer”);

命名空间的一个级别可能不是唯一的,因此可以创建嵌套的命名空间:

var MSDNMagNS = {};
// nested namespace “Examples”
MSDNMagNS.Examples = {};

MSDNMagNS.Examples.Pet = function(name) { // code };

为命名空间指定更短的别名:
var Eg = MSDNMagNS.Examples;
var pet = new Eg.Pet(“Yammer”);

以上内容参考http://msdn.microsoft.com/zh-cn/magazine/cc163419.aspx
分享到:
评论

相关推荐

    JavaScript面向对象编程指南.pdf

    JavaScript作为一门浏览器语言的核心思想;面向对象编程的基础知识及其在... 《JavaScript面向对象编程指南》着重介绍JavaScript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库

    JavaScript面向对象编程指南

    《Javascript面向对象编程指南》着重介绍Javascript在面向对象方面的特性,展示如何构建强健的、可维护的、功能强大的应用程序及程序库。 全书包括8章和3个附录,依次介绍了Javascript的发展历史...

    JavaScript面向对象编程指南(第2版)

    资源名称:JavaScript面向对象编程指南(第2版)内容简介:1.本书是唯一一本介绍Javascript面向对象编程的图书。2.本书作者是知名的Web开发人员和作者。受到国内众多前端开发人员,如淘宝UED团队的推崇和推荐...

    JavaScript面向对象编程指南完整版

    JavaScript面向对象编程指南是完整的扫描版...

    JavaScript面向对象程序设计

    JavaScript面向对象程序设计(1): 前言 JavaScript面向对象程序设计(2): 数组 JavaScript面向对象程序设计(3): 对象 JavaScript面向对象程序设计(4): 函数 JavaScript面向对象程序设计(5): 类 JavaScript面向对象程序...

    javascript面向对象编程指南 2nd

    javascript面向对象编程指南 2nd英文版,英文名:Object-Oriented JavaScript。 What you will learn from this book The basics of object-oriented programming, and how to apply it in the JavaScript ...

    Javascript面向对象编程.

    NULL 博文链接:https://goyourauntie.iteye.com/blog/1179204

    javascript面向对象编程

    资源名称:Javascript面向对象编程   内容简介: 从语言的视角来看,面向对象的程序设计和面向对象的Javascript 语言绝对不是什么摩登的  东西;Javascript 最开始就是被设计成一...

    JavaScript面向对象编程指南 pdf

    JavaScript面向对象编程指南 pdf,学习JavaScript实用,难得。

    JavaScript面向对象编程.pdf

    JavaScript面向对象编程.pdf

    JavaScript面向对象编程指南 完整版

    JavaScript面向对象编程指南完整版是扫描的....

Global site tag (gtag.js) - Google Analytics