再论面向对象的Javascript编程

       确实没有想到,第一次写一篇文章居然会上CSDN的头条,可能最主要的还是来自于hax那篇比较深刻的评论吧。我非常欣赏hax的才气,所以对于他的评论全盘照收,至于有些网友不是很满意他评论的风格,这个因人而异,我个人也就不做太多的评论.

 


再论面向对象的 Javascript 编程

——对于原文《面向。。。》的补充       

作者:蓝翼

联系方式: liuruhong@263.net

关键字:Javascript OOP 面向对象 Jscript 原型 prototype

提要:

       在原先《面向对象的JavaScript编程》中,笔者提出了通过Javascript(确切意义上面来说是MicrosoftJscript)来实现OOP的思想,原文中因为笔者知识的局限,存在一些没有理清楚的思路,感谢一些网友提供的评论,结合这段时间的实际工作,笔者修正了原文中的一些想法.

 

       因为个人知识水平有限的原因,以下所提到的JavaScript仅仅止于Microsoft Jscript,至于和NetScape之间的一些不同,也仅止于笔者所知道的范围。在原文中笔者提出了面向对象的JavaScript的概念,不是希望在卖弄Script的技巧,只是觉得在开发的过程中或多或少的会用到,因此从个人的角度提出一些相对可行性的建议。

 

       原文对于Javascript提出了实现,封装,继承,重载,事件等等各个概念,因为个人理解的偏差,原文中有许多地方不甚贴切之处,因此本文只是对于原文的一些个人看法的一些修正。

 

       JavascriptOOP的角度来说,应该不是一门纯OOP的语言,更加准确来说,是一门Object-Based的脚本语言,因此原文提到的所谓类的概念,只是从传统OOP语言的角度去描述的,而所谓的类实现,应该是一种原型实现方式,因为在整个实现的过程中prototype是一个最重要的体现。

 

       理论上来说,所有的function都是object,因此类的创建可以完全基于Object来实现的,原文采用function只是为了更好的实现一些功能,以下就实现,封装,继承,重载,事件这5个概念作一些具体的阐述。

      

1.   实现。

Javascriptfunction是一等公民(hax原语),因此采用function来实现是最好的方式,至于采用如下两段代码来实现这个就是根据个人编程的习惯来决定,而一些实现的偏差我会在下文详细的描述。

 

阅读终点,创作起航,您可以撰写心得或摘录文章要点写篇博文。去创作
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论
JavaScript是一种面向对象编程语言,它支持封装、继承和多态等面向对象的特性。下面我将为你详细解释JavaScript面向对象编程的概念和实现。 ## 面向对象编程的三大特征 ### 封装 封装是面向对象编程的重要特征之一,它指的是将数据和行为封装在一个对象内部。对象通过暴露接口来与外界交互,外界无法直接访问对象的内部实现细节。 JavaScript中可以通过闭包和IIFE等方式实现封装。例如: ```javascript function createPerson(name, age) { // 使用闭包封装私有变量 let _name = name; let _age = age; return { getName() { return _name; }, getAge() { return _age; }, setName(name) { _name = name; }, setAge(age) { _age = age; } }; } ``` 上述代码使用闭包将`name`和`age`封装在函数内部,返回一个包含访问和修改这些属性的方法的对象。 ### 继承 继承是面向对象编程的另一个重要特征,它指的是一个对象可以从另一个对象继承属性和方法。这样可以避免重复编写代码,提高代码的复用性。 JavaScript中可以通过原型链实现继承。例如: ```javascript function Animal(name) { this.name = name; } Animal.prototype.eat = function() { console.log(`${this.name} is eating.`); }; function Dog(name) { Animal.call(this, name); } Dog.prototype = Object.create(Animal.prototype); Dog.prototype.constructor = Dog; Dog.prototype.bark = function() { console.log(`${this.name} is barking.`); }; const dog = new Dog('Tom'); dog.eat(); // Tom is eating. dog.bark(); // Tom is barking. ``` 上述代码定义了一个`Animal`类和一个`Dog`类,`Dog`类通过原型链继承`Animal`类的属性和方法,并且在自己的原型上添加了一个`bark`方法。 ### 多态 多态是面向对象编程的第三个特征,它指的是同一个方法可以根据不同的参数表现出不同的行为。这样可以提高代码的灵活性和可扩展性。 JavaScript中可以通过函数重载和`instanceof`等方式实现多态。例如: ```javascript function add(x, y) { return x + y; } function add(x, y, z) { return x + y + z; } console.log(add(1, 2)); // 3 console.log(add(1, 2, 3)); // 6 ``` 上述代码通过函数重载实现了一个可以计算两个数或者三个数之和的`add`函数。 ## 面向对象编程的实现 JavaScript中的面向对象编程可以通过构造函数、原型链和ES6的class语法等方式实现。下面我将为你介绍这些实现方式。 ### 构造函数 构造函数是一种用于创建对象的特殊函数,它可以在对象创建时初始化对象的属性和方法。使用`new`关键字调用构造函数可以创建一个新的对象,并且将`this`指向这个对象。 例如: ```javascript function Person(name, age) { this.name = name; this.age = age; this.sayHello = function() { console.log(`Hello, my name is ${this.name}, I am ${this.age} years old.`); }; } const person = new Person('Tom', 18); person.sayHello(); // Hello, my name is Tom, I am 18 years old. ``` 上述代码定义了一个`Person`构造函数,通过`new`关键字调用构造函数可以创建一个新的`Person`对象,并且调用`sayHello`方法输出对象的属性。 ### 原型链 原型链是JavaScript中实现继承的一种方式,每个对象都有一个原型对象,该对象包含了对象的属性和方法。通过将子类的原型对象指向父类的实例,可以实现继承。 例如: ```javascript function Animal(name) { this.name = name; } Animal.prototype.eat = function() { console.log(`${this.name} is eating.`); }; function Dog(name) { Animal.call(this, name); } Dog.prototype = Object.create(Animal.prototype); Dog.prototype.constructor = Dog; Dog.prototype.bark = function() { console.log(`${this.name} is barking.`); }; const dog = new Dog('Tom'); dog.eat(); // Tom is eating. dog.bark(); // Tom is barking. ``` 上述代码定义了一个`Animal`类和一个`Dog`类,`Dog`类通过原型链继承`Animal`类的属性和方法,并且在自己的原型上添加了一个`bark`方法。 ### class语法 ES6中引入了class语法,可以更加简洁和直观地实现面向对象编程。使用class关键字定义一个类,通过constructor方法初始化对象的属性和方法,使用extends关键字实现继承。 例如: ```javascript class Animal { constructor(name) { this.name = name; } eat() { console.log(`${this.name} is eating.`); } } class Dog extends Animal { constructor(name) { super(name); } bark() { console.log(`${this.name} is barking.`); } } const dog = new Dog('Tom'); dog.eat(); // Tom is eating. dog.bark(); // Tom is barking. ``` 上述代码使用class语法定义了一个`Animal`类和一个`Dog`类,`Dog`类通过继承`Animal`类的方式获取父类的属性和方法,并且在自己的类中添加了一个`bark`方法。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

liuruhong

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值