07 2021 档案

(二) const的本质
摘要：2. const const主要用于定义常量 // 对于基本类型 const p = 100 p = 200 // TypeError: Assignment to constant variable // 对于引用类型 const obj = {name: '猫13'} obj.name = '猫 阅读全文
posted @ 2021-07-30 08:08 只猫 阅读(119) 评论(0) 推荐(0)
ES6一些内容的简单理解
摘要：对ES6学习的笔记总结 (一) es6中的暂时性死区 (二) const的本质 (三) 数组_字符串_对象新特性 (四) Set和Map (五) 箭头函数 (六) Iterator 迭代器 (七) class类 (八) class中的继承 (九) Promise异步编程 (十) Generator函 阅读全文
posted @ 2021-07-29 21:36 只猫 阅读(148) 评论(0) 推荐(0)
(一) es6中的暂时性死区
摘要：简单理解暂时性死区 暂时性死区:Temporal Dead Zone 简称 TDZ 在ES6中, 引入了 let 和 const 两个新的命令, 并且使用这两个命令定义的变量不存在变量提升, 且使用let和const声明变量之前, 该变量都是不可用的, 这在语法上被称为 暂时性死区 console. 阅读全文
posted @ 2021-07-29 21:35 只猫 阅读(1182) 评论(0) 推荐(0)
(十八) 函数柯里化的简单理解
摘要：例子理解 工藤新一被人下药 (柯里化处理) 变成了小孩子柯南, 相当于小身体 (外部function) 里有个大灵魂 (内部function) (形成闭包将灵魂囚禁) , 当需要指正犯人的时候, 小柯南需要一个帮手毛利小五郎 (外部函数参数), 但是有时候难免露出马脚会被小兰察觉, 于是这时候小柯南 阅读全文
posted @ 2021-07-29 21:21 只猫 阅读(120) 评论(0) 推荐(0)
(十七) bind()方法
摘要：1. bind()方法 bind()方法和call() / apply()方法一样, 都是用来改变函数中的this指向 只不过bind()只改变this指向, 不执行当前函数, 类似预先改变this function.bind(thisArg, arg1,arg2,...), 参数说明: thisA 阅读全文
posted @ 2021-07-29 21:20 只猫 阅读(595) 评论(0) 推荐(0)
(十六) apply()方法及其实现
摘要：1. apply()方法 apply()方法与call()方法用法完全一致, 唯一的区别就是参数的不同 function.apply(thisArg, arrayArgs) thisArg: 在 function 函数运行时使用的 this 值 arrayArgs: 是一个参数数组 示例 var o 阅读全文
posted @ 2021-07-29 21:19 只猫 阅读(400) 评论(0) 推荐(0)
(十五) call()方法及其实现
摘要：1. call()方法 MDN给出的解释为: call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。 function.call(thisArg, arg1, arg2, ...) , 其接受的参数如下: 第一个参数是 thisArg, 即:在 function 函 阅读全文
posted @ 2021-07-29 21:18 只猫 阅读(1197) 评论(0) 推荐(0)
(十四) js中的数组相关方法
摘要：类数组对象 类数组定义 拥有length属性，其它属性（索引）为非负整数（对象中的索引会被当做字符串来处理） 不具有数组所具有的方法； 常见的类数组有: arguments对象 DOM方法的返回结果。比如 document.getElementsByTagName() 字符串 arguments对象 阅读全文
posted @ 2021-07-29 21:15 只猫 阅读(88) 评论(0) 推荐(0)
(十三) 性能优化CRP
摘要：一. 什么是CRP 前端性能优化核心处理思想: CRP CRP: Critical Rendering Path, 关键路径渲染, 就是了解浏览器渲染的每个环节, 然后针对每个环节进行优化 因此可以通过分析我们输入url并敲回车以后发生的具体细节来进行优化 二. 分析url访问过程来看性能优化 1. 阅读全文
posted @ 2021-07-28 00:06 只猫 阅读(252) 评论(0) 推荐(0)
(三) rem布局
摘要：1. 什么是rem rem是CSS3新增的一个相对单位（root em，根em） 类似于em，em是相对父元素字体大小 不同的是rem的基准是相对于html元素的字体大小 /* 根html 为 12px */ html { font-size: 12px; } /* 此时 div 的字体大小就是 2 阅读全文
posted @ 2021-07-27 17:55 只猫 阅读(179) 评论(0) 推荐(0)
(八) flex布局
摘要：一. flex布局原理 flex是flexible box 的缩写. 意味 弹性布局, 任何一个容器(无论行还是行内)都可以指定为flex布局 当为父盒子设置flex后, 子元素的 float、clear、vertical-align 属性将失效 采用 flex布局的元素叫 容器 , 其所有子元素称 阅读全文
posted @ 2021-07-27 17:40 只猫 阅读(211) 评论(0) 推荐(0)
(四) css3相关内容总结
摘要：(一) css3选择器 (二) css3之2D转换 (三) rem布局 阅读全文
posted @ 2021-07-27 17:34 只猫 阅读(35) 评论(0) 推荐(0)
(二) css3之2D转换
摘要：1. 位移 translate transform: translate(x, y) 如果只往一个方向移动, 则另一个要设置为0 也可以单独设置 translateX / translateY @注意: 不影响其他元素 百分比单位是相对于自身的大小的百分比 对行内元素没有效果 使用: 定位的盒子可以 阅读全文
posted @ 2021-07-27 17:31 只猫 阅读(86) 评论(0) 推荐(0)
(一) css3选择器
摘要：1. 属性选择器 根据元素的属性进行选择 示例 /* 1.选择所有带有 day 属性的元素 */ [day] { width: 200px; height: 200px; background-color: pink; } 2. 结构伪类选择器 当子元素标签一致时, 用哪个都一样 但是如果子元素不一 阅读全文
posted @ 2021-07-27 17:29 只猫 阅读(98) 评论(0) 推荐(0)
(三) html5相关内容总结
摘要：1. html5新特性 阅读全文
posted @ 2021-07-27 17:24 只猫 阅读(39) 评论(0) 推荐(0)
html5新特性
摘要：1. 新增语义化标签 header 头部 nav 导航 aside 侧边栏 section 块级 article 内容 footer 底部 语义化标签，在移动端支持比较友好 2. 多媒体音频标签 1. audio 音频 多媒体标签有两个，分别是 音频 -- audio 视频 -- video aud 阅读全文
posted @ 2021-07-27 17:21 只猫 阅读(70) 评论(0) 推荐(0)
前端学习记录
摘要：仅为自己前端学习过程中的笔记总结, 如果错误, 还请指正~ (一) html相关知识总结 (二) css相关知识总结 (三) html5相关内容总结 (四) css3相关内容总结 (五) JavaScript内容总结 (六) ES6一些内容的简单理解 阅读全文
posted @ 2021-07-27 17:08 只猫 阅读(102) 评论(0) 推荐(0)
(二) css相关知识总结
摘要：(一) css基础知识 (二) css盒子模型 (三) css浮动 (四) css定位 (五) css属性书写顺序 (六) css的一些技巧 (七) 元素居中 (浮动元素、定位元素等等) css中的z-index 定位叠放次序 (八) flex布局 阅读全文
posted @ 2021-07-27 17:06 只猫 阅读(55) 评论(0) 推荐(0)
(七) 元素居中 (浮动元素、定位元素等等)
摘要：都是按照 水平垂直居中 写的, 单方向居中的原理一样 浮动和定位的元素无论有没有宽高都可以 1. 浮动元素 元素设置浮动之后, 其本身就相当于设置了display:inline-block 1.1 relative + translate 浮动的元素: { position: relative; l 阅读全文
posted @ 2021-07-27 17:01 只猫 阅读(102) 评论(0) 推荐(0)
(六) css的一些技巧
摘要：1. 元素的显示与隐藏 1.1 display * display: none; 隐藏元素 display: block; 显示元素 注: 隐藏以后, 原位置不再保留 实际开发场景： 配合js做特效，比如下拉菜单，原先没有，鼠标经过，显示下拉菜单， 应用极为广泛 1.2 visibility vis 阅读全文
posted @ 2021-07-27 16:57 只猫 阅读(59) 评论(0) 推荐(0)
(一) html相关知识总结
摘要：(一) html常用标签 (二) html元素显式模式 阅读全文
posted @ 2021-07-27 16:51 只猫 阅读(41) 评论(0) 推荐(0)
(二) html元素显式模式
摘要：web标准 由结构, 表现, 行为三部分组组成 结构: 用于对网页元素进行整理和分类, 主要指html 表现: 用于设置网页元素的版式, 颜色,大小等外观样式, 主要指css 行为: 指网页模型的定义及交互的编写, 主要指js HTML 元素显示模式 块级元素、行内元素、行内块元素 1. 块级元素 阅读全文
posted @ 2021-07-27 16:46 只猫 阅读(137) 评论(0) 推荐(0)
(十二) 简单理解 js设计模式之单例模式
摘要：1. 什么是单例模式 单: 单一, 一个 例: 实例 所谓的单例, 就是指一个类只有一个实例, 不管你 new 多少次, 都是这一个实例 具体的实现思路就是: 先判断实例是否存在 如果存在则直接将实例返回 如果不存在, 就创建了再返回 先看一个普通的实例化 function Person() { t 阅读全文
posted @ 2021-07-27 14:42 只猫 阅读(259) 评论(0) 推荐(0)
(十一) js中对象创建的方式
摘要：个人想法: 对于面向对象编程的实现方式, 无论是 像java python c++等语言中的类,或者说js中的原型继承, 说到底都只是一种实现方式而已, 就像下雨天可能绝大多数人的习惯是打伞, 但是我穿雨衣也同样可以, 好与不好因人而异, 因需求而异 1. 通过字面量的方式 var person = 阅读全文
posted @ 2021-07-27 14:37 只猫 阅读(91) 评论(0) 推荐(0)
(十) js事件循环 Event Loop
摘要：一、JavaScript是单线程 JavaScript语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。那么，为什么JavaScript不能有多个线程呢？这样能提高效率啊。 JavaScript的单线程，与它的用途有关。作为浏览器脚本语言，JavaScript的主要用途是与用户互动，以及操 阅读全文
posted @ 2021-07-27 11:38 只猫 阅读(121) 评论(0) 推荐(0)
(九) js继承模式的简单理解
摘要：1. 有关原型链 **四句话: ** 每个函数都有一个 prototype 属性, 指向一个对象, 这个对象我们称之为 原型对象 原型对象中有一个属性 constructor, 指向该原型对象的构造函数 每个对象都有一个 __proto__ 属性 对象的 __proto__ 属性指向其构造函数的 p 阅读全文
posted @ 2021-07-27 11:34 只猫 阅读(111) 评论(0) 推荐(0)
对于JavaScript的简单理解
摘要：JavaScript部分内容的简单理解 (一) js中的执行上下文 (二) js中的作用域链 (三) js中的闭包 (四) js中的防抖和节流 (五) js中的深浅拷贝 (六) js中的原型与原型链 (七) 深入理解js中的原型与原型链 (八) 简单理解js中的this指向 (九) js继承模式的简 阅读全文
posted @ 2021-07-26 14:30 只猫 阅读(426) 评论(0) 推荐(0)
(八) 简单理解js中的this指向
摘要：this指向问题 this的行为有时候会显得极其诡异，让人感到困惑，但只需要记住 this的值要等到代码真正执行时才能确定 同时this的值具体有以下几种情况： new 调用时指的是被构造的对象 call、apply调用，指向我们指定的对象 对象调用，如执行obj.b()，this指向obj 默认的 阅读全文
posted @ 2021-07-26 14:20 只猫 阅读(141) 评论(0) 推荐(0)
(七) 深入理解js中的原型与原型链
摘要：通过一些问题引发的思考 1. instanceof判断的本质 表达式: A instanceof B 我们都知道: instanceof 用作判断某个对象是否是某个对象类型的实例 当我们弄懂了原型链之后, 再来看这句话: 谁是谁的实例, 也就是说~~前者的__proto__属性的值是后者的proto 阅读全文
posted @ 2021-07-26 14:19 只猫 阅读(137) 评论(0) 推荐(0)
(六) js中的原型与原型链
摘要：导言 函数也是对象, 所以当我们提到 函数或构造函数 时, 要能想到这一点 1. 原型 (prototype) 1.1 函数的prototype属性 每个函数都有一个 prototype属性 , 它默认指向一个 空, 的Object对象 (称为原型对象) 注: 这里的 空, 是说没有我们自定义的属性 阅读全文
posted @ 2021-07-26 14:15 只猫 阅读(164) 评论(0) 推荐(0)
(五) js中的深浅拷贝
摘要：无论是深拷贝还是浅拷贝都是创建一个新的对象 1. 浅拷贝 浅拷贝是创建一个新对象, 这个对象有原始对象属性值的一份精确拷贝. 如果属性是基本类型, 拷贝的就是基本类型的值, 如果属性时引用类型, 拷贝的就是内存地址 function shallow(obj) { if (typeof obj !== 阅读全文
posted @ 2021-07-26 14:11 只猫 阅读(146) 评论(0) 推荐(0)
(四) js中的防抖和节流
摘要：1. 防抖函数 为什么需要防抖 先看这样一个例子: 我们需要根据用户的输入来想后台请求不同的数据 但是如果不设置某种规则, 而是当用户输入一个字符就发送一次请求, 这对于服务器的压力无疑是巨大的 // 需求: 获取用户输入的内容, 并返回相应的结果 var input = document.quer 阅读全文
posted @ 2021-07-26 14:10 只猫 阅读(293) 评论(0) 推荐(0)
(三) js闭包
摘要：1. 案例引入 先看一个简单的需求: 我们想要实现一个简单的累加器, 每调用一次累加函数, 变量就加 1 这真的是一个简单的需求, 我们可以立马写出来 var counter = 0 function addCounter(){ counter++ console.log(counter); } a 阅读全文
posted @ 2021-07-26 14:04 只猫 阅读(207) 评论(0) 推荐(0)
(二) js作用域链
摘要：1. 作用域 作用域是指程序源代码中定义的范围 作用域规定了如何设置变量，也就是确定当前执行代码对变量的访问权限 JavaScript采用词法作用域，也就是静态作用域 1.1 词法作用域 所谓词法作用域, 是指函数的作用域在函数的定义时就已经确定了 示例 var value = 1; functio 阅读全文
posted @ 2021-07-26 13:59 只猫 阅读(472) 评论(0) 推荐(0)
(一) js执行上下文
摘要：1. 执行上下文 执行上下文 (上下文), 其实就是js代码运行时所处的环境 简而言之: 上下文就是一个运行时环境 我们知道, js中的变量有全局变量和局部变量之分 全局变量: 定义在 全局环境 局部变量: 定义在 函数内部 只有有了全局环境, 才能有函数环境 对于全局环境, 我们又称之为 全局上下 阅读全文
posted @ 2021-07-26 13:57 只猫 阅读(946) 评论(1) 推荐(0)