后盾人JS -- 原型

没有原型的对象

也有没有原型的对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let xj = {name:"向军"}console.log(xj)console.log(xj.hasOwnProperty("name"))//完全数据字典对象let hd = Object.create(null,{name:{value:"后盾人"}}) console.log(hd.hasOwnProperty("name"))</script>
</body>
</html>

原型和对象优先级

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {show(){console.log("后盾人")}}hd.__proto__.render = function(){}hd.render()</script>
</body>
</html>

函数有多个长辈

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>console.log(User)User.prototype.show = function(){console.log("后盾人")}let hd = new User()console.log(User.prototype == hd.__proto__)console.log(hd)function User(){}User.__proto__.view = function(){console.log('User function view method')}
</script>
</body>
</html>

原型关系详解与属性继承实例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = new Object()hd.name = "后盾人"Object.prototype.show= function(){console.log("houdunren")}function User(){}console.dir(User)console.log(User.prototype.__proto__ == User.__proto__.__proto__)console.dir(Object.prototype)</script>
</body>
</html>

系统构造函数的原型体现

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {}    //Objectconsole.log(hd.__proto__ == Object.prototype)let arr = []console.log(arr.__proto__ == Array.prototype)let str = ""console.log(str.__proto__ == String.prototype)</script>
</body>
</html>

自定义对象的原型设置

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {name:"hd"}let parent = {name:"parent",show(){console.log('partent method' + this.name)}} Object.setPrototypeOf(hd,parent)    //认爹console.log(Object.getPrototypeOf(hd))</script>
</body>
</html>

原型中的constructor引用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>function User(name){this.name = name}console.dir(User)console.log(User.prototype.__proto__)console.log(User.prototype.constructor == User)let lisi = new User.prototype.constructor("李四")console.log(lisi)</script>
</body>
</html>

对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>function User(name){this.name = namethis.show = function(){console.log(this.name)}}let hd = new User("后盾人")console.log(hd)function createByObject(obj,...args){const constructor = Object.getPrototypeOf(obj).constructorreturn new constructor(...args)}let xj = createByObject(hd,"向军")xj.show()
</script>
</body>
</html>

原型链检测

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let a = {}let b = {}console.log(b.__proto__.isPrototypeOf(a))Object.setPrototypeOf(a,b)      //b是a爹console.log(b.isPrototypeOf(a))</script>
</body>
</html>

属性检测差异

修改 Object.prototype 会对所有对象产生影响，因为所有对象都继承自 Object.prototype

 

 in会检测当前对象和原型链

hasOwnProperty只检测当前对象

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let a = {url:"houdunren"}let b = {name:"后盾人"}console.log("url" in a)Object.prototype.web = "hdcms.com"console.log("web" in a)Object.setPrototypeOf(a,b)console.log("name" in  a)console.log(a.hasOwnProperty("url"))</script>
</body>
</html>

借用原型链

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {data:[1,2,3,4,5]}Object.setPrototypeOf(hd,{max(){return this.data.sort((a,b)=>b-a)[0]}})console.log(hd.max())let xj = {lessons:{js:87,php:63,node:99,linux:88},get data(){return Object.values(this.lessons)}}console.log(hd.max.apply(xj))</script>
</body>
</html>

优化方法借用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {data:[1,2,3,4,5]}console.log(Math.max.call(null,...hd.data))let xj = {lessons:{js:87,php:63,node:99,linux:88},}console.log(Math.max.apply(null,Object.values(xj.lessons)))</script>
</body>
</html>

DOM结点借用Array原型方法

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><button message="后盾人" class="red">后盾人</button><button message="hdcms">hdcms</button><script>let arr = [1,3,43]let res = arr.filter(item => {return item > 39})console.log(arr.filter)console.log(res)let btns = document.querySelectorAll("button")console.log(btns.filter)btns = Array.prototype.filter.call(btns,item=>{return item.hasAttribute("class")})console.log(btns[0].innerHTML)</script>
</body>
</html>

this和原型没关系

this和原型是没有关系的

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>let hd = {name:"后盾人",show(){console.log(this.name)}}let User = {name:'向军'}Object.setPrototypeOf(hd,{})console.log(hd.show())</script>
</body>
</html>

使用原型最好用get，set这种方法

__proto__严格意义上不算属性，有getter和setter

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/web/67868.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

洛谷 P1130 红牌 C语言

洛谷 P1130 红牌 C语言

题目描述 某地临时居民想获得长期居住权就必须申请拿到红牌。获得红牌的过程是相当复杂&#xff0c;一共包括 N 个步骤。每一步骤都由政府的某个工作人员负责检查你所提交的材料是否符合条件。为了加快进程&#xff0c;每一步政府都派了 M 个工作人员来检查材料。不幸的是&…
阅读更多...
【线程】基于环形队列的生产者消费者模型

【线程】基于环形队列的生产者消费者模型

1 环形队列 环形队列采用数组来模拟&#xff0c;用取模运算来模拟环状特性。 1.如何判断环形队列为空或者为满? 当环形队列为空时&#xff0c;头和尾都指向同一个位置。当环形队列为满时&#xff0c;头和尾也都指向同一个位置。 因此&#xff0c; 可以通过加计数器或者标记…
阅读更多...
二分/双指针/单调栈队列专题

二分/双指针/单调栈队列专题

1.4924. 矩阵 - AcWing题库 一开始打表找规律以为是右上角向左下角递增,但当n很大的时候就不对了,因此我们得去观察 i * i 100000 * (i - j) j * j i * j 这个式子,我们关心的是这个式子的单调性因此我们可以分别将i和j看作常数来对式子进行求导,可以得到 f(i) 2 * i 10…
阅读更多...
Shell $0

Shell $0

个人博客地址&#xff1a;Shell $0 | 一张假钞的真实世界 我们已经知道在Shell中$0表示Shell脚本的文件名&#xff0c;但在有脚本调用的情形中&#xff0c;子脚本中的$0会是什么值呢&#xff1f;我们通过下面的实例来看。 已测试系统列表&#xff1a; Mac OS X EI Capitan 1…
阅读更多...
商品列表及商品详情展示

商品列表及商品详情展示

前言 本文将展示一段结合 HTML、CSS 和 JavaScript 的代码&#xff0c;实现了一个简单的商品展示页面及商品详情&#xff0c;涵盖数据获取、渲染、搜索及排序等功能。 效果展示 点击不同的商品会展示对应的商品详情。 代码部分 代码总体实现 <!DOCTYPE html> <htm…
阅读更多...
[ VS Code 插件开发 ] 使用 Task ( 任务 ) 代替 createTerminal (终端) 来执行命令

[ VS Code 插件开发 ] 使用 Task ( 任务 ) 代替 createTerminal (终端) 来执行命令

VSCode 官方自己的插件就是这样执行命令的. 使用体验 比 默认的终端 好太多了. 重用终端, Shell 集成 , 按任意键关闭, 任务是否成功, 左侧命令操作 (菜单中功能很多) 等 import * as vscode from vscode; // 执行的命令 let command_str "npm run dev" // 工作目…
阅读更多...
大模型综述一镜到底（全文八万字） ——《Large Language Models: A Survey》

大模型综述一镜到底（全文八万字） ——《Large Language Models: A Survey》

论文链接&#xff1a;https://arxiv.org/abs/2402.06196 摘要&#xff1a;自2022年11月ChatGPT发布以来&#xff0c;大语言模型&#xff08;LLMs&#xff09;因其在广泛的自然语言任务上的强大性能而备受关注。正如缩放定律所预测的那样&#xff0c;大语言模型通过在大量文本数…
阅读更多...
Python处理数据库：MySQL与SQLite详解

Python处理数据库：MySQL与SQLite详解

Python处理数据库&#xff1a;MySQL与SQLite详解 在数据处理和存储方面&#xff0c;数据库扮演着至关重要的角色。Python提供了多种与数据库交互的方式&#xff0c;其中pymysql库用于连接和操作MySQL数据库&#xff0c;而SQLite则是一种轻量级的嵌入式数据库&#xff0c;Pytho…
阅读更多...
【C++】B2124 判断字符串是否为回文

【C++】B2124 判断字符串是否为回文

博客主页&#xff1a; [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: C 文章目录 &#x1f4af;前言&#x1f4af;题目描述输入格式&#xff1a;输出格式&#xff1a;样例&#xff1a; &#x1f4af;方法一&#xff1a;我的第一种做法思路代码实现解析 &#x1f4af;方法二&#xff1a;我…
阅读更多...
ubuntuCUDA安装

ubuntuCUDA安装

系列文章目录 移动硬盘制作Ubuntu系统盘 前言 根据前篇“移动硬盘制作Ubuntu系统盘”安装系统后&#xff0c;还不能够使用显卡。 如果需要使用显卡&#xff0c;还需要进行相关驱动的安装&#xff08;如使用的为Nvidia显卡&#xff0c;就需要安装相关的Nvidia显卡驱动&#xff…
阅读更多...
Selenium 使用指南：从入门到精通

Selenium 使用指南：从入门到精通

Selenium 使用指南&#xff1a;从入门到精通 Selenium 是一个用于自动化 Web 浏览器操作的强大工具&#xff0c;广泛应用于自动化测试和 Web 数据爬取中。本文将带你从入门到精通地掌握 Selenium&#xff0c;涵盖其基本操作、常用用法以及一个完整的图片爬取示例。 1. 环境配…
阅读更多...
Sqoop导入MySQL中含有回车换行符的数据

Sqoop导入MySQL中含有回车换行符的数据

个人博客地址&#xff1a;Sqoop导入MySQL中含有回车换行符的数据 MySQL中的数据如下图&#xff1a; 检查HDFS上的目标文件内容可以看出&#xff0c;回车换行符位置的数据被截断了&#xff0c;导致数据列错位。 Sqoop提供了配置参数&#xff0c;在导入时丢弃掉数据的分隔符&…
阅读更多...
利用matlab寻找矩阵中最大值及其位置

利用matlab寻找矩阵中最大值及其位置

目录 一、问题描述1.1 max函数用法1.2 MATLAB中 : : :的作用1.3 ind2sub函数用法 二、实现方法2.1 方法一&#xff1a;max和find2.2 方法二&#xff1a;max和ind2sub2.3 方法对比 三、参考文献 一、问题描述 matlab中求最大值可使用函数max&#xff0c;对于一维向量&#xff0…
阅读更多...
PyTorch数据建模

PyTorch数据建模

回归分析 import torch import numpy as np import pandas as pd from torch.utils.data import DataLoader,TensorDataset import time strat = time.perf_counter()
阅读更多...
机试题——字符匹配

机试题——字符匹配

题目描述 给你一个字符串数组&#xff08;每个字符串均由小写字母组成&#xff09;和一个字符规律&#xff08;由小写字母和 . 和 * 组成&#xff09;&#xff0c;识别数组中哪些字符串可以匹配到字符规律上。 . 匹配任意单个字符。* 匹配零个或多个前面的那一个元素。 所谓…
阅读更多...
《 C++ 点滴漫谈： 二十五 》空指针，隐秘而危险的杀手：程序崩溃的真凶就在你眼前！

《 C++ 点滴漫谈： 二十五 》空指针，隐秘而危险的杀手：程序崩溃的真凶就在你眼前！

摘要 本博客全面解析了 C 中指针与空值的相关知识&#xff0c;从基础概念到现代 C 的改进展开&#xff0c;涵盖了空指针的定义、表示方式、使用场景以及常见注意事项。同时&#xff0c;深入探讨了 nullptr 的引入及智能指针在提升代码安全性和简化内存管理方面的优势。通过实际…
阅读更多...
git push到远程仓库时无法推送大文件

git push到远程仓库时无法推送大文件

一、错误 remote: Error: Deny by project hooks setting ‘default’: size of the file ‘scientific_calculator’, is 164 MiB, which has exceeded the limited size (100 MiB) in commit ‘4c91b7e3a04b8034892414d649860bf12416b614’. 二、原因 本地提交过大文件&am…
阅读更多...
掌握API和控制点(从Java到JNI接口)_36 JNI开发与NDK 04

掌握API和控制点(从Java到JNI接口)_36 JNI开发与NDK 04

4、 *.so的入口函数&#xff1a;JNI_OnLoad() VM (virtual machine)的角色 Java代码在VM上执行。在执行Java代码的过程中&#xff0c;如果Java需要与本地代码(*.so)沟通时&#xff0c; VM就会把*.so視为插件<Tn>而加载到VM里。然后让Java函数呼叫到这插件<Tn>里的…
阅读更多...
Windows图形界面(GUI)-QT-C/C++ - QT Tab Widget

Windows图形界面(GUI)-QT-C/C++ - QT Tab Widget

公开视频 -> 链接点击跳转公开课程博客首页 -> ​​​链接点击跳转博客主页 目录 一、概述 1.1 什么是 QTabWidget&#xff1f; 1.2 使用场景 二、常见样式 2.1 选项卡式界面 2.2 动态添加和删除选项卡 2.3 自定义选项卡标题和图标 三、属性设置 3.1 添加页面&…
阅读更多...
[MRCTF2020]Ez_bypass1(md5绕过)

[MRCTF2020]Ez_bypass1(md5绕过)

[MRCTF2020]Ez_bypass1(md5绕过) ​​ 这道题就是要绕过md5强类型比较&#xff0c;但是本身又不相等&#xff1a; md5无法处理数组&#xff0c;如果传入的是数组进行md5加密&#xff0c;会直接放回NULL&#xff0c;两个NuLL相比较会等于true&#xff1b; 所以?id[]1&gg…
阅读更多...
最新文章

Copyright @ 2022~2023