- 博客(57)
- 收藏
- 关注
RSS订阅原创 配置flutter环境遇到的那些坑
flutter安装我是直接使用flutter中文社区（https://flutter.cn/docs/get-started/install）中的安装包和教程进行安装的，macOS big sur环境下载和安装过程中没有遇到太大问题，主要的遇到的问题就是因为众所周知的网络原因，无法下载对应包的问题Running “flutter pub get” in myapp 一直没反应主要原因是社区里配置环境变量的方法不好使，还是需要在配置文件里写进去才好用，在用户目录下的.zshrc文件里把环境变量都放进去
2021-01-08 18:16:55
887
1
原创 React Diff算法
Diff 算法背景在某一时间节点调用 React 的 render() 方法，会创建一棵由 React 元素组成的树。在下一次 state 或 props 更新时，相同的 render() 方法会返回一棵不同的树。React 需要基于这两棵树之间的差别来判断如何有效率的更新 UI 以保证当前 UI 与最新的树保持同步。这个算法问题有一些通用的解决方案，即生成将一棵树转换成另一棵树的最小操作数。 然而，即使在最前沿的算法中，该算法的复杂程度为 O(n3)，其中 n 是树中元素的数量。如果在 React
2020-07-30 21:20:26
360
原创 14.Proxy
概述Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器”。Proxy 实际上重载（overload）了点运算符，即用自己的定义覆盖了语言的原始定义。var proxy =
2020-07-30 20:05:56
242
原创 react-reudx的使用
1.redux原理及简单使用a.为什么使用redux？redux解决的问题是组件状态的管理。在使用redux之前，我们进行组件之间的通讯时都是使用props进行传递，之后有了Context API，可以使得我们不再对数据进行层层传递，但是还是需要对每个组件的状态（state）进行管理，整体依然是混乱的。redux的核心之一就是将每个组件的state抽离出来，放在一起，使得一个app只有一个state，存放在store中，任何一个组件需要获取数据的时候，都可以从同一个state中获得，这样首先
2020-07-30 11:10:17
459
原创 React Context API 入门
一、Context API入门react版本16.13.11.context的作用react中通过属性自上而下传递数据，但如果需要穿透多层组件传递数据，则需要在每层的组件都传递props属性，非常繁琐。context解决的就是穿透中间组件传递数据。 使用props传递数据 使用context传递数据 使用context可以在最顶层（数据获取位置）创建Provider，就可以在这个组件之后的所有子组件中随时调用context中的数据，同时当context中的.
2020-07-30 11:05:18
481
原创 第十二章 DOM2和DOM3
DOM变化isSameNode()和 isEqualNode()。这两个方法都接受 一个节点参数，并在传入节点与引用的节点相同或相等时返回 true。所谓相同，指的是两个节点引用的 是同一个对象。所谓相等，指的是两个节点是相同的类型，具有相等的属性（nodeName、nodeValue， 等等），而且它们的 attributes 和 childNodes 属性也相等（相同位置包含相同的值）。v...
2020-04-13 23:48:03
205
原创 CSS语法
CSS 的顶层样式表由两种规则组成的规则列表构成，一种被称为 at-rule，也就是 at 规则，另一种是 qualified rule，也就是普通规则。@ruleat-rule 由一个 @ 关键字和后续的一个区块组成，如果没有区块，则以分号结束。这些 at-rule 在开发中使用机会远远小于普通的规则@charset 用于提示 CSS 文件使用的字符编码方式，它如果被使用，必须出现在最前...
2020-04-11 16:57:19
440
原创 HTML语义
div和span不是够用了吗？对于语义化标签，“用对”比“不用”好，“不用”比“用错”好。当然了，我觉得有理想的前端工程师还是应该去追求“用对”它们。可以提高代码可读性，优化搜索引擎，优化屏幕阅读器使用作为标题摘要的语义类标签h1-h6标签可以对文档的结构有一个简单的表示h1-h6 是最基本的标题，它们表示了文章中不同层级的标题。有些时候，我们会有副标题，为了避免副标题产生额外的一个层级...
2020-04-09 17:44:46
167
原创 第十一章 DOM扩展
选择符 APISelectors API Level 1的核心是两个方法：querySelector()和 querySelectorAll()。在兼容的浏 览器中，可以通过 Document 及 Element 类型的实例调用它们。querySelector()方法querySelector()方法接收一个 CSS选择符，返回与该模式匹配的第一个元素，如果没有找到匹 配的元素，返回 nul...
2020-04-08 23:55:54
168
原创 13.Set 和 Map 数据结构
SetSet本身是一个构造函数，用来生成 Set 数据结构。通过add()方法向 Set 结构加入成员Set 结构不会添加重复的值。const s = new Set();[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));for (let i of s) { console.log(i);}// 2 3 5 4Set函数...
2020-04-08 21:37:27
192
原创 12.Symbol
ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是 JavaScript 语言的第七种数据类型，前六种是：undefined、null、布尔值（Boolean）、字符串（String）、数值（Number）、对象（Object）。目的是为了解决对象属性名冲突的问题Symbol 值通过Symbol函数生成。这就是说，对象的属性名现在可以有两种类型，一种是原来就有的字符串，...
2020-04-06 21:40:51
175
原创 发布-订阅模式
发布—订阅模式又叫观察者模式，它定义对象间的一种一对多的依赖关系，当一个对象的状 态发生改变时，所有依赖于它的对象都将得到通知。在 JavaScript开发中，我们一般用事件模型 来替代传统的发布—订阅模式。发布—订阅模式可以广泛应用于异步编程中，这是一种替代传递回调函数的方案。 比如，我们可以订阅 ajax请求的 error、succ 等事件。 在异步编程中 使用发布—订阅模式，我们就无需过多...
2020-04-06 19:53:58
219
原创 第十章 DOM
节点层次文档元素是文档的外层元素，文档中的其他所有元素都包含在文档元素中。每个文 档只能有一个文档元素。在 HTML 页面中，文档元素始终都是元素。每一段标记都可以通过树中的一个节点来表示：HTML 元素通过元素节点表示，特性（attribute） 通过特性节点表示，文档类型通过文档类型节点表示，而注释则通过注释节点表示。总共有 12 种节点 类型，这些类型都继承自一个基类型，Node类型。...
2020-04-06 17:23:45
203
原创 JavaScript语法
到底要不要写分号呢？JavaScript 语言提供了相对可用的分号自动补全规则自动插入分号规则自动插入分号规则其实独立于所有的语法产生式定义，它的规则说起来非常简单，只有三条。要有换行符，且下一个符号是不符合语法的，那么就尝试插入分号。有换行符，且语法中规定此处不能有换行符，那么就自动插入分号。源代码结束处，不能形成完整的脚本或者模块结构，那么就自动插入分号。第一条：意思是，如果...
2020-04-06 11:44:12
242
原创 迭代器模式
迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象 的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来，在使用迭代器模式之后，即 使不关心对象的内部构造，也可以按顺序访问其中的每个元素。内部迭代器和外部迭代器迭代器可以分为内部迭代器和外部迭代器，它们有各自的适用场景。内部迭代器内部已经定义好了迭代规则，它完 全接手整个迭代过程，外部只需要一次初始调用。...
2020-04-05 22:08:37
219
原创 11.对象的新增方法
Object.is() 是否相等用来比较两个值是否严格相等，与严格比较运算符（===）的行为基本一致。不同之处只有两个：一是+0不等于-0，二是NaN等于自身。+0 === -0 //trueNaN === NaN // falseObject.is(+0, -0) // falseObject.is(NaN, NaN) // true如果想通过ES5实现，只需要将以上两...
2020-04-05 21:39:07
210
原创 第九章 客户端检测
能力检测常用也为人们广泛接受的客户端检测形式是能力检测（又称特性检测）。能力检测的目标不是 识别特定的浏览器，而是识别浏览器的能力。就是判断浏览器有没有该方法或者该属性，如果有就使用，没有就调用其他方法第一，先检测达成目的的常用的特性。先检测常用的特性可以保证代码优化，因为在多数情况下都可以避免测试多个条件。第二，必须测试实际要用到的特性。。一个特性存在，不一定意味着另一个特性也存 ...
2020-04-05 20:49:10
117
原创 字典和散列表
集合、字典和散列表可以存储不重复的值。在集合中，我们感兴趣的是每个值本身，并把它 当作主要元素。在字典中，我们用[键，值]的形式来存储数据。在散列表中也是一样（也是以[键， 值]对的形式来存储数据）。但是两种数据结构的实现方式略有不同字典字典和集合很相似，集合以[值，值]的形式存储元素，字 典则是以[键，值]的形式来存储元素。字典也称作映射。实现一个字典类function Dictiona...
2020-04-05 18:30:53
676
原创 JavaScript词法
为什么12.toString会报错？12.toString()//Uncaught SyntaxError: Invalid or unexpected token这时候12. 会被当做省略了小数点后面部分的数字而看成一个整体12 .toString()// "12"要想让点单独成为一个 token，就要加入空格在12后加个空格，就可以将12和点分开，使得12作为一个数字，点现在...
2020-04-05 17:23:47
122
转载 跨域
跨域资源共享 CORS 详解http://www.ruanyifeng.com/blog/2016/04/cors.html浏览器同源政策及其规避方法http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html
2020-04-05 12:34:23
110
原创 面试题集（1）
变量声明及初始化let a = { name: 'a'}let b = { name: 'a'}a == b //falsea === b //false变量定义时，会在内存中开辟空间，让a和b指向对应地址，虽然a和b的内容相同，但他们是两个不同的对象，内存地址不同let a = { name: 'a'}let b = aa == b //truea ...
2020-04-05 12:31:56
110
原创 JavaScript执行
Promise里的代码为什么比setTimeout先执行？宏观任务和微观任务由于我们这里主要讲 JavaScript 语言，那么采纳 JSC 引擎的术语，我们把宿主（浏览器）发起的任务称为宏观任务，把 JavaScript 引擎发起的任务称为微观任务。宏观任务的队列就相当于事件循环。在宏观任务中，JavaScript 的 Promise 还会产生异步代码，JavaScript 必须保证这...
2020-04-05 12:30:12
249
原创 JavaScript类型
为什么有的编程规范要求用 void 0 代替 undefined？字符串有最大长度吗？0.1 + 0.2 不是等于 0.3 么？为什么 JavaScript 里不是这样的？ES6 新加入的 Symbol 是个什么东西？为什么给对象添加的方法能用在基本类型上？基本类型基本类型（基本数值、基本数据类型）是一种既非对象也无方法的数据。在 JavaScript 中，共有7种基本类型：st...
2020-04-05 12:29:06
180
原创 JavaScript对象
JavaScript 对象的特征对象具有唯一标识性：即使完全相同的两个对象，也并非同一个对象。对象有状态：对象具有状态，同一对象可能处于不同状态之下。对象具有行为：即对象的状态，可能因为它的行为产生变迁。一般而言，各种语言的对象唯一标识性都是用内存地址来体现的， 对象具有唯一标识的内存地址，所以具有唯一的标识。 var o1 = { a: 1 }; var o2 =...
2020-04-05 12:27:10
601
原创 迭代器和生成器
迭代器// 一个用于数组的迭代器function makeIterator(array) { let nextIndex = 0 //初始化迭代器索引，定义在return外，形成闭包 return { //返回一个有next()方法的对象 next: function () { //定义next()方法 return nextIndex ...
2020-04-05 12:26:04
84
原创 Promise
Promise 是一个对象，它代表了一个异步操作的最终完成或者失败。本质上，Promise 是一个被某些函数传出的对象，我们附加回调函数（callback）使用它，而不是将回调函数传入那些函数内部。function wait(ms) { //执行函数返回一个Promise对象 return new Promise((resolve, reject) => { //成功的回调函...
2020-04-05 12:24:46
96
原创 数组
常用方法slice() 方法slice() 方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变。参数为负数， 则它表示在原数组中的倒数第几个元素抽取开始和结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。数组的...
2020-04-05 12:23:40
82
原创 链表
单项链表类ES5写法function LinkedList() { let Node = function(element){ this.element = element; this.next = null; }; let length = 0; let head = null; this.append = fu...
2020-04-05 12:22:19
112
原创 集合
集合是由一组无序且唯一（即不能重复）的项组成的。这个数据结构使用了与有限集合相同 的数学概念，但应用在计算机科学的数据结构中。模拟ES6的set类实现/** * ECMSCRIPT 6 already have a Set class implementation: * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...
2020-04-05 12:21:38
97
原创 单例模式
**单例模式的定义是：**保证一个类仅有一个实例，并提供一个访问它的全局访问点。有一些对象我们往往只需要一个，比如线程池、全局缓存、浏览器中的 window 对象等。单例模式的核心是确保只有一个实例，并提供全局访问。实现单例模式要实现一个标准的单例模式并不复杂，无非是用一个变量来标志当前是否已经为某个类创建 过对象，如果是，则在下一次获取该类的实例时，直接返回之前创建的对象。用代理实现单...
2020-04-05 12:20:53
78
原创 代理模式
代理模式是为一个对象提供一个代用品或占位符，以便控制对它的访问。保护代理和虚拟代理代理 B 可以帮助 A 过滤掉一些请求，这种请求就可以直接在代理 B 处被拒绝掉。这种代理叫作保护代理。虚拟代理把一些开销很大的对象，延迟到 真正需要它的时候才去创建。保护代理用于控制不同权限的对象对目标对象的访问，但在 JavaScript并不容易实现保护代 理，因为我们无法判断谁访问了某个对象。而虚拟...
2020-04-05 12:20:06
72
原创 策略模式
**策略模式的定义是：**定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。一个基于策略模式的程序至少由两部分组成。第一个部分是一组策略类，策略类封装了具体 的算法，并负责具体的计算过程。 第二个部分是环境类 Context，Context接受客户的请求，随后 把请求委托给某一个策略类。要做到这点，说明 Context中要维持对某个策略对象的引用。用策略模式设计计算年终奖的...
2020-04-05 12:18:50
105
原创 第八章 BOM
window 对象全局变量不能通过 delete 操作符删除，而直接在 window 对象上的定义的属性可以。 var age = 29; window.color = "red"; //throws an error in IE < 9, returns false in all other browsers ...
2020-04-05 12:01:50
139
原创 第七章 函数表达式
函数声明和函数表达式理解函数提升的关键，就是理解函数声明与函数表达式之间的区别函数声明会提升，函数表达式则不会//不要这样做！ if (condition) { function sayHi() { alert("Hi!"); }} else { function sayHi() { alert("Yo!"); }}...
2020-04-05 12:00:23
159
原创 第六章 面向对象的程序设计
ECMAScript中有两种属性：数据属性和访问器属性。数据属性数据属性包含一个数据值的位置。在这个位置可以读取和写入值。数据属性有4个描述其行为的特性。[[Value]]：包含这个属性的数据值。读取属性值的时候，从这个位置读；写入属性值的时候， 把新值保存在这个位置。这个特性的默认值为 undefined。[[Writable]]：表示能否修改属性的值。对于直接在对象上定义的属性，默认...
2020-04-05 11:59:03
149
原创 第五章 引用类型
Object 类型在JavaScript 也可以使用方括号表示法来访问对象的属性。在使用方括号语法时，应该将要访问的属性以字符串的形式放在方括号中如果属性名中包含会导致语法错误的字符，或者属性名使用的是关键字或保留字，也可以使用方括号表示法所有对象都具有 toLocaleString()、toString()和 valueOf()方法person["first name"] = "Ni...
2020-04-05 11:57:11
110
原创 第四章 变量、作用域和内存问题
基本类型和引用类型的值只能给引用类型值动态地添加属性给基本类型添加属性不会报错，但添加后也访问不到传递参数访问变量有按值和按引用两种方式，而参数只能按值传递（复制值或指针）在向参数传递基本类型的值时，被传递的值会被复制给一个局部变量，就是 arguments 对象中的一个元素在向参数传递引用类型的值时，会把 这个值在内存中的地址复制给一个局部变量，因此这个局部变量的变化会反映在函...
2020-04-05 11:52:23
103
原创 第三章 基 本 概 念
语法ECMAScript中的一切（变量、函数名和操作符）都区分大小写关键字也区分大小写typeof是关键字，不能作为变量名，但typeOf是可以的严格模式在严格模式下，ECMAScript 3中的一些不确定的行为将得到处理，而且对某些不安全 的操作也会抛出错误。要在整个脚本中启用严格模式，可以在顶部添加如下代码："use strict";在函数内部的上方包含这条编译指示，也可以指定函...
2020-04-05 11:51:00
205
原创 10 对象的扩展
属性的简洁表示法ES6 允许在大括号里面，直接写入变量和函数，作为对象的属性和方法。属性名就是变量名, 属性值就是变量值。const foo = 'bar';const baz = {foo};baz // {foo: "bar"}// 等同于const baz = {foo: foo};function f(x, y) { return {x, y};}f(1, ...
2020-04-05 11:43:57
153
原创 9 数组的扩展
扩展运算符扩展运算符当作形参的时候，是可以将多个参数组合成一个数组传入，只能当作形参的最后一项function fn(a,...nums){ return nums.unshift(a)}扩展运算符当作实参时，可以将一个数组拆解成多个参数的形式传入函数执行，可以放在任意位置function add(a,b,c,d,e) { return a + b + c + d +...
2020-04-05 11:41:54
116
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人