JavaScript进阶(四)原型与原型链用法实例分析进阶(四)原型与原型链用法实例分析
主要介绍了JavaScript原型与原型链,结合实例形式分析了JavaScript原型与原型链基本概念、原理、用法及操作
注意事项,需要的朋友可以参考下
本文实例讲述了JavaScript原型与原型链用法。分享给大家供大家参考,具体如下:
一句话说明什么是原型:原型就是一个JavaScript对象,原型能存储我们的方法,构造函数创建出来的实例对象能够引用原型
中的方法。
一、传统构造函数的问题一、传统构造函数的问题
有如下代码
function Foo(){
this.sayHello = function(){
}
}
由于对象是调用new Foo()所创建出来的,因此每一个对象在创建的时候,函数 sayHello 都会呗创建一次
那么有没一个对象都含有一个独立的,不同的,但是功能逻辑一样的函数,比如:{} == {}。
在代码中方法就会消耗性能,最典型的资源就越是内存
这里最好的方法就是将函数放在构造函数之外,那么在构造函数中引用该函数即可
function sayHello () {}
function Foo () {
this.say = sayHello;
}
会在开发中变得困难:引入框架危险,代码繁冗不好维护。解决方法就是如果外面的函数不占用其名字,而且在函数名下。
每一个函数在定义的时候,有一个神秘对象(就是原型对象,暂且这么称呼)被创建出来。
每一个由构造函数创建的对象都会默认的连接到该神秘对象上。
var f1 = new Foo();
var f2 = new Foo();
f1.sayHello(); //如果f1没有sayHello那么就会在Foo.prototype中去找
由构造函数创建出来的众多对象共享一个对象就是:构造函数.prototype
只需要将共享的东西,重复会多占用内存的东西放到构造函数.prototype中,那么所有的对象就可以共享了。
function Foo(){}
Foo.prototype.sayHello = function(){
console.log("….");
}
var f1 = new Foo();
f1.sayHello();
var f2 = new Foo();
f2.sayHello();
console.log(f1.sayHello === f2.sayHello); // true
二、一些相关概念二、一些相关概念
类类class:在JS中就是构造函数
在传统的面向对象语言中,使用一个叫类的东西定义模板,然后使用模板创建对象。
在构造方法中也具有类似的功能,因此也称其为类
实例(实例(instance)与对象()与对象(object))
实例一般是指某一个构造函数创建出来的对象,我们称为XXXX 构造函数的实例
实例就是对象。对象是一个泛称
实例与对象是一个近义词
键值对与属性和方法键值对与属性和方法
在JS中键值对的集合称为对象