JavaScript基础-对象、继承、传值/址基本知识实践
2016-11-19 10:10
671 查看
1、定义类
// 函数作为类 function Animal(name){ this.name = name; this.type = "animal"; this.say=function(){ console.log("I'm a "+this.type+",my name is "+this.name); } } // 实例化Animal对象 var myDog = new Animal("liulang"); myDog.say();
javaScript是基于原型的语言,通过new实例化出来的对象,其属性和行为来自于两部分, 一部分来自于构造函数,另一部分来自于原型。 什么是原型呢?当我们声明一个类时,其实同时生成了一个对应的原型,例如我们定义了 Animal这个类时,会生成一个与Animal对应的原型,通过Animal.prototype可以指向这个原型, 原型可以通过constructor指向Animal类,更确切地说,是指向Animal类的构造函数。
// 使用原型重写Animal类 function Animal(){ } Animal.prototype = { name:"xxx", type:"animal", say:function(){ console.log("prototype log.I'm a "+this.type+",my name is "+this.name); } } // 实例化Animal对象 var myDog = new Animal("liulang"); myDog.say();
原型就是一个hash对象,因此,还有另一种写法:
Animal.prototype.name="YYY"; Animal.prototype.type="animal"; Animal.prototype.say=function(){ console.log("prototype log.I'm a "+this.type+",my name is "+this.name); }; // 实例化Animal对象 var myDog = new Animal("liulang"); myDog.say(); // 典型写法:把属性写在构造函数李,而不是放在原型里,方便从构造函数里接收参数。 function Animal(name){ this.name = name; this.type = "animal"; } Animal.prototype={ say:function(){ console.log("prototype log.I'm a "+this.type+",my name is "+this.name); } }; }
2.私有和共有
其他面向对象语言会提供private、public、protected等关键字来声明属性和行为的 可访问性是共有还是私有。但JavaScript不提供这类关键字,是通过作用域来实现的。function Animal(name){ this.name = name || "xxx"; this.type = "animal"; // 私有属性 var age = 20; // 私有方法 var move=function(){ console.log("I'm moving"); } } Animal.prototype={ say:function(){ console.log("prototype log.I'm a "+this.type+",my name is "+this.name); } };
3.继承
其他面向对象语言提供extend之类的方法用于处理类的继承,JavaScript没有, 使用继承需要用点技巧。function Bird(name){ //继承构造函数 Animal.call(this,name); } //继承原型 Bird.prototype=Animal.prototype; //新增行为 Bird.prototype.fly=function(){ console.log("I'm flying"); } var bird = new Bird("bird"); bird.say(); bird.fly(); var myDog = new Animal("liulang"); myDog.fly();
4.传值和传址
疑问:为什么上面的例子中Animal类的实例也有
fly()对象,在JavaScript中,赋值语句会用 传值和传址两种不同的方式进行赋值,如果说数字型、布尔型、字符串型,赋值就是
复制,如果是数组、hash对象等复杂数据结构会直接用内存地址赋值,而不是 将数据复制一份。prototype本质是一个hash对象,要避免这种情况,有两种方法:
1、可以用for in 来遍历prototype对象来实现传值
2、使用new function
function Bird(name){ Animal.call(this,name); } Bird.prototype = new Animal(); Bird.prototype.constructor = Bird; Bird.prototype.fly=function(){ console.log("I'm flying"); } var bird = new Bird("bird"); bird.say(); bird.fly(); var myDog = new Animal("liulang"); myDog.fly();//报错
参考来源
《编写高质量代码-Web前端开发修炼之道》相关文章推荐
- 3、JavaScript基础教程之对象的基本知识!!!
- Javascript对象的基本知识
- javascript之对象学习笔记(一)--对象基础知识
- JavaScript对象基础知识
- javascript基础知识梳理-对象转换为初始值
- javascript学习篇之对象和数组创建等基础知识代码笔记
- JavaScript基础知识----基本语法
- javascript Array对象基础知识小结
- javascript基础知识复习2-javascript的继承
- 黑马程序员_java基础笔记(09)...HTML基本知识、CSS、JavaScript、DOM
- Javascript对象的基本知识
- javascript 对象基础 继承机制实例【对象冒充】
- 黑马程序员_java基础笔记(09)...HTML基本知识、CSS、JavaScript、DOM
- 笔记 - JS易忘基础知识(二)(关于对象和继承)
- JavaScript对象基础知识
- 讲述Javascript 实现继承的方式(基础知识)
- 面向对象基础知识(5)- 封装 继承 多态
- JavaScript对象的基础知识
- JavaScript基础知识----document对象
- 面向对象基础知识(二)-类的继承