资讯专栏INFORMATION COLUMN

JavaScript第九天笔记(原型)

aervon / 3466人阅读

摘要:而原型就是类型对象的一个属性。在中并没有定义函数的原始类型,所以原型可以是任何类型。原型是用于保存对象的共享属性和方法的,原型的属性和方法并不会影响函数本身的属性和放大。

原型 概述

在JavaScript中,函数是一个包含属性和方法的Function类型的对象。而原型(Prototype)就是Function类型对象的一个属性。
在函数定义时九包含了prototype属性,他的初始值是一个空对象。在JavaScript中并没有定义函数的原始类型,所以原型可以是任何类型。
原型是用于保存对象的共享属性和方法的,原型的属性和方法并不会影响函数本身的属性和放大。

获取原型

1.通过构造函数的prototype属性

function fn(){
    console.log("this is function");
}
console.log(fn.prototype);

2.通过Object对象的getgetPrototypeOf()方法

function fn(){
    console.log("this is function");
}
console.log(Object.getPrototypeOf(fn));
为原型新增属性或方法

构造函数.prototype.属性名 = 属性值
构造函数.prototype.方法名 = function(){}

构造函数.prototype = {
属性名:属性值,
方法:function(){}

}

构造函数的原型
/*定义构造函数*/
function Fun(){
    this.name = "segment";
    this.sayMe = function(){
        console.log("this is function");
    }
}
//操作构造函数Fun的原型
Fun.prototype.age = 18;
// 利用构造函数来创建对象
var fun = new Fun();
console.log(fun);
// 为构造函数的原型新增的属性 -> 构造函数创建的对象中依旧可以访问
console.log(fun.age);// 18
// 对象fun中不存在age属性
var result = Object.getOwnPropertyDescriptor(fun, "age");
console.log(result);
自有属性和原型属性

自有属性:构造函数本身的属性
原型属性:通过原型所定义的属性

function Mingzi (name){
      this .name = name;
      this .sayMe = function(){
      console .log("this is function")
      }
}
Mingzi.prototype.age = 18;
var mingzi = new Hero("石原");

console.log(mingzi.name);// 石原
console.log(mingzi.age);// 18

var mingzi2 = new Mingzi("长泽雅吗");
console.log(mingzi2.name);// 长泽雅美
console.log(mingzi2.age);// 18
Hero.prototype.age = 80;

console.log(mingzi.age);
console.log(mingzi2.age);
重写属性

通过构造函数或对象的自有属性可以重写原型的属性
自有属性与原型属性同名时,默认访问的是自有属性

// 定义构造函数
function Hero(){
    this.name = "张无忌";
}
// 构造函数的原型
Hero.prototype.name = "周芷若";
// 构造函数创建对象
var hero = new Hero();
console.log(hero.name);// 张无忌

// 删除对象的属性
delete hero.name;
// 重新访问对象的属性
console.log(hero.name);// 周芷若
检测原型的属性

Object.hasOwnProperty(prop)方法
作用 - 判断当前指定属性是否为自有属性
参数1.prop - 表示指定属性名称

2.返回值 - 布尔值
  true - 表示存在指定的自有属性
  false - 表示不存在指定的自有属性

使用in关键字检测对象的属性
作用 - 判断对象中是否存在指定属性(自有属性或原型属性)
返回值 - 布尔值

 true - 表示存在指定的属性
 false - 表示不存在指定的属性
显示原型与隐式原型

每个函数function都有一个prototype,即显式原型
每个实例对象都有一个__proto__,可称为隐式原型
对象的隐式原型的值为其对应构造函数的显式原型的值
函数的prototype属性: 在定义函数时自动添加的, 默认值是一个空Object对象
对象的__proto__属性: 创建对象时自动添加的, 默认值为构造函数的prototype属性值
我们能直接操作显式原型, 但不能直接操作隐式原型

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108280.html

相关文章

  • 26天学通前端开发(配资料)

    摘要:网上有很多前端的学习路径文章,大多是知识点罗列为主或是资料的汇总,数据量让新人望而却步。天了解一个前端框架。也可以关注微信公众号晓舟报告,发送获取资料,就能收到下载密码,网盘地址在最下方,获取教程和案例的资料。 前言 好的学习方法可以事半功倍,好的学习路径可以指明前进方向。这篇文章不仅要写学习路径,还要写学习方法,还要发资料,干货满满,准备接招。 网上有很多前端的学习路径文章,大多是知...

    blair 评论0 收藏0
  • 九天学会Java,一天,变量和数据类型,赋值和输出

    摘要:现在我们开始说编程特性第一条变量和数据类型,赋值和输出。从广为流传的说起,用建立一个新的工程在目录建一个文件变量和数据类型,赋值和输出在中,方法是应用程序的入口方法。变量包含三个知识点,新建变量是字符串类型给变量赋值。 用9天入门三门编程语言,有可能嘛,尤其是对没有基础的同学来说?对于想学好的编程的人来说,无论从哪一门语言开始入手,语言的本身其实并不是我们最应该的关心的,至少不是作为一...

    cangck_X 评论0 收藏0
  • 九天学会Java,三天,选择结构

    摘要:选择结构变量和数据类型,赋值和输出算术运算选择结构循环结构函数定义,函数调用变量作用域栈,程序运行的基石面向对象异常处理语言提供的公用包上一节介绍了的算术运算,如加减乘除等,的运算规则跟四则运算一样。 选择结构 变量和数据类型,赋值和输出 算术运算 选择结构 = 60) { System.out.println(You have passed the exam...

    Java_oldboy 评论0 收藏0
  • 九天学会Java,四天,循环结构

    摘要:变量和数据类型,赋值和输出算术运算选择结构循环结构函数定义,函数调用变量作用域栈,程序运行的基石面向对象异常处理语言提供的公用包这次我们讲的循环结构。循环结构在编程中广泛使用,所以一定要了解好循环结构是怎么用的。正确的写法,是用循环结构。 变量和数据类型,赋值和输出 算术运算 选择结构 循环结构 函数定义,函数调用 变量作用域 栈,程序运行的基石 面向对象 异常处理 语言提供的公用包...

    Youngs 评论0 收藏0
  • 九天学会Java,五天,函数定义函数调用

    摘要:那么这种封装的形式就叫做函数函数的格式修饰符返回值类型函数名参数类型形式参数,参数类型形式参数,执行语句返回值有可能有,有可能无函数的定义我们参考函数的格式定义几个函数因为我们要在中调用函数,所以函数也要定义成。 变量和数据类型,赋值和输出 算术运算 选择结构 循环结构 函数定义,函数调用 max) { max = b; } ...

    Cheriselalala 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<