js中函数的原型
js中每一个构造函数都有一个prototype的属性,prototype指向一个原型对象,而这个对象的属性和方法都会被构造函数的实例所继承,因此,需要一些共享的属性和方法可以写在构造函数的原型中
1 用prototype属性可以向构造函数添加可继承的属性和方法,
注意constructor属性指向prototype对象所在的构造函数,方法放在prototype中,属性放在构造函数里,
实例,原型对象,构造函数,三者之间的关系:
实例有__proto__属性指向原型对象
原型对象有constructor指针指向构造函数
构造函数又有prototype属性指向原型对象
<script>
function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype = {
constructor: Person,
sayName: function(){
console.log(this.name);
}
}
var p = new Person('xxx',22);
p.sayName();//'xxx'
console.log(p.age);//
</script>
2 一个同名属性在实例和prototype对象中存在时,构造函数的实例采用构造函数里的this属性,查找优先级类似于:实例>原型对象
<script>
function Person(age){
this.age = age;//创建实例时赋给实例的属性
}
Person.prototype = {
constructor: Person,
name: 'xxx',
age: 22,
sayName: function(){
console.log(this.name);
}
}
var p = new Person(233);
console.log(p.age);//
p.age = 333;
console.log(p.age);//
</script>
3 原型的继承
<script>
function Person(){
this.age = 233;//创建实例时赋给实例的属性
}
Person.prototype = {
constructor: Person,
name: 'xxx',
age: 22,
sayName: function(){
console.log(this.name);
}
}
var p = new Person();
console.log(p.age);//
p.age = 333;
console.log(p.age);//
function Student(){ }
Student.prototype = new Person();//继承
var s = new Student();
console.log(s.name);//'xxx'
s.name = 'qqq';
console.log(s.name);//'qqq'
</script>
4 原型链的概念(修改于2019-11-13 09:41:30)
从对象的__proto__一级一级往上找
<script>
class Person{
constructor(name,age){
this.name = name;
this.age = age;
}
toPrint(){
return 'name:'+this.name+','+'age:'+this.age;
}
}
class Son extends Person{
constructor(name,age,sex){
super(name,age);
this.sex = sex;
}
toCount(){
return this.toPrint()+','+'sex:'+this.sex;
}
}
var son = new Son('z',22,'male');
console.log(son);
console.log(son.toPrint());
console.log(son.toCount());
</script>
该对象的结构图

5、对象中固有的方法(2019-11-30 补充)
以数组对象为例,.forEach,.indexOf()等为数组对象本身的方法
而数组对象的原型为Object,原型object有hasOwnProperty(查找该对象本身的属性或方法),isPrototypeOf(判断对象是否在另一个对象的原型链中),toString等方法,
数组对象可以使用原型中的方法,可以把这些方法称为继承方法
6、构造函数,实例,原型之间的关系(2019-12-02 补充)
图示:

7、实现构造函数之间的继承:
代码示例:
<script>
class Parent {
constructor(name) {
this.name = name;
}
say() {
console.log('this is Parent');
}
}
class Child extends Parent {
constructor(name, age) {
super(name); //调用父类
this.age = age;
}
speak() {
console.log('this is Child');
}
}
var c = new Child('aaa', 233);
c.say();
c.speak();
console.log(c);
</script>
class实现
图示:

8、原型链
所谓的原型链,指的是一个对象的__proto__属性,及其一级一级__proto__的指向,一般会指向最后的Object(Object.prototype__proto__ = null)
js中函数的原型的更多相关文章
- JS中函数参数和函数返回值的理解
函数本质就是功能的集合 JS中函数是对象,因此,函数名实际上仅仅是一个指向函数对象的指针,不会与某个函数绑定,所以,JS中没有重载(重载就是通过传递不同类型的参数,使两个相同函数名的函数执行不同的功能 ...
- 关于js中函数的调用问题
js中函数的调用方法 1.直接调用 函数名(参数): 2.通过指向函数的变量去调用 例如: var myval = 函数名: 此刻 myval是指向函数的一个指针: myval(实际参数):此刻调用的 ...
- js中函数传参的情况
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- JS中函数void()
<a href="javascript:void(0)">hello</a>/* * JS中函数void()的运用大体是这种新式; * void()是运算符 ...
- 对JS中函数的理解
函数本质就是功能的集合 JS中函数是对象,因此,函数名实际上仅仅是一个指向函数对象的指针,不会与某个函数绑定,所以,JS中没有重载(重载就是通过传递不同类型的参数,使两个相同函数名的函数执行不同的功能 ...
- js中函数的参数为函数的情况即回调函数
js中函数的参数可以是数组对象也可以是函数,当参数为函数时我们叫做回调函数 //定义回调函数function B() { console.log("函数B")setTimeout( ...
- js中__proto__(内部原型)和prototype(构造器原型)的关系
一.所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function) Number.__proto__ === Function.prot ...
- js中的prototype原型解析
在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...
- 关于原生js中函数的三种角色和jQuery源码解析
原生js中的函数有三种角色: 分两大种: 1.函数(最主要的角色)2.普通对象(辅助角色):函数也可以像对象一样设置属于本身的私有属性和方法,这些东西和实例或者私有变量没有关系两种角色直接没有必然的关 ...
随机推荐
- 记录一次jvm内存泄露的问题
前些天,运维告诉我刚上线的java服务占用CPU过高. 以下是发现解决问题的具体流程. 1:通过#top命令查看,我的java服务确实把CPU几乎占满了,如图 可看到18400这个进程CPU占用达到了 ...
- 【TencentOS tiny】深度源码分析(6)——互斥锁
互斥锁 互斥锁又称互斥互斥锁,是一种特殊的信号量,它和信号量不同的是,它具有互斥锁所有权.递归访问以及优先级继承等特性,在操作系统中常用于对临界资源的独占式处理.在任意时刻互斥锁的状态只有两种,开锁或 ...
- TCP三次握手、四次握手
前言 TCP用于应用程序之间的通信.当应用程序希望通过TCP与另一个应用程序通信时,它会发送一个通信请求.这个请求必须被送到一个确切的地址.在双方“握手”之后,TCP将在两个应用程序之间建立一个全双工 ...
- 云上的芯脏病:奇怪的阿里云 RDS 数据库突发 CPU 近 100% 问题
最近遇到了奇怪的阿里云 RDS 数据库突发 CPU 近 100% 问题,遇到了3次. 第一次是10月12日(周六)凌晨 3:24 负载极低的时候开始出现,早上发现后进行了主备切换,恢复了正常. 第二次 ...
- java中的静态
static静态 public static void main 类只是用来存储和被调用的,而对象是需要执行的,执行时就必定需要知道程序的入口,这个入口就是由main所在的位置. Java的类中没有m ...
- PHP array_udiff_assoc
1.函数的参数:返回数组的差集,比较时包括键值. 2.函数的参数: @params array $array @params array $array1 @params array $array2 . ...
- [NOIp2014] luogu P2312 解方程
题目描述 已知方程∑i=0naixi=0\sum_{i=0}^{n}{a_ix^i}=0i=0∑naixi=0求该方程在 [1,m][1,m][1,m] 内的整数解. Solution 有一个秦九 ...
- opencv::自定义线性滤波
卷积概念 常见算子 自定义卷积模糊 卷积概念 1.卷积是图像处理中一个操作,是kernel在图像的每个像素上的操作. 2.Kernel本质上一个固定大小的矩阵数组,其中心点称为锚点(anchor po ...
- 概念理解-IO多路复用
epoll 是 Linux 内核为处理大批量文件描述符而作了改进的 poll,是 Linux 下多路复用 IO接口 select/poll 的增强版本 在 linux 的网络编程中,很长时间都在使用 ...
- POJ 1258 Agri-Net(Prim)
题目网址:http://poj.org/problem?id=1258 题目: Agri-Net Time Limit: 1000MS Memory Limit: 10000K Total Sub ...