js的原型和原型链
总结:
1、每一个函数都有一个prototype属性,默认指向object空对象(原型对象),
每一个原型对象都有一个constructor属性,指向函数对象.
eg: Person函数: Person.prototype.constructor == Peroson
2、给原型对象添加属性作用:函数的所有对象都自动拥有原型当中的属性。 eg:
Person.prototype.name = 'Kevin';
var person1 = new Person();
var person2 = new Person();
console.log(person1.name) // Kevin
每个函数:都有一个prototype,即显式原型
每个对象:都有一个__proto__属性,即隐式原型
即:对象的隐式原型的值,相当于构造函数的显式原型的值
eg:person.__proto__ == Person.prototype
3、object的原型对象,是原型链尽头
===========================================================
1、构造函数创建对象:
function Person() {
}
var person = new Person();
person.name = 'Kevin';
console.log(person.name) // Kevin
Person 就是一个构造函数,我们使用 new 创建了一个实例对象 person
2、每个函数都有一个 prototype 属性
每个对象(null除外),自动拥有原型当中的属性
function Person() {
}
// 虽然写在注释里,但是你要注意: prototype是函数才会有的属性
Person.prototype.name = 'Kevin'; //
var person1 = new Person(); //
var person2 = new Person(); //
console.log(person1.name) // Kevin
console.log(person2.name) // Kevin

3、每个对象对象(除了 null ),都有一个属性,叫proto,这个属性会指向该对象的原型
function Person() {
}
var person = new Person();
console.log(person.__proto__ === Person.prototype); // true 对象的__proto__属性 === 构造函数的prototype

4、constructor, 每个原型都有一个 constructor 属性,指向构造函数,见图
function Person() {
}
console.log(Person === Person.prototype.constructor); // true

function Person() {
}
var person = new Person();
console.log(person.__proto__ == Person.prototype) // true
console.log(Person.prototype.constructor == Person) // true
// 顺便学习一个ES5的方法,可以获得对象的原型
console.log(Object.getPrototypeOf(person) === Person.prototype) // true
实例与原型
function Person() {
}
Person.prototype.name = 'Kevin';
var person = new Person();
person.name = 'Daisy';
console.log(person.name) // Daisy
delete person.name;
console.log(person.name) // Kevin
在这个例子中,我们给实例对象 person 添加了 name 属性,当我们打印 person.name 的时候,结果自然为 Daisy。
但是当我们删除了 person 的 name 属性时,读取 person.name,从 person 对象中找不到 name 属性就会从 person 的原型也就是 person.proto ,也就是 Person.prototype中查找,幸运的是我们找到了 name 属性,结果为 Kevin。
原型与原型
var obj = new Object();
obj.name = 'Kevin'
console.log(obj.name) // Kevin

console.log(Object.prototype.__proto__ === null) // true

JavaScript 只是在两个对象之间创建一个关联,这样可以通过继承访问另一个对象的属性和函数
js的原型和原型链的更多相关文章
- Js 原型和原型链
Js中通过原型和原型链实现了继承 Js对象属性的访问,首先会查找自身是否拥有这个属性 如果查到,则返回属性值,如果找不到,就会遍历原型链,一层一层的查找,如果找到就会返回属性值 直到遍历完Object ...
- 【repost】JS原型与原型链终极详解
一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object ,Function 是JS自带的函数对象.下面举例说明 function f ...
- JS原型与原型链终极详解
一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object ,Function 是JS自带的函数对象.下面举例说明 function f ...
- JS原型与原型链终极详解(转)
JavaScript原型及原型链详解 一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object,Function 是JS自带的函数对象. ...
- 总结一下js的原型和原型链
最近学习了js的面向对象编程,原型和原型链这块是个难点,理解的不是很透彻,这里搜集了一些这方面的资料,以备复习所用 一. 原型与构造函数 Js所有的函数都有一个prototype属性,这个属性引用了一 ...
- JS原型和原型链
1 var decimalDigits = 2, 2 tax = 5; 3 4 function add(x, y) { 5 return x + y; 6 } 7 8 function su ...
- 第20篇 js高级知识---深入原型链
前面把js作用域和词法分析都说了下,今天把原型链说下,写这个文章费了点时间,因为这个东西有点抽象,想用语言表达出来不是很容易,我想写的文章不是简单的是官方的API的copy,而是对自己的知识探索和总结 ...
- 深入JS原型与原型链
要了解原型和原型链,首先要理解普通对象和函数对象. 一.普通对象和函数对象的区别 在Javascript的世界里,全都是对象,而对象之间也是存在区别,我们首先区分一下普通对象和函数对象,如下代码: f ...
- JS 原型与原型链
图解: 一.普通对象 跟 函数对象 JavaScript 中,一切皆对象.但对象也有区别,分为 普通对象 跟 函数对象,Object 和 Function 是 JavaScript 自带的函数对象. ...
- js之原型,原型链
1.原型是什么? 在构造函数创建出来的时候,系统会默认的创建并关联一个对象,这个对象就是原型,原型对象默认是空对象 默认的原型对象中会有一个属性constructor指向该构造函数 原型 ...
随机推荐
- Rocket - tilelink - Delayer
https://mp.weixin.qq.com/s/pc8f_DOJ7w8k8BeM9gPzVw 简单介绍Delayer的实现. 1. 基本介绍 以一定的概率延迟消息的传递. 类参数 ...
- 最新 iOS 框架整体梳理(一)
前言 这段话其实是我差不多写完文章之后再回过头来写的,原本在写文章之前想写一下写的初衷的,但当我写完之后感觉初衷没有收获更真切一些.其实到这篇为止总结出来的也就三十多个,有些是比较新的框架,有些是我们 ...
- Spring Boot笔记(三) springboot 集成 Quartz 定时任务
个人博客网:https://wushaopei.github.io/ (你想要这里多有) 1. 在 pom.xml 中 添加 Quartz 所需要 的 依赖 <!--定时器 quartz- ...
- Java并发编程 (六) 线程安全策略
个人博客网:https://wushaopei.github.io/ (你想要这里多有) 一.不可变对象-1 有一种安全的发布对象,即不可变对象. 1.不可变对象需要满足的条件 ① 对象创建以后 ...
- 使用turtle库绘制渐变的圆
import turtle as t t.pensize(3) t.pencolor("blue") t.penup() t.fd(-250) t.seth(0) t.pendow ...
- Java实现 LeetCode 653 两数之和 IV - 输入 BST(递归,找差值)
653. 两数之和 IV - 输入 BST 给定一个二叉搜索树和一个目标结果,如果 BST 中存在两个元素且它们的和等于给定的目标结果,则返回 true. 案例 1: 输入: 5 / \ 3 6 / ...
- Java实现选择排序和冒泡排序
1 问题描述 给定一个可排序的n元素序列(例如,数字.字符和字符串),将它们按照非降序方式重新排列. 2 解决方案 2.1 选择排序原理简介 选择排序开始的时候,我们从第一个元素开始扫描整个列表,找到 ...
- Java实现 蓝桥杯 历届试题 蚂蚁感冒
问题描述 长100厘米的细长直杆子上有n只蚂蚁.它们的头有的朝左,有的朝右. 每只蚂蚁都只能沿着杆子向前爬,速度是1厘米/秒. 当两只蚂蚁碰面时,它们会同时掉头往相反的方向爬行. 这些蚂蚁中,有1只蚂 ...
- java实现第四届蓝桥杯剪格子
剪格子 题目描述 如图p1.jpg所示,3 x 3 的格子中填写了一些整数. 我们沿着图中的红色线剪开,得到两个部分,每个部分的数字和都是60. 本题的要求就是请你编程判定:对给定的m x n 的格子 ...
- 点击 button 自动刷新页面
问题:为什么点击 button 会刷新页面 ? 原因:你代码的写法可能如下图,把 <button> 按钮 写在 <form> </form> 标签里边啦. < ...