javaScript+html——js原型、原型链、原型链属性、显式原型和隐式原型

最新推荐文章于 2022-11-21 20:37:03 发布
最新推荐文章于 2022-11-21 20:37:03 发布
阅读量320 收藏
点赞数

一、原型：

<head>
    <meta charset="UTF-8">
    <title>原型</title>
    <script type="text/javascript">
        function Fun() {};
        // console.log(Fun.prototype);//object对象
        // console.log(Fun.prototype.constructor);//原型对象
        // console.log(Date.prototype);//输出date对象
        // console.log(Date.prototype.constructor);//输出date的原型对象
        // console.log(Date.prototype.constructor === Date);//输出true
        Fun.prototype.test = function () {//只有创建对象才能调用方法
            console.log("test()");
        }
        var fun = new Fun();//new一个对象
        // fun.test();/*就是调用test方法*/
        console.log(typeof Date.prototype);//类型为object
    </script>
</head>
<body>
</body>
</html>

二、原型链：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>原型链</title>
    <script type="text/javascript">
        function Fn() {
            this.test1 = function () {
                console.log("test1()");
            }
        }
        console.log(Fn.prototype);

        Fn.prototype.test2 = function () {
            console.log("test2()");
        }
        
        var fn = new Fn();
        fn.test1();
        fn.test2();
        console.log(fn.test3);//未定义的属性，返回undefined
    </script>
</head>
<body>
</body>
</html>

三、原型链属性：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>原型链属性</title>
    <script type="text/javascript">
        function Fn() {};
        Fn.prototype.a = "xxx";
        var fn1 = new Fn();
        // console.log(fn1.a);

        var fn2 = new Fn();
        fn2.a = "yyy";
        // console.log(fn2.a);
        // console.log(fn1.a);

        function Person(name,age) {
            this.name = name;
            this.age = age;
        }
        Person.prototype.setName = function (name) {
            this.name = name;
        }
        /*赋值的关系*/
        var p1 = new Person("李四",21);
        p1.setName("王五");
        console.log(p1.name+","+p1.age);
    </script>
</head>
<body>
</body>
</html>

四、显式原型和隐式原型：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>显式原型和隐式原型</title>
    <script type="text/javascript">
        /*定义一个构造函数*/
        function Fn() {};
        /*每一个函数都有一个prototype，即显示原型属性，默认指向object对象*/
        // console.log(Fn.prototype);

        var fn = new Fn();//内部执行的语句this.__proto__ = Fn.prototype;
        console.log(fn.__proto__);//fn.__proto__为隐式原型，输出为object对象
        console.log(fn.__proto__===Fn.prototype);
    </script>
</head>
<body>
</body>
</html>


十二Tel
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
javascript原型和原型链
01-08
2、所有的引用类型（数组、对象、函数）都有一个__proto__属性(隐式原型属性），属性值是一个普通的对象 console.log(array.__proto__); console.log(object.__proto__) console.log(func.__proto__) 3、所有的函数...
06-原型链.html
m0_59556655的博客
09-14 61
原型链
html设置原型链,JavaScript进阶学习（二）—— 基于原型链继承的js工具库的实现方法...
weixin_35101697的博客
06-16 152
文章来源：小青年原创发布时间：2016-07-03关键词：JavaScript，原型链，jQuery类库前言写这篇文章的目的很简单，就是想把之前一些不太清晰的概念梳理一下，网上这类教程很多，但是本文尽可能还原问题本质，注意知识点之间的联系。相信看过我前面的博客的朋友一定知道我写文章的风格了，尽可能详尽，而且不是只是为了解决某一个小问题而写，方便大家知识点更体系，一篇内容其实相当于一章节的内容，容量...
html设置原型链,最详尽的JS原型与原型链终极详解
weixin_39769984的博客
06-16 195
一. 普通对象与函数对象JavaScript 中，万物皆对象！但对象也是有区别的。分为普通对象和函数对象，Object 、Function 是 JS 自带的函数对象。下面举例说明var o1 = {};var o2 =new Object();var o3 = new f1();​function f1(){};var f2 = function(){};var f3 = new Function...
html设置原型链,javascript什么是原型链？
weixin_31648507的博客
06-16 152
JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象，对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型，并从中继承方法和属性，一层一层、以此类推。这种关系常被称为原型链 (prototype chain)。1、javascript原型JS中每个函数都存在有一个原型对象属性prototype。并且所有函数...
JS中的原型和原型链（图解）
热门推荐
qq_36996271的博客
09-09 5万+
JS中的原型和原型链 讲原型的时候，我们应该先要记住以下几个要点，这几个要点是理解原型的关键： 1、所有的引用类型（数组、函数、对象）可以自由扩展属性（除null以外）。 2、所有的引用类型都有一个’_ _ proto_ _’属性(也叫隐式原型，它是一个普通的对象)。 3、所有的函数都有一个’prototype’属性(这也叫显式原型，它也是一个普通的对象)。 ...
深入浅出理解javaScript原型链
12-01
本文将深入探讨JavaScript的原型链，包括显式和隐式原型链，以及它们在实际编程中的应用。 首先，我们需要了解两个核心概念：`prototype`和`__proto__`。`prototype`是每个函数（非原始类型）都具有的一个属性，它...
JavaScript 原型链学习总结
12-08
一个实例的对像，它的默认的父原型为其构造函数的显示原型 [每个对像都有一个隐慝的属性用于指向到它的父对像（构造对像的函数）的原型(这里称为父原型或隐式原型）。因为原型也是对像,所以原型也有父原型,Object的...
Javascript原型链及instanceof原理详解
11-20
javascript中的对象都有一个__proto__属性，这个是对象的隐式原型，指向该对象的父对象的原型（prototype）。显式的原型对象使用prototype，但是Object.prototype.proto=null; 判断某个对象a是否属于某个类A的实例，...
原型链和构造函数.docx
05-26
当试图访问一个对象的属性时，如果该对象自身没有该属性，JavaScript会向上查找其原型，这个过程一直持续到找到该属性或到达原型链的顶部——即`null`，表示链的结束。 1. **类型判断**： 在JavaScript中，`typeof...
原型与原型链的实战代码.html
05-19
原型和原型链整体例子从原型的创建，原型与对象的关联关系，实例与原型的关系以及原型链的形成和运用等等均做了例子的说明
简单关于原型链学习总结
pdsgr1996的博客
06-01 239
简单的关于原型链
JS原型与原型链终极详解
qiu265843468的专栏
05-02 1293
http://www.108js.com/article/article1/10201.html?id=1092
简单粗暴地理解js原型链--js面向对象编程
weixin_30421525的博客
05-03 253
原型链理解起来有点绕了，网上资料也是很多，每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看，效果极好。 不要纠结于那一堆术语了，那除了让你脑筋拧成麻花，真的不能帮你什么。简单粗暴点看原型链吧，想点与代码无关的事，比如人、妖以及人妖。 1）人是人他妈生的，妖是妖他妈生的。人和妖都是对象实例，而人他妈和妖他妈就是原型。原型也是对象，叫原型对象。 2）人他妈和人他爸啪啪啪能生...
原型与原型链详解（带图方便理解）
m0_55734030的博客
11-21 1万+
每一个类（构造函数）都有一个显示原型prototype（本质就是个对象）01 类：是创建对象实例的模板 本质上讲类是个函数 (例如Array object String )001 构造函数 ：用new来执行的函数02 实例:就是由类创建的对象 本质上就是对象例如 [1,2,3] {name : "mumu " } , “abc”以上就是面试经常会问到的内容啦，希望对你们有用哈。
html5原型链继承,JS原型链
weixin_39867066的博客
06-27 122
一. JS原遇新是直朋能到分览支体调型的简单理解1.1 prototyp新直能分支调二浏页器朋代说eprototype:是一个函数的属性，每个函数中都会有一个prototype属性，这个属性是一个指针，指向一个对象。在JavaScript中原型是一个prototype对象，用于表示类型之间的关系。1.1一如分算需上来处一定迹面数一跳这件我子作.1 proto新直能分支调二浏页器朋代说，事刚需求t...
通俗易懂的JavaScript高级教程（含资料）
01-03
本套视频主讲JavaScript高级部分内容, 以复习总结JavaScript最基础的核心概念(数据类型，变量，内存，对象，函数)开始， 深入浅出讲解JavaScript最核心也最具难度的部分技术：原型与原型链、执行上下文、执行上下文栈、变量提升、函数提升、作用域、作用域链、闭包、对象的多种创建模式、对象的继承模式、JavaScript事件循环机制等。这部分技术是成为高级前端工程师的必备利器。
消灭JavaScript怪兽第二季(合集)：面向对象玩转JS
08-08
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型，常用于网页客户端编程，使网页在客户端浏览器中，实现更多地动态功能，表现出更加丰富的视觉效果。本课程是>系列课程的第二季课程。主要包含对象的创建、原型链、闭包、上下文、作用域、继承等知识点。
js从隐式、显式原型到原型链的简介
apple596529的博客
10-23 309
1.隐式原型、显式原型 概念： 每个对象都拥有的属性 对象隐式原型的值为其对应构造函数显式原型的 例子： 例子代码： function Fn(){ //函数内部语句 //this.prototype={} //Fn的显式原型指向一个空对象 } var fn=new Fn(); ...
隐式原型和显式原型有哪些
最新发布
05-20
在JavaScript中，每个对象都有一个隐式原型和一个显式原型。 1. 隐式原型（__proto__）：每个JavaScript对象都有一个指向它的原型对象的内部链接，称为隐式原型或 __proto__，它定义了对象的属性和方法的访问方式。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值