- 博客(37)
- 收藏
- 关注
RSS订阅原创 8 个 Promise 高级用法
promise 的 then 的第二个回调函数和 catch 在请求出错时都会被触发，咋一看没什么区别啊，但其实，前者不能捕获当前 then 第一个回调函数中抛出的错误，但 catch 可以。，当后面跟的是非 promise 对象的值时，它会将这个值使用 promise 对象包装，因此 await 后的代码一定是异步执行的。，这么神奇的输出顺序是如何做到的呢，某人不才，使用了 20 行左右的代码简单实现了一番，如有与 koa 雷同，纯属巧合。三种状态，但例如下面的示例中，promise 最终是什么状态？
2023-08-09 17:29:09
319
原创 React类组件
类组件 最基础的形态就是声明一个类 并且继承 React.Compoent 类 在类组件内部 声明render函数 返回的值就是模板渲染内容 by dixon 对于组件的理解 一个组件就是一大段html及它相关逻辑的替代 什么是状态？ 状态是state 单词的翻译 它是一种响应式的数据！ 什么是响应式？ 一旦状态发生变化那么使用到 状态的地方会自动更新视图 这是mvvm 框架 视图层面上最核心的概念 class Cp1 exte...
2022-05-09 20:00:47
2387
原创 Jsx 入门
使用 ReactDOM.render 在指定的节点渲染 模板内容 这里说的模板 指的是一个jsx 内容 因为直接使用字符串会有一系列的不方便 比如说拼接 还有一些逻辑的使用等等 jsx 的本质 就是一个表达式！！！ 表达式！！！ 表达式！！！ 使用jsx的第一目的就是 让我们能更像写html一样写模板 jsx的语法特征 1.jsx 只能有一个根节点 error: Adjacent JSX el...
2022-05-09 11:12:23
351
原创 JavaScript(http、本地存储）
Http:hyper Text transport protocol - 超文本传输协议 协议：约定双方的利益和责任 协议约束：客户端 服务器 1.建立连接 - 3次握手 2.进行通信 ①客户端给服务器发送消息 - 消息的格式必须是请求报文 (1)请求行：请求方式 请求路径 协议/版本 (2)请求头：包含请求信息的一些键值对 (3)请求空行：空格换行，目的是为了区分前面的信息和后面的数据 (4)请求主体：请求携带的参数，最终要给服务器传递的数据 ②服务器会给客户端被动响应消息 - 消..
2022-04-10 18:22:02
1158
原创 JavaScript(Ajax)
Ajax：async javascript and xml - 前端和后端进行交互的一种技术 ajax：异步的js技术，作用是前端跟后端进行传递数据 异步的js和xml - 在很久以前，数据都是以xml形式表现的 - 异步的js操作数据 现在的数据，大多以字符串形式表现，因为所有语言中的字符串都是一样的 前端攻城狮的工作：根据数据渲染页面 1.获取数据 - 服务器中 2.根据数据渲染 Ajax - 语法 四步骤 1.创建对象 - 创建电话 var xhr = new XMLH...
2022-04-07 19:36:15
2303
原创 JavaScript(原型)
对象原型 原型：任何对象天生都自带一个属性：__proto__ - 对应的值，也是一个对象 - 原型 / 原型对象 var obj = { name: '张三' } // console.log(obj); // console.log( 111, obj.__proto__ ); obj.__proto__.name = '李四' console.log(obj.name); // 自己的name console.log(obj); 原型的作用：对象就天生就能使用自带的原型...
2022-03-31 21:04:26
1138
原创 JavaScript(面向对象)
面向：终极目标：为了分工合作 面向过程：重视一件事情的整个过程 面向对象：重视一件事的参与对象 定义对象 var obj = {} // 字面量方式 var pbj = new Object() // 构造函数方式 两者一样 工厂函数 使用函数方式解决同类型对象的重复定义 function fn(name, age) { // 工厂函数：批量生产对象的 var obj = { name: name, age: age } .
2022-03-31 20:10:44
671
原创 JavaScript(正则）
正则 学习目标： 1.会做简单的用户名密码的规则 - 表单验证 2.手机号的规则 - 表单验证 3.邮箱的规则 - 表单验证 4.学会如何从地址栏中提取一段想要的数据 - 提取数据 用于处理字符串的规则js语法中，表现为一个对象 正则表达式的定义 var reg = /具体的规则/ var reg = new RegExp(具体的规则) 使用正则的5个方法 1.验证字符串： 正则.test(字符串) 字符串.search(正则) 2.提取...
2022-03-30 16:40:01
1535
原创 JavaScript（ES6）
let和const是es6新增的定义变量的两个关键字，使用语法跟var是一样的，跟var的区别： 1.没有预解析 2.全局变量不在window中 3.不能重复定义 4.会创建一个块级作用域，碰到大括号会重合作用域 const的值不能改变 - 常量 定义语法 let let是es6中新增的定义变量的关键字，使用方式跟var是一样的 var a = 10 let b = 20 console.log(a, b); var和let的区别 1.let定义的变量没有预解析 con..
2022-03-25 21:06:09
1357
原创 JavaScript（数组塌陷）
数组塌陷演示 var arr = [1,2,3,4,5,6] for(var i=0; i<arr.length; i++){ arr.splice(i.1) } console.log(arr) //[2,4,6} 解决方法 1.倒着删除 var arr = [1,2,3,4,5,6] for(var i=arr.length-1; i>=0; i--) { arr.splice(i, 1) } 2.每次删除 i-- var arr = [1,2,3,..
2022-03-25 19:16:39
877
原创 JavaScript(事件二）
事件对象 事件对象的获取方式： 1.通过一个形参来接收 2.通过window.event来接收 === event var e = e || window.event // console.log(event); // console.log(event === e); // true // console.log(event === window.event); // true 事件对象 - 系统在调用事件函数传入了一个实参对象，这个对象就...
2022-03-24 21:51:08
876
原创 JavaScript(DOM)
DOM:document object model - 文档对象模型 利用对象模型操作html文档的 顶层对象 - document html 基本结构 标签 html - console.log（document.documentElement） body -console.log( document.body ); head - console.log( document.head) 文本 - title - console.log...
2022-03-24 19:26:53
933
原创 JavaScript(事件)
事件定义 用户在网页中的行为叫做事件 学习事件的目的：希望能自定义的让用户在网页中进行某种行为之后，去执行写好一段代码 语法： 事件源：on事件类型 = 函数 行内绑定：<标签 on 事件类型 = " 一行js代码或函数调用 "> </标签> 事件源：用户在触发事件的时候使用哪个标签 - 标签 - 获取标签 事件类型 - 用户在进行哪种行为； 1.鼠标类 事件 描述 click 单击 dblclick 双击 m...
2022-03-23 20:43:40
381
原创 JavaScript(BOM)
BOM - browser object model - 浏览器对象模型 顶层对象：window 我们最终是使用对象的模型(对象嵌套对象形成的结构)来操作浏览器 对象模型中最顶层的结构，最大的对象：window - 系统内置：代表浏览器窗口 console.log(window); // object 对于浏览器的多种操作，window会内置很多小对象分别负责某一种操作 location - 用于操作浏览器的地址栏 3个属性 href - 完整地址 跳转页面 sethref...
2022-03-22 21:59:14
647
原创 JavaScript(进制换行与时间日期)
10进制转其他进制的方法：toString 语法：10进制数字.toString(目标进制) - 返回转成目标进制后的数组，且以字符串形式显示 var num = 5 // 转成2进制 var res = num.toString(2) console.log(res); var num = 12 // 将num转成8进制 var res = num.toString(8) console.log(res); var num = 12 // 转成16进制 var res = num.toStri
2022-03-20 23:32:58
328
原创 JavaScript(获取时间戳)
10进制转其他进制的方法：toString 语法：10进制数字.toString(目标进制) - 返回转成目标进制后的数组，且以字符串形式显示 var num = 5 // 转成2进制 var res = num.toString(2) console.log(res); var num = 12 // 将num转成8进制 var res = num.toString(8) console.log(res); var num = 12 // 转成16进制 var res = num.toStri
2022-03-20 23:19:40
668
原创 JavaScript(Math)
Math是js内置的一个对象 console.log(Math); 我们要学习的就是Math中的属性和方法 - 这些属性和方法都是有关于数学类的操作 Math.PI - 圆周率 Math.random() - 随机数 - 重点：获取某个范围内的随机数 Math.ceil() - 向上取整 Math.floor() - 向下取整 Math.round() - 四舍五入 Math.pow() - 求次方 Math.sqrt() - 求开...
2022-03-20 22:57:18
656
原创 JavaScript(字符串)
字符串 1.字符串可以取下标，通过下标可以获取到对应的字符 2.字符串是只读数据，不能修改原字符串 3.字符串的长度：字符串.length 字符串的比较 字符串比较： 比较规则：逐字符比较，字符大小由阿斯克码决定的 排在后面的字母更大，小写字母比大写字母更大，字母比数字更大 需要记忆的阿斯克码： 数字：0~9 48~57 大写字母：A~Z 65~90 小写字母：a~z 97~122 阿斯克码：ASCII - 美国信息交换标准代码 计算机最早产生的时候，计算只能...
2022-03-20 15:54:11
888
原创 JavaScript(ES5特性)
ES:ECMAScript简称ES - ECMA公司制定的规范 ES5:ECMA语法规范第5个版本 ES5研究两个特性： 1.ES5新增的语法 - 严格模式 2.ES5新增了一些数组的方法 1.严格模式总结: 严格模式的开启： 1.在全局的最上面，添加字符串: 'use strict' 2.在局部的最上面，添加字符串: 'use strict' 严格模式的特性： 1.不允许省略var定义变量 2.不允许函数形参同名 3.不允许普通函数中的this代表window - un
2022-03-20 15:40:31
987
原创 JavaScript(数组二冒泡、选择排序，去重)
sort方法可以进行排序，要学习的这两个排序方式，是实现sort内部排序的原理 如果有一天sort方法不能用了，我们也可以手动将数组进行排序 这两种排序方式是一些算法的基础，最简单的算法 冒泡排序：每相邻的两个元素进行大小比较，排除合适的顺序 var arr = [4,3,2,1]; 需求：将arr进行升序排列 /* 冒泡原理： 3 和 2 进行比较，不符合我们规则，就交换这两个值的顺序 - 2 3 1 3 和 1 进行比较，不符合我们规则，就交换这两个值的顺序 - 2 1 3 2
2022-03-20 15:29:47
411
原创 JavaScript(数组方法)
数组方法一的增删操作： 开头添加：unshift 开头删除：shift 结尾添加：push 结尾删除：pop 在任意位置增、删、改：splice var arr = ['a', 'b', 'c', 'd', 'e', 'f'] 给数组的开头添加一个或多个元素：数组.unshift(一个值或多个值) - 返回添加以后的新数组的长度 对象的方法：对象中的键值对是一个函数 调用方式：对象.方法名() 给数组的开头删除一个元素：数组.shift() ...
2022-03-20 15:13:57
205
原创 JavaScript(基础类型与引用类型)
基础类型和引用类型 数据类型：number/string/boolean/undefined/object/function 数据类型：number/string/boolean/undefined/null/{}/[]/function 在js中没有null类型，没有数组类型，数据类型：object类型 根据每种数据类型存储方式和赋值方式的不同，将所有数据类型分成2大类： 1.基础类型：number/string/boolean/undefined/null 2.引用类型：{}/[]/.
2022-03-20 14:01:44
197
原创 JavaScript(数组一)
object - 对象类型 这种类型的数据，有3种表现形式： null - 空 {} - 俗称对象 [] - 俗称数组，也是使用一个大的内存空间来存放多个小的内存空间，大空间中的小空间之间是有顺序的 数组的定义 - 数组：Array 语法：var arr = [] var arr = new Array() - 系统提供了各种构造函数用来创建各种数据 // 数组的细节： 1.数组中存放的数据，类型是没有限制的，可以存放任意类型的数据 2.数组中小空间的编号，永远都是从0开.
2022-03-20 13:50:17
465
原创 JavaScript（作用域链）
作用域可以相互嵌套的，作用域嵌套形成的链式结果 - 作用域链 作用域链规则 1.我们在任何一个地方使用(当做值去赋值、运算、输出的时候)一个变量的时候，会先在当前使用的作用域中找变量的定义，如果找到了，就使用成功；如果没有找到，就去上一级作用域找，找到了，就使用上一级作用域的变量，如果没有找到，继续去上一级作用域找 直到全局，如果全局找到了，就使用全局变量，如果全局没有找到，报错 2.当我们在任何一个地方给一个变量赋值时，会先在当前作用域中找变量的定义，如果找到了，就给他赋值，如果没有找..
2022-03-12 10:54:58
1443
原创 JavaScript ( 预解析 )
<script> // 预解析：教如何看懂代码的执行过程 // js的执行过程： /* 1.解析 - 预解析 2.执行 - 然后，代码按照预解析的结果顺序执行 */ // 预解析具体在做什么？ /* 就在所有代码中找变量的定义和函数的定义(非赋值式函数)。找到之后，将变量的定义和函数的定义提升到所有代码的最前面 */ // function fn() { // } // demo var a = 4; console.log(a); a = 6; ...
2022-03-10 21:02:07
902
原创 JS （if条件中的细节）
<script> // if(条件) { // 当条件为true的时候执行的代码段 // } // if(!isNaN(123)) { // console.log('这是个数字'); // } // if(false) { // console.log('假的'); // } else { // console.log('真的'); // } // 任何内容都可以放在小括号中，会有一个隐形的类型转化，最终都转化为布尔值了 if(0) { console.
2022-03-08 19:34:41
236
原创 JavaScript (比较关系：相等与全等）
<script> var a = 1 var b = '1' // // 相等 == // // 直接比较值是否相等，不比较类型 var c = a == b console.log(c); // // 全等 === // // 先比较类型是否相等，然后如果类型不相等的话，直接就得到false结果了，如果类型相等了，再比较值是否相等 var d = a === b console.log(d); </script> ...
2022-03-08 10:55:16
436
原创 让 div 水平并垂直居中（方法 1~6）下
方法五 给父标签tent-alian:center；line-height：父标签的高；给子标签display：inline-block;vertical-align：middle；给予标签旁边添加空span 方法六 <style> .small { width: 100px; height: 100px; background-color: #f00; grid-area: a; } ...
2022-03-02 20:56:42
126
原创 让 div 水平并垂直居中 定位
<style>. 方法四 box4{ width: 300px; height: 300px; border: 2px solid green; /* background-color: pink; */ /* margin: 100px auto; */ /* 相对定位 */ position:...
2022-03-02 20:54:35
169
原创 HTML(让 div 水平并垂直居中)
<style> body { margin: 0; height: 5000px; } 方法一 .box1 { width: 300px; height: 300px; background: orange; /* position: absolute; */ ...
2022-03-02 20:52:30
141
原创 CSS清除浮动方法二
方法二 在浮动元素的清标签的伪元素选择器：after中清除浮动 - 类似于空div <style> .box1 {width: 100px;height: 100px;background-color: #f00;float: left;} .box2 {width: 200px;height: 200px; background-color: #0f0;} .box:after { ...
2022-03-02 14:52:23
111
原创 CSS 清除浮动（方法一）
方法一：给收到浮动影响的元素添加overflow：hidden 因为overflow属性会触发BFC ( BFC : block formatting centent 块级格式上下文 - 让元素强制的规则机子那个排列） <style> .box { overflow: hidden; } .small { width: 100px; height: 100px; float: le...
2022-03-02 14:45:12
106
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人