大流星
[作者：HerryLo](https://github.com/HerryLo) [原文永久链接： https://github.com/AttemptWeb/Record...](https://github.com/AttemptWeb/Record/issues/4) 小程序依附于各大平台，支付宝、微信、头条、百度等小程序，都是在平台上进行开发，平台提供对应的技术支持和用户环境。对于个人开发者，这个还是蛮方便的，它本身带有流量属性，易于传播。 ## 便捷开发 最近在弄自己的小程序，所以觉得整一篇文章总结一下。如果你已经开发过小程序，同时开发过自己的小程序，这篇文章可以不用看了。如果你想开发自己的个人应用，这篇文章会很适合你。 小程序开发相当的便捷，配合官方文档，[微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/framework/)、[支付宝小程序文档](https://docs.alipay.com/mini/developer/getting-started)，即可在本地运行起来，如果只是单纯的展示，那只需要开发完之后上传，等待审核了。只需要一点前端基础，就可开发一个自己的小程序，有想法的同学可以行动起来。 如果在开发中出现问题，也可以在小程序社区求助，[微信小程序社区](https://developers.weixin.qq.com/community/develop/question)。 不是在给官方推广。如果你希望开发属于自己的应用，小程序是一个可以快速入手的方案，便捷开发，快速发布，自带传播功能。**下面我选中微信小程序讲解**。 ## 微信原生小程序开发 [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/framework/) ```javascript |—— component 组件目录 |—— pages page页面目录 | ......more dir | |—— index index页面 | | |——...
## redux解析 作者: [HerryLo](https://github.com/HerryLo) [本文永久有效链接: https://didiheng.com/front......](https://github.com/AttemptWeb/Record/issues/15) Redux是JavaScript状态容器，提供可预测化的状态管理。 在实际开发中，常搭配React + React-redux使用。这代表了目前前端开发的一个基本理念，**数据和视图的分离**。 redux应运而生，当然还有其他的一些状态管理库，如Flux、Elm等，当然，我们这里只对redux进行解析。 ## redux创建Store 创建redux的store对象，需要调用combineReducers和createStore函数，下面解释不包含中间件。 ```javascript const reducer = combineReducers({ home: homeNumber, number: addNumber }) const store = createStore(reducer) // 暂时挂载在window下，下面会使用到...
# react-redux原理解析 [本文原文链接](https://github.com/AttemptWeb/Record/issues/20) 在之前的一篇文章中已讲过[redux 原理解析](https://didiheng.com/front/2019-10-26.html)，我将```redux```返回的store对象挂载在window中，不是太懂的同学可以看看之前的[redux 原理解析](https://didiheng.com/front/2019-10-26.html)。 ```javascript const reducer = combineReducers({ home: homeNumber, number: addNumber }) const store = createStore(reducer) window.$reduxStore = store // 使用 window.$reduxStore.dispatch(action); let { state }...
[Blog首发链接](https://github.com/AttemptWeb/Record/issues/22) 在软件开发中链表和数组非常常见，它们都是线性存储，区别只是存储方式的不同。数组是连续存储，链表是离散存储(非连续)。链表是根据节点的前后关系进行存储的，同时由于它是离散存储，对内存空间利用更好。 链表分为：单链表、双向链表、循环链表，下面我主要是以**单链表**为示例说明，单链表基本结构如下： ```shell ——>【data|next】——>【data|next】——>【data|next】——> NULL ``` 由上结构可以知道，链表的每个节点都由两个属性构成，```data```负责存储数据，```next```负责指向下一个节点。当然，双向链表和循环链表都是以上面的结构进行扩展的。 单链表的头结点和尾结点比较特殊，头结点用来记录链表的头地址，是链表遍历的起点，尾结点的后继指针不指向任何结点，而是指向一个空地址NULL。 **时间复杂度**: 单链表的插入、删除操作时间复杂度为O(1)，随机查找时间复杂度为O(n)。 尽管在前端开发中，数组的使用可能大于链表，但由于链表的优点，就我所知道，目前React框架中就有应用，React项目中React Fiber由单链表构成，参考：[react16.3的fiber架构](https://blog.csdn.net/songshuzhong/article/details/80642651)。 ## C语言单链表实现 创建结构体Node： ```c // 默认data为整型 typeof struct Node{ int data; // 数据域 struct Node * next;...
# 聊一聊！ES6中的Iterator迭代器 [本文原文链接](https://github.com/AttemptWeb/Record/issues/25) 专门说一说`Iterator`迭代器的原因是，为后面`async/await`的文章做铺垫，因为我`async/await`是由`Generator`+`Promise`共同构成，而其中的`Generator`就是依赖于迭代器`Iterator`。 下面让我们来看看什么是`Iterator`？它出现的目的是什么？如何使用它？ ## `Iterator`迭代器 > 名词： 迭代 iteration / 可迭代 iterable / 迭代器 iterator 想必大家使用过for循环、while循环等，遍历Array获取其中的值，那其他数据结构如何通过遍历获取呢？或者这样说，是否可以提供一个统一的访问机制？来访问Object、Map、Set等。 轮到`Iterator`迭代器出场，`Iterator`迭代器就是为了解决这个问题，它提供统一的接口，为**不同的数据结构提供统一的访问机制**。(目前Map、Set、Array支持`Iterator`)。 顾名思义，`Iterator`迭代器的出现就是为了迭代而生，为不同的集合：Object、Array、Map、Set，提供了一个统一的接口（这里接口可以简单的理解为方法，就是遍历方法）。向我们常用的`for...of`就是依赖与`Iterator`迭代器。 在这里顺便提一嘴，我理解到的遍历、迭代的关系：遍历就是访问数据结构的所有元素，而迭代是遍历的一种形式。 ```javascript // 阮一峰 ECMAScript 6 入门 // 模拟next方法返回值 var...
[原文链接](https://github.com/AttemptWeb/Record/issues/26) 在Axios中拦截器是如何注册和调用的呢？下面我们一起来看看 **浏览器端Axios**调用流程如下： ``` 初始化Axios——> 注册拦截器 ——> 请求拦截——> ajax请求 ——> 响应拦截 ——> 请求响应回调 ``` ## Axios初始化 第一步：当然调用Axios请求时初始化了 ```javascript // 初始化Axios function Axios(instanceConfig) { this.defaults = instanceConfig; this.interceptors = { request:...
# 真香！GitHub Action一键部署 最近由于自己的个人应用增加，每次都需要在服务器手动发布，觉得特别麻烦，所以想通过代码控制自动发布，直接选择了**GitHub Action**。 **GitHub Action**持续集成服务，目前已经免费开放使用，由于大部分人的个人项目都是放在github上，那么使用它来发布、测试、部署，是非常方便的。 ## Github Action配置 **下面的内容默认你已经会创建Github Action**，官方提供了很多Github Action 配置模版，可以根据自己的需求随意选择，不是太了解的可以先参考[**阮一峰 GitHub Actions入门教程**](http://www.ruanyifeng.com/blog/2019/09/getting-started-with-github-actions.html)，了解一下Github Action。 我们来看看Github Action配置文件的基本构成，配置文件格式是```.yml```，示例如下： ```yml # main.yml # 一个 workflow，名字为Github Action Example name: Github Action...
# 循环队列的应用和实现 常见的线性结构应用有栈和队列，这次主要是聊一下队列。队列是一种**先入先出的数据结构**，类似的🌰🌰：排队买票，排在前面的先买，排在后面的后买(这里不说插队的情况)。 在软件开发中，就有应用到队列知识，比如：任务队列、事件队列、消息队列，和时间相关的东西都有队列的影响。 队列分为两种，**链式队列和静态队列**，前者是链表构成，后者是数组构成；这里说到的循环队列属于静态队列，而有一点必须要说的是：静态队列必须是循环队列。 **为什么静态队列必须是循环队列？** 对于长度一定的数组，存储的空间是确认的，在队列的入队和出队的过程中，数组中的存储空间需要不断的重复使用，那么这里的“不断重复使用”，就需要循环来实现，否则会出现空间的浪费。对于循环队列，只需要两个参数：front、rear，front代表的是队列第一个元素的下标，而rear代表的是队列最后一个有效元素的下一个元素的下标。 请看下图中出队和入队的过程：  图片来自于网络 有以上可以知道出队和入队算法如下： > 入队算法：rear = (rear +1)%数组长度 > 出队算法：front = (front+1)%数组长度 在了解到 出队、入队算法之后基本就可以自己来创建和维护一个循环队列了！ ## C语言循环队列实现 首先我们先来做好初始化的准备： ```c // 这里直接将数据类型定为整型,同时确定队列的长度为6 int len...
# 栈的应用和实现 [本文原文链接](https://github.com/AttemptWeb/Record/issues/24) 栈是线性结构的常见应用，是一种可以实现"先进后出"的存储结构，🌰：让我们想一下箱子📦，往📦里面放东西，最先放入📦中的东西被放在底部，后放入的反而在上面，假设我们从上至下的拿东西，那么就是先放入的后出，后放入的先出，即这就是一个"先入后出"的存储结构。 栈的应用非常的广泛：**函数调用、中断、表达式求值、内存分配、缓存、迷宫**都有应用栈的知识。 栈和队列实现虽然不同，但都可以通过数组和链表实现，栈分为静态栈和动态栈，静态栈有数组构成，动态栈有链表构成。 其中的核心操作就是：压栈和出栈。压栈就是放入栈中，出栈就是拿出栈中。下面我们看看栈的基本结构： ```c 栈顶Top 栈底Bottom 👇 👇 [data|next]——>[data|next]——>[data=NULL|next]——> NULL ``` 确认一个栈只需要两个参数，栈顶Top和栈底Bottom，初始创建时，栈顶Top等于栈底Bottom；压栈时，栈顶Top移动；出栈时，还是栈顶Top移动。 ## C语言栈实现 首先我们先来做好初始化的准备： ```c // 链表元素结构体 typedef struct Node { int data; struct Node...
## "NetWork wall" > 2010年1月17日，Google在其官方网站上发布了一篇名为《A new approach to China》的博文，在博文中，Google官方透露，将停止过滤搜索结果。在国内市场上停止过滤搜索结果，这将意味着Google对于搜索结果的处理将不再依据法律。 > 2010年3月23日凌晨3时，Google停止对谷歌中国搜索服务的“过滤审查”，并将搜索服务由内地转至香港。 在Google退出内地初期，国内依然可以访问Google.com，随着过滤加强，如今Google等境外网站，已彻底无法访问。 把时间继续往后倒推8年。在2002年，网络审查已开始采用技术手段，通过对IP或端口、关键字进行过滤，防止民众访问被过滤的网站，这算是“防火长城”(简称**GFW**)的前身。**GFW 主要的作用就是通过一定的技术手段对网络内容、资源进行过滤，极大的提升了网络环境**。而**GFW**具体用到哪些技术手段，我们就来一起看看。（**只聊技术**） ### DNSCP **“域名服务器缓存污染技术”(DNS Cache Poisoning Technology) 简称DNSCP** 是最初采取的过滤手段之一，随着互联网的发展，更多手段被应用，下面我们会说到。想象一下我们平时搜索网站的过程，当我们在浏览器输入一个网址，按下Enter键，在网络状况良好的前提下，界面基本都可以正常显示出来。 > 那输入网址，按下Enter键发生了什么呢？浏览器会先主动向DNS服务器请求，获取网址所在的IP地址 (DNS服务器各个地区都有，负责存储域名对应的IP地址，拥有IP地址即可访问网页)，获取到IP地址后访问服务器，获取到资源，在浏览器中渲染出对应的网页。对于网络技术不是很了解的同学，只需要知道 **输入网址后，浏览器会从DNS服务器获取正确的服务器IP地址，然后就可以显示网页了**。(**这里的资源指的 网页显示的图片、文字等资源**) 说了这么多，那**DNSCP在其中起到怎么样的作用呢？如果你请求不合法网址，它会污染DNS服务器请求，让浏览器无法获取到正确IP地址，没有正确的IP地址，当然就无法访问网页**。可能有些人会说，可以换一台DNS服务器试试啊！抱歉，根DNS服务器被统一管理。**DNSCP** 在目前仍然起着至关重要的作用，它污染Google、twitter、facebook等境外网址IP，保证国内网民无法请求到正确的IP，阻止访问非法网址。 **DNSCP**技术只是其中...