小练习
关注
分享
扫一扫
丁丁丁dingdingding
一个努力挣高薪的码农女孩
展开
-
今天的码农女孩学习了关于事件操作和ref属性的笔记并做了表单双向绑定的练习
事件操作 在虚拟dom中调用事件，事件名首字母要大写，例如：onClick，在调用的函数需要改变this指向，或者定义成箭头函数 class Header extends React.Component{//子 fun(){ this.props.foo("asd") } rende原创 2022-07-06 19:38:38 · 225 阅读 · 0 评论 -
今天的码农女孩用react写了轮播图以及组件之间的不同之处
轮播图：展示组件(Presentational component)和容器组件(Container component)之间有何不同类组件(Class component)和函数式组件(Functional component)之间有何不同原创 2022-07-05 18:03:10 · 226 阅读 · 0 评论 -
今天的码农女孩做了关于呼吸灯的练习、受控组件和高阶组件的简答题
练习：用标签做一个圆形，做呼吸灯效果，动画是：改变透明度1-0 循环何为受控组件(controlled component)在 HTML 中，类似 , 和 这样的表单元素会维护自身的状态，并基于用户的输入来更新。当用户提交表单时，前面提到的元素的值将随表单一起被发送。但在 React 中会有些不同，包含表单元素的组件将会在 state 中追踪输入的值，并且每次调用回调函数时，如 onChange 会更新 state，重新渲染组件。一个输入表单元素，...原创 2022-07-04 11:13:01 · 196 阅读 · 0 评论 -
今天的码农女孩做了关于生命周期的笔记以及动态时钟的练习
生命周期 分为三个阶段：挂载，渲染，卸载 1.componentWillMount 挂载时触发 变量和函数已经生成，但是虚拟dom还没有渲染到页面 2.constructor 构造函数 用来定义变量，接收父类传值，改变函数this指向等 3.render 生成dom渲染 把虚拟dom转化为页面标签渲染 4.componentDidMount 挂载后触发原创 2022-07-02 11:34:26 · 236 阅读 · 0 评论 -
今天的码农女孩总结了react的知识，并做了显示隐藏的小练习
练习：点击按钮，让div隐藏显示切换代码如下：只显示了css和js部分React 中 keys 的作用是什么？Keys 是 React 用于追踪哪些列表中元素被修改、被添加或者被移除的辅助标识。在开发过程中，我们需要保证某个元素的 key 在其同级元素中具有唯一性。在 React Diff 算法中 React 会借助元素的 Key 值来判断该元素是新近创建的还是被移动而来的元素，从而减少不必要的元素重渲染。此外，React 还需要借助 Key 值来判断元素与本地状态的关联关系，因此我们绝不可忽视转换函原创 2022-07-01 17:51:30 · 125 阅读 · 0 评论 -
今天的码农女孩学习了关于react子父组件传值的知识，并做了小练习
子父组件传值 父组件给子组件传值：父组件下定义属性并赋值，子组件里用prop接收，接收的是对象类型 //es5写法父组件传值给子组件 function App(prop){//子 return ( app {prop.name1}-{prop.age} ...原创 2022-06-30 11:29:01 · 196 阅读 · 0 评论 -
今天的码农女孩根据昨天的jQuery笔记写了简答题和练习
简答：1.使用jquery遇到的问题前台拿不到值，JSON 可能出现的错误(多了一个空格等)这编译是不会报错的 ，jquery库与其他库冲突；解决方案：今天在处理一个数据问题时，发现jQuery.ajax()方法返回的值一直有问题，清除缓存后数据无误，多次测试后发现返回的值都是之前的值，并且一直未执行url(后台为JAVA，设置断点一直未进入)。在网上查找下,发现是未设置type的原因。如果没设置jQuery.ajax的type="Post"，那么ajax就会默认type="Get"，这就会导致之前数据被缓原创 2022-06-17 14:18:43 · 113 阅读 · 0 评论 -
今天的码农女孩学习了关于python元祖和字典的知识以及结合前面学的知识做了四个小练习
元祖 元祖与列表类似，但是元祖的值一旦定义，不能改变，所以叫做固定长度类型，下标从0开始，用()定义 定义方式：y1=(1,2,3,4) y2="a","b","c" 添加修改删除都会报错 查询 y[1] for v in y1 删除元祖 del y 注意：元祖里如果只包含一个元素，需要在元素后面加上逗号，否则会被当成运算符的括号使用，例如：(55)运算符括号输出55类型为int ；(55,) 元祖括号输出...原创 2022-05-26 12:21:40 · 127 阅读 · 0 评论 -
今天的码农女孩学习了关于python列表和集合的知识以及小练习
列表 类似于数组，用来存储多个值，并且可以在一个数组存放多种类型，长度是可变的，下标从0开始，用[]定义 定义方式：x=[1,"asd",True] 添加修改：x[0]=55 删除：del x[2] 查询：for v in x 操作符： x+y拼接两个数组 []获取列表下的值 例x[0] x[-1] [:]获取指定范围值 例x[1:4] x[...原创 2022-05-25 08:41:07 · 100 阅读 · 0 评论 -
今天的码农女孩学习了关于python判断循环的知识以及小练习
判断if/else判断 if 判断条件: 执行语句 elif 判断条件： 执行语句 ....... else: 以上条件都不满足才执行循环while循环 while 满足条件： 循环的语句for循环 for i in range(5): 循环的语句 range(start,end,step)自动生成数字序列,默认从0开始,end是必填项，例从0-5结束语句 cont...原创 2022-05-23 10:00:35 · 268 阅读 · 1 评论 -
结合前两天的学习今天的码农女孩做了一个关于购物车案例的练习
购物车案例思路： 1.将内容显示在页面上在data里定义一个数组，在tr里使用v-for指令循环遍历数组 2.价格以及总价格取两位小数两种方法：第一种使用函数，第二种使用过滤器，都需要使用toFixed()方法 在下面的案例中，单个价格使用的是方法一，总价格使用的是方法二。并且总价格的计算循环列举了四种方法,简便方法是第四种使用的是reduce高阶函数 3.书籍数量不能为负数，在数量那绑定表单中disabled方法，让数量...原创 2022-05-11 10:36:08 · 147 阅读 · 1 评论 -
今天的码农女孩总结了哪些数组的方法是响应式的笔记
1.push() 2.pop() 3.shift() 4.unshift() 5.splice() 还可以进行增删改 6.sort() 7.reverse()举例按钮8不是响应式<body> <div id="app"> <ul> <li v-for="item in letters" :key="item">{{item}}</li> </ul>原创 2022-05-10 10:37:33 · 102 阅读 · 1 评论 -
今天的码农女孩学习了关于v-if和v-show指令的知识
v-if条件渲染案例：用户登录时点击按钮可以切换使用用户登录还是邮箱地址登录 <div id="app"> <span v-if="isUser"> <label for="username">用户账号</label> <input type="text" id="username" placeholder="用户账号" key="username"> &l原创 2022-05-09 11:13:33 · 173 阅读 · 1 评论 -
今天的码农女孩学习了关于v-for循环指令的知识并做了一个小练习
v-for遍历数组 <div id="app"> <!-- 1.在遍历的过程中，没有使用索引值(下标值) --> <ul> <li v-for="item in names">{{item}}</li> </ul> <!-- 2.在遍历的过程中，获取索引值(下标值) --> <ul>原创 2022-05-09 11:04:23 · 187 阅读 · 1 评论 -
今天的码农女孩学习了关于v-model的知识并结合表单做出了练习
v-model:当我们在输入框输入内容时，因为input中的v-model发生改变时，因为上面我们使用了Mustache语法，将message的值插入到DOM中，所以DOM会发生响应的改变，所以通过v-model实现了双向绑定原理：v-model其实是一个语法糖，它的背后本质上是包含两个操作1.v-bind绑定了一个value属性；2.v-on指令给当前元素绑定input事件 <div id="app"> <input type="text" v-model原创 2022-05-08 11:51:24 · 254 阅读 · 0 评论 -
今天的码农女孩学习了关于高阶函数的知识，通过练习的方式引出新知识
练习：现在有一个数组，const nums=[30,87,257,99,566,10,45,39]第一步在数组中先取出所有小于100的数字；第二步将所有小于100的数字全部*2；第三步将第二步的得出的新数祖的值全部相加通过练习的方式使用四种方法来抛出今天的新知识，自上而下越来越简单传统思维方法：使用for循环进行遍历 const nums=[30,87,257,99,566,10,45,39] //老方法 let newNums=[]原创 2022-05-07 12:17:16 · 207 阅读 · 1 评论 -
今天的码农女孩学习了关于计算属性的知识
vue的计算属性:在模板中放入太多的逻辑会让模板过重且难以维护，在需要对数据进行复杂处理，且可能多次使用的情况下，尽量采取计算属性的方式。好处：①使得数据处理结构清晰；②依赖于数据，数据更新，处理结果自动更新；③计算属性内部this指向vm实例；④在template调用时，直接写计算属性名即可；⑤常用的是getter方法，获取数据，也可以使用setter方法改变数据；⑥相较于methods，不管依赖的数据变不变，methods都会重新计算，但是依赖数据不变的时候compute原创 2022-05-05 11:28:59 · 115 阅读 · 0 评论 -
今天的码农女孩学习了关于v-bind指令的知识
v-bind指令：用于绑定一个或多个属性值，或者向另一个组件传递props值 一般是图片的链接src,网站的链接href,动态绑定一些类、样式等等 作用：动态绑定属性 缩写：:(只写一个冒号) <div id="app"> <!-- 动态绑定class v-bind:class="{类名1:true,类名2:false}" --> <h2 v-bind:class="{act...原创 2022-05-04 10:57:24 · 494 阅读 · 0 评论 -
今天的码农女孩学习了vue中的mvvm模式的知识
vue中的mvvm model层：数据层，数据可能是我们固定的死数据，更多的是来自我们服务器，从网络上请求下来的数据，在上一个文章的计数器案例中，就是后面抽取出来的obj view层：视图层，在前端开发中，通常就是DOM层，主要的作用是给用户展示各种信息 ViewModel层：视图模型层，是view和model沟通的桥梁。 一方面实现了Data Binding,也就是数据绑定，将model的改变实时的反应到view中。 ...原创 2022-05-02 11:27:02 · 297 阅读 · 0 评论 -
今天的码农女孩开始学习vue相关的知识，学习了vue指令，做了一个计数器的练习
先做第一个vue程序，来体验一下vue的响应式代码做了什么事情？我们来阅读javascript代码，会发现创建了一个vue对象创建vue对象的时候，传入了一些options:{}{}中包含了el属性：该属性决定了这个vue对象挂载到哪一个元素上，很明显，我们这里是挂载到了id为app的元素上{}中包含了data属性：该属性中通常会存储一些数据这些数据可以是我们直接定义出来的，比如像下面这样也可能是来自网络，从服务器加载的第一个vue程序hello world &l原创 2022-05-01 10:25:57 · 135 阅读 · 0 评论 -
今天的码农女孩做了关于vue计算函数、监听函数和过滤函数的练习
1.创建一个监听函数，验证年龄并给出提示 当修改的年龄值非数字类型，提示请输入正确年龄，变量清空 当修改的年龄值大于80，小于18，提示年龄范围在18-80岁，变量清空<body> <div id="app"> <input type="text" v-model="age"> <h1>{{msg}}</h1> <h1>{{age}}</...原创 2022-04-30 11:59:22 · 264 阅读 · 0 评论 -
今天的码农女孩做了关于数据库字段增删改查以及单表查询的关键字和分组函数的笔记
1.对表的管理创建表create table 表名( 字段名1 类型(长度）是否为空 自动递增 主键, 字段名2 类型(长度）是否为空, .......);删除表drop table 表名2.对表字段的管理创建表字段alter table 表名add(字段名 类型 是否为空)修改表字段alter table 表名modify 字段名 类型 是否为空删除表字段alter table 表名drop...原创 2022-04-29 09:58:49 · 160 阅读 · 0 评论 -
今天的码农女孩学习了关于module模块的两个命令export和import的知识
module模块：在ES6标准中，javascript原生支持了module，这种将JS代码分割成不同功能的小块进行模块化的概念是在一些第三方规范中流行起来的，比如CommonJS和AMD模式将不同功能的代码分别写在不同文件中，各模块只需导出公共接口部分，然后通过模块的导入的方式可以在其他地方使用，将独立的js文件作为模块模块功能主要由两个命令构成:export和import。export命令用于规定模块的对外接口，import命令用于输入其他模块提供的功能注意：ES6的模块自动采用严格模式，不原创 2022-04-23 11:37:40 · 1782 阅读 · 0 评论 -
今天的码农女孩做了关于Set集合和WeakSet的笔记
Set集合:是对数组的扩展特点：存放的对象必须唯一，没有重复元素与Map差不多，操作Set：1.add(value)：添加某个值，返回Set结构本身2.delete(value):删除某个值，返回一个布尔值，表示删除是否成功3.has(value)：返回一个布尔值，表示该值是否为Set成员4.clear():清除所有成员，没有返回值5.size：返回Set成员总数 //1.创建 var set1=new Set(); //原创 2022-04-18 11:58:16 · 195 阅读 · 0 评论 -
今天的码农女孩做了关于JSON的笔记
JSON （Javascript Object Notation） JSON :js中的对象只有js自己认识，其他的语言都不认识 JSON就是一个特殊格式的字符串，这个字符串可以被任意语言所识别，并且可以转换为任意语言中的对象 JSON在开发中主要用来数据的交互，JSON和js对象的格式一样，只不过JSON字符串中的属性名必须加双引号，其他的和js语法一致 JSON分类：1.对象{},2.数组[] JS...原创 2022-04-09 18:34:37 · 410 阅读 · 0 评论 -
今天的码农女孩用js做了二级菜单的练习
二级菜单也就是折叠，在响应式还是vue下都有特定的组件更简便的书写，今天做的练习就是为了更好的理解js<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=dev原创 2022-04-08 12:01:59 · 279 阅读 · 2 评论 -
今天的码农女孩做了关于定时器切换图片和轮播图的练习
练习一：用定时器切换四张图片，点击开始按钮开始依次切换，点击停止则停到指定图片。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,原创 2022-04-07 12:11:32 · 322 阅读 · 1 评论 -
今天的码农女孩做了关于键盘事件的笔记和练习
键盘事件onkeydown 按键按下,如果一直按着某个按键不松手，则事件会一直触发，如果连续触发时，第一次和第二次直接会间隔稍微长一点，其他的会非常快，这种设计是为了防止误操作发生onkeyup 按键松开,键盘事件一般都会绑定给一些可以获取焦点的对象或者是document可以通过keyCode来获取按键的编码，通过它可以判断哪个按键被按下除了keyCode，事件对象中还提供了几个属性：altKey ctrlKey shiftKey这三个用来判断alt ctrl shift是否被按下，按.原创 2022-04-04 17:46:44 · 532 阅读 · 2 评论 -
今天的码农女孩做了关于滚轮事件的练习
码农女孩今天将滚轮事件的笔记写在编译器里，也合理书写了注释onmousewheel鼠标滚轮滚动的事件，会在滚轮滚动时触发<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content原创 2022-04-03 09:46:52 · 162 阅读 · 0 评论 -
今天的码农女孩做了事件拖拽的练习
拖拽的流程 1.当鼠标在被拖拽元素上按下时，开始拖拽onmousedown 2.当鼠标移动时被拖拽元素跟随鼠标移动onmousemove 3.当鼠标松开时，被拖拽元素固定在当前位置onmouseup<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv=...原创 2022-04-02 12:58:10 · 82 阅读 · 1 评论 -
今天的码农女孩做了关于事件对象的笔记和练习
事件对象 clientHeight 返回可见区域的高度,不带px,会获取包括内容区和内边距，不包括边框 clientWidth 返回可见区域的宽度,不带px,会获取包括内容区和内边距，不包括边框 offsetWidth 返回的宽度会加上边框就是整个的大小 offsetHeight 返回的高度会加上边框就是整个的大小 offsetParent 用来获取当前元素的定位父元素，就原创 2022-03-31 13:36:43 · 126 阅读 · 0 评论 -
今天的码农女孩做了关于ES6的简答内容
1.说说严格模式的限制变量必须声明后再使用函数的参数不能有同名属性，否则报错不能使用with语句不能对只读属性赋值，否则报错不能使用前缀0表示八进制数，否则报错不能删除不可删除的属性，否则报错不能删除变量delete prop，会报错，只能删除属性delete global[prop]eval不会在它的外层作用域引入变量eval和arguments不能被重新赋值arguments不会自动反映函数参数的变化不能使用arguments.callee不能使用argu原创 2022-03-29 14:40:03 · 159 阅读 · 0 评论 -
今天的码农女孩又做了DOM的练习
练习是关于全选，全不选，反选，提交的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2022-03-27 08:17:30 · 170 阅读 · 0 评论 -
今天的码农女孩做了关于DOM查询的剩余方法及练习
笔记的形式我写在了编译器里<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2022-03-26 11:49:01 · 157 阅读 · 1 评论 -
今天的码农女孩做了关于DOM查询的练习
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.原创 2022-03-25 09:56:33 · 339 阅读 · 1 评论 -
今天的码农女孩做了vue工程中每个文件夹的用处和过滤器的练习
项目文件内容：node_modules 项目的依赖包，node的命令或者自己安装的模块都在这里public 公共资源目录，静态文件夹，例如放图片，页面等src 写vue代码的.gitignore 配置git的文件或文件夹babel.config.js 使用一些预设，进行选项配置README.md 定义项目描述，例如解释命令的作用package.json 记录项目描述和依赖信息package-lock.json 模块的版本管理使用的文件src文件夹：assets 静态文件夹，用来放图片，原创 2022-03-19 10:19:08 · 314 阅读 · 0 评论 -
今天的码农女孩做了关于钩子函数、指令的笔记和简答题 混入的小练习
自定义指令我们可以通过自定义指令为标签操作属性，样式，事件等内容，但是指令要求以“v-”开头例如： <input type="text" v-sty> directives:{ sty:{//修改样式 inserted:function(el){ el.style.backgroundColor="pink" ...原创 2022-03-15 13:21:57 · 745 阅读 · 0 评论 -
今天的码农女孩写了关于vue的事件样式的笔记以及简答题、编程题
事件键盘修饰符：例如：v-on.keyup.left="fun"按左键enter回车 tab制表符 shift ctrl escdelete up down left right事件修饰符：1.stop 阻止冒泡2.prevent 不再重载页面3.capture 调用捕获模式4.self 让事件操作元素本身,子元素不会触发5.once 事件只执行一次简答：vue常用的修饰符？答：.lazy在“change”时更新数据；.number输入值转为数值类型；.trim自动过滤用户输入的首尾空原创 2022-03-12 11:26:42 · 930 阅读 · 1 评论 -
今天的码农女孩做了关于set集合的小练习
1.用set集合求出数组的并集 例如：[1,2,3] [2,3,4] 并集:[1,2,3,4] var a=[1,2,3] var b=[2,3,4] var e=new Set([...a,...b]) console.log([...e]) 2.用set集合求出数组的交集 例如：[1,2,3] [2,3,4] 交集:[2,3] var a=[1,2,3] ...原创 2022-03-07 12:12:27 · 167 阅读 · 0 评论 -
今天的码农女孩做了关于箭头函数的练习
1.用箭头函数实现数字数组倒序排序 var a=[1,6,3,8,2,7,9] var b=a.sort((v,i,arr)=>i-v) console.log(b) 2.用箭头函数实现柯里化函数,做加法运算 例如：fun(1)(2) 输出3 fun(1)(2)(3) 输出6 function fun(me){ var slice=Arra...原创 2022-03-05 10:49:19 · 327 阅读 · 0 评论