- 博客(72)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 React Hook要点笔记
文章目录使用规则state hookuseReducer和useContextcontexteffect hookuseCallbackuseMemouseRef 保存引用值useLayoutEffect自定义hookhook 是有状态的函数.使用规则只在最顶层使用 Hook不要在循环，条件或嵌套函数中调用 Hook只在 React 函数中调用 Hook不要在普通的 JavaScript 函数中调用 Hookstate hook和class component相比，state hoo
2020-08-12 11:09:14
395
1
原创 Redux学习笔记
Redux基本概念storestore管理整颗状态树。状态树是一个大的对象，有一颗颗state节点构成。 它提供了dispatch、getstate、subscribe这些方法来管理整个状态。 store通过 createStore(reducer, initialState, middleware)来创建。 store.getState()返回state对象。d...
2018-04-06 16:59:53
484
原创 React学习笔记（一）基础
最近又看了一遍react的文档，对上面的一些关键信息记录了一些笔记。主要是一些基础~jsx语法在JS里写HTML结构。html可以存成变量。多个并列的html要在外面包一层()。 涉及的基本库有 react和react-dom。作用分别如下： react 基本库，比如下面的方法：React.createClass({ render: function () {}...
2018-04-03 22:51:11
389
原创 什么是viewport?
本文是看了PPK大神等的文章后总结的，基本还是搬砖吧。对于viewport 的认识比之前清晰了很多，希望对别的小伙伴也有帮助。PC端先来说说PC端的视口吧。在PC端，就一个视口，即浏览器窗口的大小。页面的大小和浏览器窗口的大小相等。CSS中的像素和浏览器屏幕的像素一一对应。如果还不明白什么是分辨率、屏幕尺寸、PPI，可以看这篇文章： （全解析）屏幕尺寸，分辨率，像素，PPI之间到底什么关系？还需要
2017-05-15 11:01:47
2496
原创 《高性能JS》学习笔记
脚本阻塞一些知识无论是对于内联的JS还是外部文件，页面的渲染和交互都会阻塞，等待JS的下载和执行。现在多数浏览器都能对多个JS文件进行并行下载，但是会阻塞其他类型资源的下载。必须等待JS完全下载并执行完后才能进行其他资源的下载。如果将内嵌脚本放到link样式文件之后，脚本为了在执行的时候获取精准的样式信息，会等待样式表下载完成，这样造成了页面阻塞。因此，不要把内嵌脚本放到link标
2017-04-27 18:26:01
447
原创 Express学习笔记
Express 应用程序基本上是一系列中间件函数调用。 中间件函数能够访问请求对象 (req)、响应对象 (res) 以及应用程序的请求/响应循环中的下一个中间件函数。下一个中间件函数通常由名为 next 的变量来表示。如果当前中间件函数没有结束请求/响应循环，那么它必须调用 next()，以将控制权传递给下一个中间件函数。否则，请求将保持挂起状态。resonse对象可以发送字符串、对
2017-02-24 10:31:49
525
原创 JS高级程序设计笔记（六）- 函数
声明提升使用function 进行声明的函数具有声明提升的特性，因此可以在进行函数声明之前调用。但是通过var func = function(){} 这样的函数表达式声明的方法，则不可以。调用时会返回undefined。闭包首先来看看当调用一个函数时发生了什么。 当调用一个函数时，会创建一个执行环境和作用域链（作用域链赋值给执行环境内部的[scope]属性）。之后，this 、arguments
2017-02-23 09:56:47
453
原创 BOM学习
window对象window对象充当浏览器中的global对象。所有全局声明的变量和函数都自动归为window对象的属性和方法。但这样的属性不能通过delete 删除，除非显示地声明成window的属性：window.XXX此外，访问未声明的变量会报错，但是访问不存在的属性就不会，只会返回undefined ，因此，可通过window.xxx 来判断某个全局变量是否声明了。frame每一个框架都有自
2017-02-16 09:51:02
683
原创 ajax与跨域
原生的ajax实现方式是通过XMLHttpRequest对象来实现的，该对象包含了一些方法来进行请求的发送、监听请求过程中的状态、接收响应内容等：var xhr = new XMLHttpRequest();xhr.onReadyStateChange = function() { if (xhr.readyState === 4) { //不使用this更靠谱 if(xh
2017-02-08 15:23:25
426
原创 webpack使用教程（一）
这篇博客是自己看了一些别人写的文章或是参考官方文档后整理的。算是笔记类的吧。对于webpack的使用我分成了两个部分来写，在这篇博客中主要是对webpack的基本概念、使用方法进行说明。在下一篇博客我会对在一个项目中具体怎么应用进行说明。webpack简介webpack是一种模块化方案，将JS、CSS和图片等资源都当做模块来处理。提供一个入口文件，它会把该文件以及该文件所依赖的其他模块都打包成一个文
2017-01-03 15:55:09
2831
原创 JS权威指南学习笔记-浏览器中的JS
多个页面共享JS文件，实际上只会下载一次，其他的页面会从浏览器缓存中获取。脚本的执行默认是同步和阻塞的，当HTML解析器遇到script 标签时，必须先加载、执行完脚本后才会继续文档的解析和渲染。defer脚本的执行会阻塞页面的渲染，因此，在简单的开发中可以将脚本放到文档结束的位置，来避免空白的出现。然而defer属性为我们提供了另一种解决办法，它的意思是延迟脚本的执行，即便把脚本放在head 部分
2016-11-22 22:19:18
798
原创 node
node包：SuperAgentajax请求库，链式调用。cheerionode端的Jqueryeventproxy控制并发请求流程。async控制异步请求并发数目。 当你需要去多个源(一般是小于 10 个)汇总数据的时候，用 eventproxy 方便；当你需要用到队列，需要控制并发数，或者你喜欢函数式编程思维时，使用 async。
2016-11-22 10:42:47
365
原创 《重构-改善既有代码的设计》笔记
函数如果函数过长或者内部需要添加注释，就把它提炼出来以成一个命名良好的函数。函数名来替代注释。提炼函数的难点在于对局部变量的处理。函数粒度越小被复用的机会越大。 函数名称和函数内容的语义距离要贴近。
2016-11-21 15:36:38
810
原创 git学习
文件状态tracked和untracked，后者属于在版本库中没有快照的，当运行git add 后文件放到了暂存区，变成tracked状态，当commit 后，文件此刻的版本会在版本库中形成记录。git diffgit diff：用于查看工作区和暂存区间的差异 git diff --cached 或git diff --staged 用于查看暂存区中的内容。 git diff HEA
2016-11-18 15:27:45
501
原创 babel学习
.babelrc文件babel可以将ES6编写的代码转码成你所需要的编码格式。前提是要指定希望的转码方式，即指定要用的插件并安装（否则babel什么也不做，输出源码）。可以在.balbelrc 中进行指定：{ "presets": ["es2015"], "plugins": ["transform-es2015-modules-umd"]}presets 表示一组插件构成的集合，
2016-11-15 16:47:53
1678
原创 JS异步编程（promise、deferred对象）
本文主要是阅读了几篇文章之后整理出来的笔记。需要弄清楚的几个概念：首先要明白JS本身是单线程的，在处理一个任务的时候不可能去处理别的任务。也就是单凭JS是不可能异步编程的，必须借助一些别的机制。另外，浏览器是多线程的，例如HTTP请求线程、定时器线程、事件处理等…其次搞清回调函数是什么： 如果希望一个操作将来再执行，可以将其放到回调函数中，再在合适的时候触发回调函数。 回调函数
2016-11-03 11:15:29
11520
原创 requireJS学习笔记
AMD、CMD与commonJSrequireJS实现了AMD规范，即异步加载模块，模块加载的时候不会阻塞后续代码的执行，将模块加载完后的操作（依赖该模块的程序）放到回调函数中进行。这种规范适合于浏览器端。例如：require(['module1', 'module2'], function(mod1, mod2) { //do something; //当module1/2加载完后会执行该
2016-10-17 11:10:43
486
原创 字符集和字符编码
我们在网页上看到的文字实体在计算机中是以二进制来进行存储的，在计算机进行磁盘的读写时，需要对实体文字和二进制进行转换，因此我们需要有规则来规定每个实体文字存储在计算机中是怎么样的。 有这样三个与字符编码相关的概念： 字库表： 包含了实体的文字 编码字符集： 指定了每个实体文字在字库表中的位置。例如ASCII，Unicode等就是字符集，前者主要用于英文等西方文字，后者几乎
2016-10-11 14:57:46
454
原创 理解回调函数
1.回调函数的作用域 回调函数作为参数传递给某个函数，因此回调函数和某个函数应该是处于平级的执行环境中的，它们的外层作用域链是相同的。回调函数可以用于同步和异步。 JavaScript始终是单线程的，处理这个就不能处理别的。ajax是异步的，那是因为浏览器又开了一个线程去请求，JavaScript主线程仍然是单线程的。 JavaScript引擎是单线程运行的,浏览器无论在什么时候都只且只有一
2016-10-11 14:36:52
356
原创 E6箭头函数在哪些时候不适用
本文主要参考了When ‘not’ to use arrow functions以及箭头函数中this的用法先搞清楚this在箭头函数和普通函数中的区别：箭头函数的this值是在定义的时候就已经确定好了。而不是动态指定的。普通函数的this值是运行时确定的。 Arrow Function是 Lexical scoping, this指向定义Arrow Function时外围, 而不是运行时的对象。
2016-10-09 14:41:12
3122
原创 JS高级程序设计笔记（五）：引用类型
Function函数名就是函数体的引用。可以将函数名作为参数传递给另一个函数，也可以在一个函数内部返回另一个函数，以便在函数体外调用。例如Array.prototype.sort接收一个函数作为参数，该参数规定了比较的规则，如果我们想对数组中的对象按照某个属性来进行排序，可以这样做：function compareByProperty(property) { return func
2016-10-09 10:54:39
416
原创 JS高级程序设计笔记（四）：类和继承
一些方法Person.prototype.isPrototypeOf(实例); //返回布尔值Object.getPrototypeOf(实例); //返回原型对象实例.hasOwnProperty(属性名) ;返回布尔值for in 和 in会访问实例和原型属性；for in只遍历可枚举属性Object.keys(o)返回可枚举实例属性名组成的数组，与for in中出现的顺序一致。...
2016-09-28 10:01:45
657
原创 JS高级程序设计（三）：引用类型
Array的sort()方法是对数组元素应用toString()方法后比较字符串。因此，可以向sort传入一个比较函数作为参数，以确定比较的规则。indexOf和lastIndexOf方法在进行比价时使用的是===
2016-09-22 10:30:26
317
原创 JS高级程序设计笔记（二）：变量、作用域和内存
JS中的参数传值都是按值来传递，如果是基本类型的值，则值会复制一份给命名参数/arguments对象；引用类型的值会把该值在内存中的地址复制一份给参数/arguments对象，因此该局部变量（函数的参数实际上是一个局部变量）的变化会反应在函数外部，即操作的是同一个对象。全局变量在使用完毕后最好进行引用解除，即obj = null。以便垃圾收集器在下次运行的时候回收内存。访问一个未声明的变量会报错
2016-09-14 15:10:19
394
原创 JS高级程序设计笔记（一）-数据类型
对未声明和未初始化的变量执行typeof都会返回undefined。不能给基本类型数据添加属性。变量应当尽量初始化，如果一个变量是用来保存对象的，如果还没有明确的对象，则应当初始化为null。parseInt和Number的区别：var str = "123true";parseInt(str); //123Number(str); //NaNvar str = "";pars
2016-09-13 14:23:02
416
原创 JS高级技巧笔记
使用Object.prototype.toString.call(value)区分数据类型使用typeof检测，只能区分基本类型的具体类型，而对于引用类型只能统一返回object。而使用Object.prototype.toString.call(value)能够确切返回基本、引用类型的数据的具体类型，只要这个数据的构造函数是原生而非自定义的。 官方文档中对这个方法的描述是： Whe
2016-05-29 11:27:35
401
原创 HTML5之存储
1.什么是web app html5+css3+javascript，而不是java、object-cHTML提供的数据持久化–离线缓存技术数据持久化就是将数据保存在本地。1. Application cache也叫应用缓存，在本地缓存应用所需要的文件，只能缓存应用本身而非应用所需的数据。 开发者可以使用 Application Cache (AppCache) 接
2016-05-29 11:24:59
465
原创 display:table、box和width百分比来均分盒子的比较(2)
boxbox适合均分内部子盒子没有边框的父盒子，否则内部盒子的边框重叠问题不太好处理，另外如果自盒子间有margin值，中间的margin会是两侧的double，这时可通过nth-child(index)来进行个别调整。 box-flex是对除开子盒子内容区、定宽子盒子之外的剩余部分进行划分，而不是把父盒子的整个宽度进行划分，因此就会造成所有子盒子都设置为box-flex：1，但因为子盒子内
2016-05-29 11:24:14
3592
原创 实践中遇到的问题总结
body在默认情况下占据了当前可视窗口的整个高度和宽度如果想让盒子中的内容垂直居中，可以让盒子的line-height和盒子的高度相等。默认情况下，盒子的高度和宽度值都是auto，但空盒子是看不见的，必须有内容才看的见，当有内容时，盒子的宽度等于父元素内容区宽度；高度需由盒子中包含的内容来撑开。如果子元素盒子定义的高度超过了父元素，父元素不会自动扩展其高度而是被子元素覆盖了。
2016-05-29 11:22:54
8611
2
原创 JavaScript中的this
通过这样的方式也可以把一个独立的函数的作用域变成一个对象：var person={ name:"anna"}function independent(){ alert(this.name);}person.func = independent;person.func();//anna原型链上的this替换为实例对象本身：var o={ f:funct
2016-05-29 11:22:00
343
原创 《JS权威指南》学习笔记（六）：函数
定义函数的两种方式一是函数声明，实际上是声明了一个变量，该变量指向函数对象； 二是函数表达式，采用该方式函数的名称是可选的，通常没有函数名，但也可以有，例如：var f = function fact(x) { if (x 1) { return 1; } else { return x * fact(x-1); }}
2016-05-15 09:49:05
545
原创 《JS权威指南》学习笔记（五）：数组
数组的读和写数组也是对象，因此通过[]访问数组元素，实际上就是通过属性名访问，[]中的会转换成字符串当做属性名来进行访问。如果[]中的是非负整数（以及和整数想相等的浮点数），则会动态改变数组元素的length属性；若不是非负整数，则会当做普通的属性名，且不会改变length值。稀疏数组指索引不连续的数组，其length值大于数组元素的个数。使用构造函数创建数组会生成稀疏数组：v
2016-05-05 20:48:10
438
原创 《JS权威指南》学习笔记（四）：对象
创建对象可以通过对象直接量或者构造函数来创建对象，此外ECMA 5还规定了一种方法 Object.create()，第一个参数为对象的原型，第二个可选参数用来对对象的属性进行进一步描述。 如果第一个参数传入null，则对象不继承任何东西，连最基础的例如toString()也没有，因此想创建一个普通空对象，可以传入参数Object.prototype。为了防止代码无意间修改不受控制的对象A，可
2016-04-19 19:54:57
564
原创 《JS权威指南》学习笔记（三）：表达式和运算符
evalJavaScript会解析并执行传入eval的字符串，eval使用了调用它的变量作用域环境。直接使用eval时，它总是在调用它的上下文作用域内执行； 通过别名间接调用则使用全局对象作为上下文作用域，无法读、写、定义局部变量和函数，这使得函数内部的变量不会受到影响。在严格模式下，eval执行的代码可以查询或更改局部变量，但不能在局部作用域中定义新的变量或函数。
2016-04-18 17:13:53
398
原创 《JS权威指南》学习笔记（二）：语句
声明语句用var声明的全局变量作为全局对象的属性，但和其他全局属性不同的是不能通过delete删除。函数声明的两种方式：function声明： function func() {};使用表达式声明：var func = function() {};前者的func函数名是一个变量名，指向函数体。由于声明提升的作用，如果使用第一种方式，则在定义函数前进行函数调用不会报错；而后者由于初
2016-04-18 17:13:17
328
原创 《JS权威指南》学习笔记（一）：类、值和变量
数字JavaScript中没有整数和浮点数之分，均为浮点数。NaN和任何数都不相等，包括自身。包括JavaScript在内的多数编程语言，采用二进制浮点数，能够精确表示1/2、1/1024等分数，但不能精确表示类似0.1等的数字。通常计算结果能够满足大多数要求，只是在判断==时可能会返回false。字符串字符串中的字符采用Unicode字符集，常用的Unicode字符由1
2016-04-16 15:33:51
720
原创 垂直和水平居中方法小结
水平居中行内元素text-align:center;块元素1.定宽块元素水平居中 margin:0 auto;2.不定宽块元素水平居中方法一：利用浮动的包裹性和百分比相对定位<div class='outer'> <div class='inner'></div></div>我们想要使inner(不定宽)水平居中于outer，可以这么做： 先在inner外面再加一层div:<div cla
2015-10-14 12:25:28
1229
1
原创 JavaScript中的跨域学习
什么是跨域来看看一个url地址： http://www.baidu.com:8080/scripts/jquery.js 它包含如下几个部分：协议：http子域名：www.主域名：baidu.com端口号：8080请求的资源：scripts/jquery.js当协议、子域名、主域名和端口号中任何一个不相同时都是不同域，不同域间相互请求资源称作跨域。跨域技术XHR对象通常只能访问与包含
2015-10-14 11:41:50
1331
原创 CSS3 box学习笔记
CSS3提供的盒子样式可实现对盒子内部元素的弹性布局，我们就不用使用float或者display：inline来使块元素横向排布（box-orient可以做到），或者计算每个块的宽度or百分比来实现均分（box-flex可做到）。so，大胆地用吧妹纸。对父元素设置display:box，可对内部的块级子元素进行布局，此时，内部的元素按照内联元素的排列方式，但可以设置宽和高。对父盒子使用如下的样式：1
2015-09-21 11:04:59
1015
原创 Json学习笔记
Json是一种轻量级的数据格式，使用了JavaScript语法的子集表示简单值（数字、字符串、布尔值）、null、对象（表示一组键值对）和数组，不支持变量、函数、对象实例。可将Json数据结构解析为JavaScript对象（而XML数据结构需要解析为DOM文档更麻烦）。也可将JavaScript对象转换为可随请求发送的数据（字符串，Ajax适合将纯文本内容发送给服务器）。即可方便地使对象和字符串自由
2015-09-09 15:49:45
602
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人