majing0520的博客

原创 generator

Generator 是 ES6 提供的一种异步编程解决方案。可以把它理解为一种状态管理器。调用 Generator 函数之后，它只是进行实例化工作，并没有真实的执行内部代码，所以不会像其他函数一样返回函数结果，而是会返回一个指向内部状态的指针对象，也就是所说的迭代器对象，需要继续调用 next 方法，next 方法会返回一个 iterate，以确保后续代码执行。function 关键字与函数名之间需要有一个星号 *；调用后不会立即执行函数结果，而是返回一个遍历器对象 iterator；

原创 JS的事件循环机制

面试必备系列之JS的事件循环机制如果你翻阅一本介绍 JS 的书籍，一定会告诉你下面这句话 “JS 是一门单线程语言。JS 的异步事件通过 事件队列 来实现，事件队列通过 事件循环机制 来控制”。那么今天就来理一理什么是 JS 的事件循环机制。

原创 2024前端开发面试题

React 会在类组件构造函数生成实例后再给 this.props 赋值，在 super() 的情况下，调用 this.props 为 undefined。当前查找变量，在当前作用域找不到便会向上一层作用域查找，一直到作用域的顶部，形成的一条链为作用域链。组件 (Component) 是用来构成你的 App 的业务模块，它的目标是 App.vue。插件 (Plugin) 是用来增强你的技术栈的功能模块，它的目标是 Vue 本身。变量提升：在作用域定义一个变量的时候，该变量会被提升到作用域的顶端；

原创 2024浏览器的渲染原理和过程

来总结一下最近理解的浏览器渲染原理和流程首先浏览器是多进程的，分为渲染进程、插件进程、主进程、网络进程以及GPU进程而我们打包出来的js html css文件，经过浏览器的渲染进程，就会展示出看到的页面。下面主要来了解一下浏览器的渲染进程整个渲染流程分为一下几个阶段：DOM构建、CSSOM构建、布局、分层、绘制、分块、光栅化、绘制。

原创 uniapp安卓 华为商店 vivo商店 oppo 小米 上架问题 Android中怎么才能不提前申请权限

提交 小米 oppo 市场审核失败，原因是提前向用户申请开启通讯录、定位、短信、录音、相机和日历等权限。

原创 d3js基础入门

D3js 是一个可以基于数据来操作文档的JavaScript库，画一个带箭头的tree

原创 关于 echarts 踩坑记录

echarts 踩坑记录

原创 js中generator详解

Generator 是 ES6 提供的一种异步编程解决方案。可以把它理解为一种状态管理器。调用 Generator 函数之后，它只是进行实例化工作，并没有真实的执行内部代码，所以不会像其他函数一样返回函数结果，而是会返回一个指向内部状态的指针对象，也就是所说的迭代器对象，需要继续调用 next 方法，next 方法会返回一个 iterate，以确保后续代码执行。

原创 前端路线图

原创 vite 预编译实现

实现首先，在使用 vite 建立的项目中，找到运行脚本文件的命令：找到对应的 cli.js 文件，Vite 会创建一个本地开发服务器，这个过程是由 createServer 函数完成。cli.command('[root]') // default command .alias('serve') .option('--host <host>', `[string] specify hostname`) ... .action(async (root, options

原创 vite学习和webpack对比

一口（很长的）气走近 Vite什么是 Vite知识就是力量。2021 又是充满力量的一年，在开工前，尤大大就给我们安排上了开工大礼包 – Vite。什么是 ViteVite 是一种新型的前端构建工具。开箱即用，插件 API 和JavaScript API带来了高度的可扩展性主要由两部分组成：一个开发服务器，它利用 原生 ES 模块 提供了 丰富的内建功能，如 热更新（HMR）一套构建指令，使用 Rollup 打包代码，预配置输出高度优化的静态资源用于生产。Vite 意在提供更开箱即用的配

原创 Http、Https、Http2、Http3 学习及对比

记一次 HTTP 的知识扫盲What什么是 HTTP ？HTTP ( hypertext transfe protocol ) 超文本传输协议，是一个简单的 请求-响应 协议。    通过浏览器和服务的数据交互，进行超文本（文本、图片、视频等）传输数据的一种双向规定协议。How     HTTP 通常运行在 TCP 之上，指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。...

原创 vue2升级vue3方案

升级前模版元素中 v-model.sync 改为 v-model:value；排查同时使用 v-if 和 v-for 的元素，避免在同一个元素上同时使用，可以通过 computed 方式过滤出可见元素的列表；排查元素 v-bind 的前后使用，确保 v-bind 先定义，再定义各个属性；排查 v-for 中使用 ref 的地方，将 ref 绑定为一个更灵活的函数上；组件升级中模版对于没有修饰符的 v-model，分别将 prop 和 event 命名更改为 modelValue

原创 Iterator介绍

概念Iterator - 遍历器 是一种接口，为各种不同的数据结构提供统一的访问机制。也就是说只要拥有了 Iterator 接口就可以完成统一访问遍历操作。作用为不同的数据结构提供统一的访问机制；使得数据结构的成员能够按照某种次序排序；为 ES6 for…of 调用。应用凡是部署了 Iterator 属性的数据结构，称为部署了遍历器接口。调用这个接口，会返回一个遍历器对象。ES6 中 数组、伪数组、Set 和 Map 结构，原生具备 Iterator 接口。主要有一下应用场景：f

原创 vue3升级方案（详解）

Breaking全局API实例创建方式new Vue() => createApp()全局和内部 api 被重新构造为 tree-shakable 结构：在 vue3 中不会把所有的 api 都打包进来，只会打包 import 的 apiimport { nextTick, version } from 'vue'模板指令v-model：数据：value => modelValue；事件：change => update:modelValue；保留原来的

原创 Rax.js基础学习

不知道小伙伴们，有没有在淘宝双十一疯狂抢购的经历？敷着最贵的面膜却也只是陪跑，好气呦???? 接下里，由前端开发女同学带你揭秘双十一大战的开发技术选型，选择最佳抢购方位姿势。在去年2019年的淘宝双十一，前端技术完全由Rax独领风骚。那什么是Rax，怎么用Rax，为什么用Rax，爱学习的我们来了解一下呗????What什么是Rax呢，来看官方定义：Rax 是用于构建通用应用程序的渐进式React框架，其内部提供基础UI组件通过上面定义我们知道，Rax 是基于 React 标准，并支持在不同容器中渲染

原创 cnpm报错 : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\cnpm.ps1，因为在此系统上禁止运行脚本

下载使用cnpm时出错，爆红cnpm : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\cnpm.ps1，因为在此系统上禁止运行脚本主要原因时没有执行可用脚本解决：以管理员身份运行power shell输入set-ExecutionPolicy RemoteSigned输入A 回车再次输入cnpm -v就可以运行了...

原创 web调试 APP 内嵌套的 HTML5 页面

准备材料 ????手机 + 电脑 + 测试 APP + 翻墙全局模式 = 即刻起飞最好是在同一个局域网下手机 ????手机需要进入开发者模式。手机数据线链接电脑（ 华为调为文件传输，别问我是怎么知道的 ）；设置中找到手机的版本号，点击【 版本号 】（ 连续点击五六次吧，反正狂点就对了 ），手机提示进入开发者模式；点进需要测试的 APP，需要点开一个页面！！！手机阶段结束以上阶段全部结...

原创 小白初入超级实用git教程提交，分支切换等

分支切换：1，确保在远程有自己的分支2，把本地修改的内容保存到堆栈中git status //查看本地修改状态git add . //添加到本地git stash pop //把内容保存在堆栈中3，修改本地分支git fetch //代码匹配git checkout -b devYou origin/you远程分支 //根据远程分支，创建并切换分支4，分支切换成...

原创 为什么选择TS

最近在做一个新项目，技术大佬告知前端要用TS。前端小白的我内心疑惑“弱语言类型它不香嘛，为什么选择TS？”为了紧随大佬的流星大步，带着这个疑惑开始了积（被）极（破）主（营）动（业）点开了百度，下面汇报一下我的搜索结果。TypeScript 的前世今生背景故事2010年微软公司的一个深夜，拥有黑眼圈的程序员们加班改bug，其中一个资深程序员抱怨“这声明的变量不写类型注释，写的人也太不靠谱，这...

原创 mac配置密钥ssh和Homebrew

配置ssh1，查看是否存在ssh key进入.ssh目录，查看是否有相应的ssh文件cd ~/.sshls是否存在 id_rsa 和 id_rsa.pub文件，如果存在，说明已经有SSH Key；如果没有配置ssh key，需要先生成 ssh key后再验证私钥和公钥文件。ssh-keygen -t rsa -C "邮箱emai@email.com"2，读取公钥文件信息进入....

原创 webpack配置的坑

webpack配置的坑webpack在@3版本需要：extract-text-webpack-pluginBabel-core在@6版本babel-loader在@7版本