2025/1/21 学习Vue的第四天
睡觉。
---------------------------------------------------------------------------------------------------------------------------------
11.Object.defineProperty
1.在我们之前学习JS的时候，普通得定义一个对象与属性。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>回顾object.defineProperty方法</title>
</head>
<body><script>let Person = {name:'张三',sex:'男',age:18}console.log(Person)</script>
</body>
</html>我们会发现能够正常输出
2.如果我们想在此写法的对象外面添加属性，应该如何书写？
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>回顾object.defineProperty方法</title>
</head>
<body><script>let Person = {name:'张三',sex:'男',age:18 }Object.defineProperty(Person,'address',{value:'黄冈'})console.log(Object.keys(Person))</script>
</body>
</html>打开控制台我们会发现：额外添加的address属性，不能参与遍历
3.得到对象一系列属性的方法是：
console.log(Object.keys(Person))
并不能得到address属性
4.让我们试着书写遍历的代码看看能不能遍历得到address。使用for in
for(var key in Person){console.log(Person[key])}
我们发现并没有得到address的值，这说明我们不能控制额外添加的属性值
那么如何控制额外添加的属性呢？
5.如何控制，使得额外添加属性可修改可遍历可删除
Object.defineProperty(Person,'address',{value:'黄冈',enumerable:true,//控制属性是否可以枚举writable:true,//控制属性是否可以被修改configurable:true//控制属性是否可以被删除})6.将额外的属性定义在Object外面，再由Object.defineProperty修改
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>回顾object.defineProperty方法</title>
</head>
<body><script>var add ='武汉'let Person = {name:'李四',sex:'男',age:18 }Object.defineProperty(Person,'address',{// value:'黄冈',// enumerable:true,//控制属性是否可以枚举// writable:true,//控制属性是否可以被修改// configurable:true//控制属性是否可以被删除get(){console.log('有人读取了')return add},set(){console.log('有人修改了')return add}})// for(var key in Person){// console.log(Person[key])// }console.log(Person)// console.log(Object.keys(Person))</script>
</body>
</html>
12.理解数据代理
通过一个对象代理，对另一个对象中属性的操作
1.让我们使用一个简单的例子来实现。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>理解数据代理</title>
</head>
<body><script>let A={name1:'苏高阳'}let B={name2:'赵丽颖'}Object.defineProperty(A,'name2',{get(){console.log('读取B')return B.name2},set(value){console.log('修改A')A.name1=value}})</script>
</body>
</html>
2.我们发现通过Object.defineproperty传入一个对象，传入其他对象的属性，可以改变两个对象的属性。
加深了我们对于数据代理的理解。
13.Vue中的数据代理
1.Vue中的数据代理：
通过vm对象来代理data对象中属性的操作（读写）
2.Vue中数据代理的好处:
更加方便的操作data中的数据
3.基本原理:
通过Object.defineProperty（）把 data对象中所有属性添加到vm上。
为每一个添加到vm上的属性，都指定一个getter/setter
在getter/setter内部去操作（读/写）data中对应的属性
相关文章：
2025/1/21 学习Vue的第四天
睡觉。 --------------------------------------------------------------------------------------------------------------------------------- 11.Object.defineProperty 1.在我们之前学习JS的时候，普通得定义一个对象与属性。 <!DOCTYPE html> <h…...
云计算、AI与国产化浪潮下DBA职业之路风云变幻，如何谋破局启新途？
引言 在近日举办的一场「云和恩墨大讲堂」直播栏目中，云和恩墨联合创始人李轶楠、副总经理熊军和欧冶云商数据库首席薛晓刚共同探讨了DBA的现状与未来发展。三位专家从云计算、人工智能、国产化替代等多个角度进行了深入的分析和探讨，为从业者提供了宝贵…...
Linux内核编程（二十一）USB驱动开发-键盘驱动
一、驱动类型 USB 驱动开发主要分为两种：主机侧的驱动程序和设备侧的驱动程序。一般我们编写的都是主机侧的USB驱动程序。 主机侧驱动程序用于控制插入到主机中的 USB 设备，而设备侧驱动程序则负责控制 USB 设备如何与主机通信。由于设备侧驱动程序通常与…...
模拟算法习题篇
在算法中，模拟是一种通过计算机程序来模拟现实世界中的过程或系统行为的方法。它的核心思想是根据题目给定的规则和逻辑，按照步骤细致地重现事件的发展流程，从而获得最终结果。 解题时如何使用模拟算法： 理解题目规则：…...
蓝桥杯真题 - 翻转 - 题解
题目链接：https://www.lanqiao.cn/problems/3520/learning/ 个人评价：难度 1 星（满星：5） 前置知识：无 整体思路 贪心，除了第一位跟最后一位，其它字符，每当 S [ i ] ≠…...
IP属地与视频定位位置不一致：现象解析与影响探讨
在数字化时代，IP属地和视频定位位置已成为我们获取网络信息、判断内容真实性的重要依据。然而，有时我们会发现，某些视频内容中展示的定位位置与其发布者的IP属地并不一致。这种不一致现象引发了广泛的关注和讨论。本文旨在深入剖析IP属地与视…...
管道符、重定向与环境变量
个人博客站—运维鹿: http://www.kervin24.top CSDN博客—做个超努力的小奚： https://blog.csdn.net/qq_52914969?typeblog 一、重定向 将命令和文件结合 标准输入重定向（STDIN，文件描述符为0）：默认从键盘输入&am…...
可扩展性设计架构模式——开闭原则
1. 概述 在架构设计中，遵循开闭原则（Open/Closed Principle, OCP）,代码应该“对扩展开放，对修改关闭”是实现可扩展性的关键。这个原则指导我们设计系统时，应使其对新增功能开放，而对现有代码的修改封闭。这…...
算法随笔_17: 回文数
上一篇: 算法随笔_16: 找出第k小的数对距离-CSDN博客 题目描述如下: 给你一个整数 x ，如果 x 是一个回文整数，返回 true ；否则，返回 false 。 回文数是指正序（从左向右）和倒序（从右向左&…...
计算机的错误计算（二百一十九）
摘要 大模型能确定 sin(2.6^10) 的符号吗？实验表明，大模型的计算、推理均有问题。另外，结论也是错的。 前面讨论的内容为自变量是 2.6^100的正弦，本节讨论自变量为 2.6^10的正弦（对于某些大模型，2.6^100似…...
React进阶之高阶组件HOC、react hooks、自定义hooks
React高级 高阶组件 HOC属性代理反向继承属性代理和反向继承的区别实例实例一实例二 HooksHooks APIuseState：useEffect：useLayoutEffect：useRef：useContext：useReducer:useMemouseCallback 自定义Hooks 拓展ÿ…...
【Pytest】基础到高级功能的理解使用
文章目录 第一部分：Pytest 简介1.1 什么是 Pytest？1.2 Pytest 的历史1.3 Pytest 的核心概念1.4 Pytest 的特点1.5 为什么选择 Pytest？ 第二部分：Pytest 的基本使用2.1 安装 Pytest2.2 编写第一个测试用例2.2.1 创建一个简单的测试…...
RHCE实验详解
目录 实验分析 环境拓扑结构 项目需求 主机环境描述 实验步骤 一、密钥互信和主机名更改 二、DNS 三、NGINX 四、MARIADB 五、NFS 六、NTP 七、论坛服务 结果展示及痛点解答 实验分析 环境拓扑结构 项目需求 1. 172.25.250.101 主机上的 Web 服务要求提供 www.ex…...
备赛蓝桥杯之第十五届职业院校组省赛第二题：分享点滴
提示：本篇文章仅仅是作者自己目前在备赛蓝桥杯中，自己学习与刷题的学习笔记，写的不好，欢迎大家批评与建议 由于个别题目代码量与题目量偏大，请大家自己去蓝桥杯官网【连接高校和企业 - 蓝桥云课】去寻找原题࿰…...
MyBatis 注解开发详解
MyBatis 注解开发详解 MyBatis 支持使用注解来进行数据库操作。注解方式将 SQL 语句直接写在 Java 接口中，通过注解来完成 CRUD（增删改查）操作，省去了使用 XML 配置的繁琐步骤。这种方式适合简单项目或快速原型开发，因…...
Kivy App开发之UX控件VideoPlayer视频播放
kivy使用VideoPlayer控件实现视频播放，可以控制视频的播放，暂停，音量调节等功能。 在使用VideoPlayer视频播放器时，可以参考下表属性来设置其样式和触发事件。 属性说明source视频路径，默认为空state视频状态，值play，pause，stop，默认为stopthumbnail显示视频的缩略图…...
简单排序算法
异或运算及异或运算实现的swap方法 ^(异或): ^运算是计算机中的位运算，运算规则为相同为0，不同为1（也被称为无进位相加）。位运算处理效率比常规运算符效率更高。 异或运算遵循的法则： 0^N N N^N 0 异或运算…...
C语言初阶牛客网刷题——JZ17 打印从1到最大的n位数【难度：入门】
1.题目描述 牛客网OJ题链接 题目描述： 输入数字 n，按顺序打印出从 1 到最大的 n 位十进制数。比如输入 3，则打印出 1、2、3 一直到最大的 3 位数 999。 用返回一个整数列表来代替打印n 为正整数，0 < n < 5 示例1 输入&…...
基于springboot+vue的校园二手物品交易系统的设计与实现
开发语言：Java框架：springbootJDK版本：JDK1.8服务器：tomcat7数据库：mysql 5.7（一定要5.7版本）数据库工具：Navicat11开发软件：eclipse/myeclipse/ideaMaven包：…...
开发环境搭建-2：配置 python 运行环境（使用 uv 管理 python 项目）
在 WSL 环境中配置：WSL2 (2.3.26.0) Oracle Linux 8.7 官方镜像 UV 介绍 uv软件官网（github 需要梯子，没错这个软件的官网真就是 github 页面）：https://github.com/astral-sh/uv 中文官网（github 需要梯…...
云计算——弹性云计算器（ECS）
弹性云服务器：ECS 概述 云计算重构了ICT系统，云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台，包含如下主要概念。 ECS（Elastic Cloud Server）：即弹性云服务器，是云计算…...
智慧工地云平台源码，基于微服务架构+Java+Spring Cloud +UniApp +MySql
智慧工地管理云平台系统，智慧工地全套源码，java版智慧工地源码，支持PC端、大屏端、移动端。 智慧工地聚焦建筑行业的市场需求，提供“平台网络终端”的整体解决方案，提供劳务管理、视频管理、智能监测、绿色施工、安全管…...
Android15默认授权浮窗权限
我们经常有那种需求，客户需要定制的apk集成在ROM中，并且默认授予其【显示在其他应用的上层】权限，也就是我们常说的浮窗权限，那么我们就可以通过以下方法在wms、ams等系统服务的systemReady()方法中调用即可实现预置应用默认授权浮…...
3-11单元格区域边界定位(End属性)学习笔记
返回一个Range 对象，只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意：它移动的位置必须是相连的有内容的单元格…...
【SpringBoot自动化部署】
SpringBoot自动化部署方法 使用Jenkins进行持续集成与部署 Jenkins是最常用的自动化部署工具之一，能够实现代码拉取、构建、测试和部署的全流程自动化。 配置Jenkins任务时，需要添加Git仓库地址和凭证，设置构建触发器（如GitHub…...
ubuntu系统文件误删(/lib/x86_64-linux-gnu/libc.so.6)修复方案 [成功解决]
报错信息：libc.so.6: cannot open shared object file: No such file or directory： #ls, ln, sudo...命令都不能用 error while loading shared libraries: libc.so.6: cannot open shared object file: No such file or directory重启后报错信息&…...
0x-3-Oracle 23 ai-sqlcl 25.1 集成安装-配置和优化
是不是受够了安装了oracle database之后sqlplus的简陋，无法删除无法上下翻页的苦恼。 可以安装readline和rlwrap插件的话，配置.bahs_profile后也能解决上下翻页这些，但是很多生产环境无法安装rpm包。 oracle提供了sqlcl免费许可，…...
Spring AOP代理对象生成原理
代理对象生成的关键类是【AnnotationAwareAspectJAutoProxyCreator】，这个类继承了【BeanPostProcessor】是一个后置处理器 在bean对象生命周期中初始化时执行【org.springframework.beans.factory.config.BeanPostProcessor#postProcessAfterInitialization】方法时…...
python打卡day49@浙大疏锦行
知识点回顾： 通道注意力模块复习空间注意力模块CBAM的定义 作业：尝试对今天的模型检查参数数目，并用tensorboard查看训练过程 一、通道注意力模块复习 & CBAM实现 import torch import torch.nn as nnclass CBAM(nn.Module):def __init__…...
智能体革命：企业如何构建自主决策的AI代理？
OpenAI智能代理构建实用指南详解 随着大型语言模型（LLM）在推理、多模态理解和工具调用能力上的进步，智能代理（Agents）成为自动化领域的新突破。与传统软件仅帮助用户自动化流程不同，智能代理能够自主执行工…...