JavaScript学习笔记(二)原型
JavaScript不包含传统的类继承模型,而是使用prototype原型模型。JavaScript使用原型链的继承方式。
function Foo() {
this.value = 42;
}
Foo.prototype = {
method: function() {}
};
function Bar() {}
//设置Bar的prototype属性为Foo的实例对象
Bar.prototype = New Foo();
Bar.prototype.foo = ‘Hello World’;
//修正Bar.prototype.constructor为Bar本身 (原型构造函数)
Bar.prototype.constructor = Bar;
var test = new Bar() //创建Bar的一个实例
//原型链
test [Bar 的实例]
Bar.prototype [Foo的实例]
{foo: ’Hello World'}
Foo.prototype
{method: ...}
Object.prototype
{toString: …/* etc.*/}
上面的例子中,test对象从Bar.prototype和Foo.prototype继承下来,因此,它能访问Foo的原型方法method。同时,它也能够访问那个定义在原型上的Foo实例属性value。需要注意的是new Bar()不会创造出一个新的Foo实例,而是重复使用它原型上的那个实例;因此,所有的Bar实例都会共享相同的value属性。
以上有两点需要注意:
1、简单的使用Bar.prototype = Foo.prototype 将会导致两个对象共享相同的原型。因此,改变任意一个对象的原型都会影响到另一个对象的原型。
2、不要使用Bar.prototype = Foo,因为这不会执行Foo的原型,而是指向函数Foo。因此原型链将会回溯到Function.prototype而不是Foo.prototype,因此method将不会在Bar的原型链上。
属性查找:
当查找一个对象的属性时,JavaScript会向上遍历原型链,直到找到给定名称的属性为止。当查找到原型链的顶部-也就是Object.prototype-但是仍未找到指定的属性,就会返回undefined。
JavaScript学习笔记(二)原型的更多相关文章
- Javascript学习笔记二——操作DOM
Javascript学习笔记 DOM操作: 一.GetElementById() ID在HTML是唯一的,getElementById()可以定位唯一的一个DOM节点 二.querySelector( ...
- JavaScript学习笔记之原型对象
本文是学习<JavaScript高级程序设计>第六章的笔记. JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返 ...
- JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象
一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...
- javascript学习随笔(二)原型prototype
JavaScript三类方法: 1.类方法:2.对象方法:3.原型方法;注意三者异同 例: function People(name){ this.name=name; //对象方法 this.Int ...
- javascript学习笔记二
1.js的string对象 **创建 String对象 *** var str = "abc"; **方法 和 属性(文档) *** 属性 length : 字符串的长度 ***方 ...
- javascript学习笔记(四) Number 数字类型
数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数 toExponential() 方法 用科学 ...
- JavaScript学习笔记之数组(二)
JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...
- amazeui学习笔记二(进阶开发4)--JavaScript规范Rules
amazeui学习笔记二(进阶开发4)--JavaScript规范Rules 一.总结 1.注释规范总原则: As short as possible(如无必要,勿增注释):尽量提高代码本身的清晰性. ...
- Javascript学习笔记三——操作DOM(二)
Javascript学习笔记 在我的上一个博客讲了对于DOM的基本操作内容,这篇继续巩固一下对于DOM的更新,插入和删除的操作. 对于HTML解析的DOM树来说,我们肯定会时不时对其进行一些更改,在原 ...
- AJax 学习笔记二(onreadystatechange的作用)
AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...
随机推荐
- bootstrap 之 列表组件使用
列表是几乎所有网站都会用到的一个组件,正好bootstrap也给我们提供了这个组件的样式,下面我给大家简单介绍一下bootstrap中的列表组件的用法! 首先,重提一下引用bootstrap的核心文件 ...
- CSS 垂直居中5种方法
利用 CSS 来实现对象的垂直居中有许多不同的方法,比较难的是选择那个正确的方法.我下面说明一下我看到的好的方法和怎么来创建一个好的居中网站. 使用 CSS 实现垂直居中并不容易.有些方法在一些浏览器 ...
- R - 一只小蜜蜂...(第二季水)
Description 有一只经过训练的蜜蜂只能爬向右侧相邻的蜂房,不能反向爬行.请编程计算蜜蜂从蜂房a爬到蜂房b的可能路线数. 其中,蜂房的结构如下所示. ...
- Activity之间的跳转
/* * 触发按钮bt1跳转到另一个Activity */ bt1.setOnClickListener(new OnClickListener() { @Override public void o ...
- c++对文件操作的支持(一)
#include <stdio.h> #include <iostream> #include <fstream> using namespace std; voi ...
- VS2010中手动重命名项目
在visual studio 中重命名项目名称的方法: 1. 重命名项目名称 2. 修改Assembly name 3. 修改Default namespace 4. 在Assembly Inform ...
- Python成长之路_装饰器
一.初入装饰器 1.首先呢我们有这么一段代码,这段代码假设是N个业务部门的函数 def f1(aaa): print('我是F1业务') if aaa == 'f1': return 'ok' def ...
- 如何实现button像a标签一样跳转页面
这个实现起来很简单,如下: <a href="{% url 'cms:add' %}"> <button class="btn btn-default& ...
- windows内存管理方式以及优缺点
Windows内存管理方式:页式管理,段式管理,段页式管理 页式管理 将各进程的虚拟空间(逻辑地址)划分为若干个长度相等的页,业内管理把内存空间(物理内存)按照页的大小划分为片或者页面,从而实现了离散 ...
- Ring3 和Ring0 解释
这得从CPU指令系统(用于控制CPU完成各种功能的命令)的特权级别说起.在CPU的所有指令中,有一些指令是非常危险的,如果错用,将导致整个系统崩溃.比如:清内存.设置时钟等.如果所有的程序都能使用这些 ...