04JS第八天 ----- js高级第二天 --- 原型对象(关键)

1、原型对象

1、没有原型对象的情况

在实例化得到一个对象的时候,会为这个对象分配一个原型对象。

代码:一个构造函数,实例化得到三个对象.

在内存中,会分别为每个对象开辟新的空间。发现每个对象中的say和cook都一样,这样的话,会占用大量的内存。解决办法就是使用原型对象。

2、原型对象

在实例化得到对象的时候,系统会为构造器创建一个对象该对象会保存构造器的每个实例对象的相同内容这个对象就是原型对象

原型对象不能单独存在,肯定要和构造函数产生关系才行。原型对象和构造函数的关系如下:

3、使用构造函数和原型对象共同来定义“类”

有了原型对象,再定义构造函数的时候,就可以将每个对象独有的内容放到构造函数中,将每个对象相同的内容都放到原型对象上,具体看下面的代码:

这样做的目的是既能区分开每个实例对象又能节省内存

4、原型对象、实例对象、构造函数的关系

测试:

constructor:真实作用是找对象(实例对象、原型对象)的构造函数的

2、原型链

找一个对象的成员时:

优先从对象自身查找;

然后从对象的构造函数中查找

然后从构造函数的原型对象上查找

然后从原型对象的构造函数中查找

….

这种查找的方式就是原型链

一个问题:这样一直向上查找,最顶层是什么呢?

最顶层是内置的Object对象。Object是所有对象的默认的原型对象。

3、应用--扩展内置对象

比如在使用内置的String对象的时候:

var s = new String('hello world');

s.length;

s.substr(1,3);

s.indexOf('h');

实例化String之后,就可以调用String对象中的各个方法了。

下面模拟内置的String构造函数的写法:

4、应用--为DOM对象添加方法

为所有的dom对象添加一个css方法,因为所有对象的最顶层的原型是Object,所以在Object的原型对象中添加一个css方法即可。

有因为this表示调用css的每个对象,如果css方法中返回this将会形成链式的调用方式。

 

发布了386 篇原创文章 · 获赞 17 · 访问量 2万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 像素格子 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览