一个神奇的原型链 <script> var divObj=document.getElementById("dv"); console.dir(divObj); //divObj.__proto__---->HTMLDivElement.prototype的__proto__--->HTMLElement.prototype的__proto__---->Element.prototype的__proto__---->Node.prototype的__…

大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:http://www.cnblogs.com/lvonve/ CSDN:https://blog.csdn.net/lvonve/ 在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目.现在就让我们一起进入 Web 前端学习的冒险之旅吧! 一.原型链 原型链…

原型链用于ECMAScript的继承.其思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.说人话,我们知道,一个构造函数Subtype,其原型对象有一个指向构造函数的指针,这是联系构造函数和原型的桥梁,如果我让原型对象的指针指向了另一个原型,而另一个原型原本指向其构造函数的指针也指向了另一个原型,那么,这就是一个原型链了,原型上的属性会一层一层往下传递. function SuperType(){ this.property=true; } SuperType.prototype.ge…

上面一篇文章说了js的作用域链,这一节算是对上面的延申,有一个典型的例子,首先看原来的一段代码: var name = "test"; function t() { var b = 1; if (b === 1) { var name = "test1"; } else { var name = "test2"; } console.log(name); } t(); 这段代码的结果是test1 这个肯定是没有什么问题了,但是如果把代码作如下修改…

基于javascript原型链的层层递进查找规则,以及原型对象(prototype)的共享特性,实现继承是非常简单的事情 一.把父类的实例对象赋给子类的原型对象(prototype),可以实现继承 function Person(){ this.userName = 'ghostwu'; } Person.prototype.showUserName = function(){ return this.userName; } function Teacher (){} Teacher.proto…

转载自https://www.cnblogs.com/OceanHeaven/p/4957704.html 上面一篇文章说了js的作用域链,这一节算是对上面的延申,有一个典型的例子,首先看原来的一段代码: var name = "test"; function t() { var b = 1; if (b === 1) { var name = "test1"; } else { var name = "test2"; } console.log…

写一个算法,有时候可以用简单的方法就可以写出来,但是只能针对特定的环境,如果要能够适应不同的环境,就需要对算法进行优化,在优化的过程中,你会觉得非常神奇,下面来看一个简单的四则运算的算法编写方式: 1.简单粗暴的实现:直接创建一个对象,在对象上直接挂载加减乘除方法 <script> var per = { add: function(n1, n2) { return n1 + n2; }, sbb: function(n1, n2) { return n1 - n2; }, multi: fu…

最近在系统的学习JS深层次内容,并稍微整理了一下,作为备忘和后期复习,这里分享给大家,希望对大家有所帮助.如有错误请留言指正,tks. 了解这些问题,我先一步步来看,先从稍微浅显内容说起,然后引出这些概念. 本文只用实例验证结果,并做简要说明,给大家增加些印象,因为单独一项拿出来都需要大篇幅讲解. 1.值类型 & 引用类型 function show(x) { console.log(typeof(x)); // undefined console.log(typeof(10)); // num…

---恢复内容开始--- 每个JS对象一定对应一个原型对象,并从原型对象继承属性和方法. 也就是说 对象的__proto__属性的值就是它所对应的原型对象, 而prototype 只有函数才有的属性. 1. 先创建一个对象, 经分析可知,自定义对象的__proto__属性指向Object的原型,并且自定义对象没有 prototype的属性 2 创建函数,并打印出__proto__ 和 prototype     创建函数时,设置__proto__属性指向的是 Function的原型,并自动添加p…

在Javascript不存在类(Class)的概念,javascript中不是基于类的,而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让原型对象的写法更加清晰.更像面向对象编程的语法而已. 1.构造函数的简单介绍 构造函数就是提供了一个生成对象的模…

一.在js中创建对象的方式 //一.字面量或直接量创建对象 var obj1 = { name:"zs", age:12 }; //二.通过new来创建对象 var obj2 = new Object(); obj2.name = "zs"; obj2.age = 16; //三.通过工厂函数来创建 function creatObj() { return {}; } //四.通过new 构造函数来创建 function Obj() { } //测试 var obj…

继承是面向对象的语言中,一个最为津津乐道并乐此不疲的话题之一.JAVASCRIPT中的继承,主要是依靠原型链来实现的.上一篇文章介绍过,JAVASCRIPT中,每一个对象都有一个prototype属性,这个属性指向一个原型对象(原型对象包含了所有指向它的对象共享的属性和方法,默认是Object).那么,如果我们让原型对象等于一个类型的实例,那么结果会怎么样呢?显然,此时的原型对象将包含指向另一个原型的指针:假如另一个原型又是另一个类型的实例,如此层层递进,就构成了原型链.这就是原型链的基本概念.…

1.继承 应注意区分继承和实例化,实例化是生成一个对象,这个对象具有构造函数的属性和方法:继承指的应该是利用父类生成一个新的子类构造函数,通过这个子类构造函数实例化的对象,具有子类的属性和方法,同时也具有父类的属性和方法. 2.原型链继承 2.1.实现方法 实现原型链继承的方法是通过重写子类的原型对象(比如 Student.prototype )的值为父类(比如Person) 的一个实例,由此可以实现继承(Student 继承了 Person ) . Son.prototype = new Pa…

原型链 : 实例对象与原型之间的连接,叫做原型链 –__proto__( 隐式连接 ),这就是原型链,平时我们是看不到的. 原型链的最外层 : Object.prototype function Aaa(){ //this.num = 20; } //Aaa.prototype.num = 10; Object.prototype.num = ; var a1 = new Aaa(); alert(a1.num); 所以找属性的时候,其实是一级一级找,先实例本身下,然后就是沿着原型链找到对象原型…

遇到一个面试题 要求写一个函数A,每次进行new操作时候能输出2,3,4,5... new A() // 输出2 new A() // 输出3 new A() // 输出4 function A() { this.a++ console.log(this.a) } A.prototype.a = 1 这样写是错误的,因为实例化对象中的a属性并不是原型上的引用,而是把原型上的a给拷贝了一份给a. 所以这样每次输出都是2. 正确答案: function A() { this.__proto__.a+…

一.原型继承父类的实例 //父类及其原型属性/方法 function SuperType () { this.name = ['zc','ls','ww']; } SuperType.prototype.getSuperName = function() { return this.name; }; //子类及其原型属性/方法 function SubType() { this.test = ['a','b','c','d']; } //子类型的原型指向父类型的实例(即子类的原型复制了父类的构造…

* 所有函数都有一个特别的属性: * `prototype` : 显式原型属性* 所有实例对象都有一个特别的属性: * `__proto__` : 隐式原型属性 1.  每个函数都有一个prototype属性, 它默认指向一个对象 objectg(即称为: 原型对象) * 显式原型与隐式原型的关系 * 函数的prototype: 定义函数时被自动赋值, 值默认为{}, 即用为原型对象 * 实例对象的__proto__: 在创建实例对象时被自动添加, 并赋值为构造函数的prototype值 * 原…

在刚刚接触JS原型链的时候都会接触到一个熟悉的名词:prototype:如果你曾经深入过prototype,你会接触到另一个名词:__proto__(注意:两边各有两条下划线,不是一条).以下将会围绕prototype和__proto__这两个名词解释为什么不能在原型链上使用对象以及JS原型链的深层原理. 一.为什么不能在原型链上使用对象: 先举一个非常简单的例子,我有一个类叫Humans(人类),然后我有一个对象叫Tom(一个人)和另一个对象叫Merry(另一个人),很明显Tom和Merry都…

JS中原型链,说简单也简单. 首先明确: 函数(Function)才有prototype属性,对象(除Object)拥有__proto__. 首先,我画了一张图. 所谓原型链,指的就是图中的proto这一条指针链! 原型链的顶层就是Object.prototype,而这个对象的是没有原型对象的. 可在chrome的控制台里面输入: Object.__proto__ 输出是: function Empty() {} 原型链,如此而已. 对于新人来说,JavaScript的原型是一个很让人头疼的事情…

  前  言 JRedu 上一篇博客中,我们介绍了JS中的面向对象,并详细的解释了this的指向问题.本篇博客,我们继续来学习JS的面向对象.来深入理解一下JavaScript OOP中的成员属性/方法.静态属性/方法.原型属性/方法,并且一起来探讨一下JS中的原型与原型链. 一 成员属性与成员方法 在构造函数中,通过this.属性声明.或者实例化出对象后,通过“对象.属性”追加的.都属于成员属性.或成员方法:也叫实例属性与实例方法 成员属性/方法,是属于实例化出的这个对象.通过"对象.属性&q…

  对象的原型链 只要是对象就有原型 原型也是对象 只要是对象就有原型, 并且原型也是对象, 因此只要定义了一个对象, 那么就可以找到他的原型, 如此反复, 就可以构成一个对象的序列, 这个结构就被成为原型链 原型链到哪里是一个头? 一个默认的原型链结构是什么样子的? 原型链结构对已知语法结构有什么修正? 原型链的结构 原型链继承就是利用就是修改原型链结构( 增加.删除.修改节点中的成员 ), 从而让实例对象可以使用整个原型链中的所有成员( 属性和方法 ) 使用原型链继承必须满足属性搜索原则 属…

new操作符具体干了什么呢?其实很简单,就干了三件事情. var obj = {}; obj.__proto__ = Base.prototype; Base.call(obj); 第一行,我们创建了一个空对象obj第二行,我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象第三行,我们将Base函数对象的this指针替换成obj,然后再调用Base函数,于是我们就给obj对象赋值了一个id成员变量,这个成员变量的值是”base”,关于call函数的用法. 在…

一.构造函数和原型 1.构造函数.静态成员和实例成员 在ES6之前,通常用一种称为构造函数的特殊函数来定义对象及其特征,然后用构造函数来创建对象.像其他面向对象的语言一样,将抽象后的属性和方法封装到对象内部. function Person(uname, age) { this.uname = uname; this.age = age; this.say = function() { console.log('我叫' + this.uname + ',今年' + this.age + '岁.'…

JS高级---构造函数,通过原型添加方法,原型的作用: 共享数据, 节省内存空间 构造函数 //构造函数 function Person(sex, age) { this.sex = sex; this.age = age; } 通过原型添加方法 //通过原型添加方法 Person.prototype.sayHi = function () { console.log("打招呼,您好"); }; 通过console.dir来观察和对比per和Person,可以看出: 实例对象中有个属性…

之前有说过继承,在js中没有类,所以在new的后面,放的是构造函数,在构造函数中有一个属性prototype,js的继承全靠它. 在js中对象的类型有很多,常见的就是普通对象,和函数对象,在对象中都会有一个属性叫_proto_,这个属性对应着相应的对象原型. 这里补充一下对象还有一个属性是,constructor.这个属性对应创建所有指向该原型的实例的构造函数.(换个说法,他是一个指针,指向构造函数): prototype这个属性,在构造函数创建被new出来的时候,prototype将作为原型值…

1.原型相当于Java.C++里面的父类,由封装公有属性及方法而产生,子类可以继承. 原型继承实现(函数的原型属性指向原型函数一个实例对象,函数的原型的构造函数指向函数本身) 1)eg:原型链 function Foo() { this.value = 42; } Foo.prototype = { method: function() {} }; function Bar() {} // 设置Bar的prototype属性为Foo的实例对象 Bar.prototype = new Foo();…

原生的原型链 function fn(){},fn 为 Function的一个实例,原型链为 null -> Object -> Function -> fn: fn.__proto__ === Function.prototype Function.prototype.__proto === Object.prototype Object.prototype.__proto__ === null 原型链通过原型(prototype)链接,prototype 就是一个 只有(构造)函数才…

原文链接:https://blog.csdn.net/u012468376/article/details/53127929 一.继承的概念 ​ 继承是所有的面向对象的语言最重要的特征之一.大部分的oop语言的都支持两种继承:接口继承和实现继承.比如基于类的编程语言Java,对这两种继承都支持.从接口继承抽象方法 (只有方法签名),从类中继承实例方法. ​ 但是对JavaScript来说,没有类和接口的概念(ES6之前),所以只支持实现继承,而且继承在 原型链 的基础上实现的.等了解过原型链的概…

基于尚硅谷的尚硅谷JavaScript高级教程提供笔记撰写,加入一些个人理解 github源码 博客下载 原型与原型链 prototype : 显式原型属性,它默认指向一个Object空对象(即称为: 原型对象) 原型对象中有一个属性constructor, 它指向函数对象 给原型对象添加属性(一般都是方法) 作用: 函数的所有实例对象自动拥有原型中的属性(方法) // 每个函数都有一个prototype属性, 它默认指向一个对象(即称为: 原型对象) console.log(Date.prot…

## 原型与原型链 * 所有函数都有一个特别的属性:   * `prototype` : 显式原型属性 * 所有实例对象都有一个特别的属性:   * `__proto__` : 隐式原型属性 * 显式原型与隐式原型的关系   * 函数的prototype: 定义函数时被自动赋值, 值默认为{}, 即用为原型对象   * 实例对象的__proto__: 在创建实例对象时被自动添加, 并赋值为构造函数的prototype值   * 原型对象即为当前实例对象的父对象 * 原型链   * 所有的实例对象…