深入学习js的面向对象
在之前的一篇文章的末尾我提到了JavaScript的对象创建方法,可以利用函数,内置对象和this等关键词实现对象的创建。但是很遗憾,我最先接触的面向对象的编程语言是java,因而对于这些实现面向对象的方法并非自己的首选。下面是那篇文章:
记一次两小时的js编程学习
我们必须明白面向对象的具体含义,尤其对于JavaScript中来说,因为很明显它与其他语言中存在着较大的差别。JavaScript 提供多个内建对象,比如 String、Date、Array 等等。
对象只是带有属性和方法的特殊数据类型。JavaScript中对象被当做了特殊数据结构struct,而一般的语言被当做类的实例化。
- 布尔型可以是一个对象。
- 数字型可以是一个对象。
- 字符串也可以是一个对象
- 日期是一个对象
- 数学和正则表达式也是对象
- 数组是一个对象
- 甚至函数也可以是对象
一般的语言,都是利用类来创建对象,完成面向对象的过程。举个最熟悉的java语言的例子:
Scanner input=new Scanner(System.in); int num=input.function(); String num=input.var;
而JavaScript却不同,这是由于JavaScript的设计本质上是一种面向过程的语言。虽然JavaScript如今早已演变成一种面向对象的语言,却也不使用类来创建对象。
直到2015年6月的ES6,OOP被标准化。举个例子:
function Car(Color,Year,Make,Miles){ this.color=Color; this.year=Year; this.make=Make; this.odometerReading=Miles; this.setOdometer=function(newMiles){ this.odometerReading=newMiles; } }
这里有一个很严肃的问题,即类的扩展,在js中来说就是对象属性和方法的扩展。java中有继承extends来实现对父类的继承。但JavaScript中却根本没有类的概念,就只能另寻它法完成扩展和继承。
在JavaScript中,当一个对象已经被实例化,如果我想想让它拥有新的方法和属性就需要借用关键字prototype。举个例子:
function Car(color){ this.color=color } var car=new Car("red") console.log(car.color) // car.length=5 // car.setColor("green") Car.prototype.length=5 Car.prototype.setColor=function(newColor){ this.color=newColor } console.log(car.length) car.setColor("green") console.log(car.color) ----------------------------------------------------- red 5 green [Done] exited with code=0 in 0.206 seconds
我们需要给car加上长度和设置新的颜色,需要利用没有实例化之前的Car,再借用关键词prototype才可以完成添加属性和新方法的操作。
除了扩展,我们还需要继承,JavaScript依旧使用prototype关键词完成继承的操作。
function Pet(){ this.animal="pet" this.name="ahhh" } function Cat(){ this.age=2 } //接下来就是让Cat这个类拥有Pet类的属性和方法的操作 Cat.prototype=new Pet() //给Cat类加上Pet类的全部属性和方法
为什么说上面的Cat和Pet是类,如同java,我们默认类的首字母大写。JavaScript使用函数面向对象的好处在于可以在函数中添加众多的变量和函数。内置的Object()过于简单。
推荐阅读:
记一次两小时的js编程学习
个人博客十八
欢迎大家交流博客,我擅长串改大佬们写的源码哟!