github_38186390的博客

js 面试题（3）

github_38186390 — Tue, 31 Jan 2023 19:31:56 +0800

一。柯里化柯里化（curry）的的概念很简单：只传递给函数一部分参数来调用它，让它返回一个函数去处理剩下的参数。具有通用性和高适用。常见作用：1、参数复用。2、提前返回。3、延迟计算/运行二。任务：同步任务和异步任务，异步任务分为宏任务和微任务

vue 基础

github_38186390 — Tue, 15 Feb 2022 15:08:46 +0800

一。vue 生命周期：总共10个。初始化只会执行（1 2 3 4）。 beforeCreate：即初始化状态之前 created：初始化状态后（initState 执行完成）。 beforeMount：虚拟dom生成之前，在该周期内执行 render 函数，生成虚拟dom和挂载dom mounted：此时dom元素已加载完成，可以进行dom元素操作。（调用顺序先执行子元素的mount再执行父元素） beforeUpdate：更新之前 updateed：更新后 beforeDestroy：销毁前

opencv.js

github_38186390 — Mon, 15 Nov 2021 17:35:04 +0800

opencv 图形入门。一。读取图片方法。在读取图片完成后请执行：let dst = new cv.Mat()。之后所有的操作数据都会在 dst 里面 cv.matFromImageData(imgData)：imgData: canvas 通过 getImageData 获取的数据。 cv.imread(imageSource) ：imageSource可以是图片元素或canvas 元素或他们的id。二。显示图片。 cv.imshow('canvasOutput', dst)：canvasO.

vue SEO

github_38186390 — Mon, 31 May 2021 13:59:07 +0800

一。本人主要是在不改动SPA单页面的情况下，专门针对爬虫进行处理，从而完成SEO。使用工具：puppeteer、nginx。 puppeteer：主要用于生成wa

微信小程序 webview 返回按钮阻止返回

github_38186390 — Fri, 14 May 2021 16:18:39 +0800

一。需求：微信小程序在使用webview 时，导航栏是不允许自己修改的。对于左上角的返回按钮，如果相要在返回的时候，弹框确定后再返回，微信小程序是没有api支持。在微信小程序的思路上基本无解。二。解决办法：用于我们的webview 就是直接使用的微信浏览器。我们是可以使用js 相关的 History API. 主要是通过设置 history.pushState 这个方法来阻止的。 history.pushState API说明：总共是三个参数，前面两个不用管直接用null 即可，第三个代码跳转页面的

Failed to connect to github.com port 443: Timed out

github_38186390 — Tue, 20 Apr 2021 12:01:27 +0800

一。github 网络错误处理办法：打开https://github.com.ipaddress.com/ 如下图打开https://fastly.net.ipaddress.com/github.global.ssl.fastly.net#ipinfo 如下图：打开 https://github.com.ipaddress.com/assets-cdn.github.com 如下图：将红框框住的 ip 复制下来。.

字体加载

github_38186390 — Fri, 02 Apr 2021 17:24:08 +0800

需求：就在字体加载完成时，将该字体的字绘制到canvas 中。假如该字体未加载完成前，使用canvas 绘制的就是默认字体的字。涉及到的项目：青柠设计：https://qingning6.com/ 一。如何判断一个字体是否加载完成。使用api ：document.fonts. /** * 验证字体是否加载完成 * fonts => [{fontSize, fontFamily}] * */ function validFonts(fonts) { return new Prom

css 文字渲染

github_38186390 — Thu, 01 Apr 2021 11:18:07 +0800

css 文字渲染实测结论：测试的内容都是使用span 标签（即是用内联元素进行测试的）具体显示效果可以参考：青柠设计：https://qingning6.com/ 参数说明：字体自带行高：fontLineHeight；css设置的行高：lineHeight；字大小：fontSize；行数： row；列数： col；文字宽高：width、height；字间距：letterSpacing；水平文字：单行文字，文字的高度：height = fontLineHeight 多行文字，文字高度：hei.

阿里云跨域问题处理

github_38186390 — Fri, 15 Jan 2021 18:24:02 +0800

主要针对：No 'Access-Control-Allow-Origin' header is present on the requested resource 一。首先是判断是不是客户端缓存的原因。二。按照阿里云的官方文档进行处理。链接：https://help.aliyun.com/knowledge_detail/39518.html?spm=a2c4g.11186623.2.18.37242dffXszCIQ 三。确定下是否设置个允许跨域。设置过请求会出现如下图的header 如果出

opencv 构成js版本

github_38186390 — Thu, 07 Jan 2021 15:01:26 +0800

重点说明：不要使用window 进行编译，不然会出现各种奇葩的错误。（我花啦一周的时间尝试wind10 没有成功。）一。系统安装步骤说明：如果是window 系统，请直接安装VMware 虚拟机。然后在虚拟机里面安装Ubuntu 20 版本。 VMware 下载地址：https://www.vmware.com/products/workstation-pro/workstation-pro-evaluation.html Ubuntu下载地址：https://cn.ubuntu.com/dow

canvas multiply、screen

github_38186390 — Mon, 14 Dec 2020 17:22:22 +0800

一。canvas multiply、screen计算过程 multiply 计算：r/g/b/a 分别相乘除以255及是混合后的值。 function aM(left, right) { let newArr = [] for(let i = 0; i < left.length; i++) { newArr.push(left[i] * right[i] / 255) } console.

image 描边

github_38186390 — Fri, 30 Oct 2020 12:08:07 +0800

function stroke(image, width, height) { const strokeCanvas = document.createElement('canvas') strokeCanvas.width = width strokeCanvas.height = height const strokeCtx = strokeCanvas.getContext('2d') strokeCtx.drawImage(image, 0, 0, .

h5 组合和解组

github_38186390 — Thu, 20 Aug 2020 20:44:02 +0800

一。组合：就是指多个元素组合成一个元素，组合的元素称为父元素，被组合的元素则称为子元素。组合后：父元素进行拖动、旋转、缩放时，子元素也相对于父元素进行。拖动时：实际就是改变父元素的位置，子元素相对于父元素是不变的。所以子元素相对于最原始的坐标轴为: 父元素的位置 + 子元素的位置。旋转：父元素旋转是绕父元素的中心点进行旋转的，子元素也是绕父元素的中心点进行旋转。则子元素的相对位置计算方式是：通过获取子元素的中心点，然后利用绕点旋转公式计算出子元素中心点绕父元素中心点旋转后得出的新的子元素中心点。然

vuex 状态管理器

github_38186390 — Wed, 29 Jul 2020 13:17:04 +0800

一。Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。这个状态自管理应用包含以下几个部分： state，驱动应用的数据源； view，以声明方式将state映射到视图； actions，响应在view上的用户输入导致的状态变化。使用时机：多个视图依赖于同一状态。来自不同视图的行为需要变更同一状态。当项目是中大型时，也需要时机。每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (stat...

Vue-router

github_38186390 — Wed, 29 Jul 2020 11:54:22 +0800

一。vue-route 简介：通过进行组件渲染。通过进行跳转（组件局部刷新）。 api 导航：通过router实例，router.push() / router.replace / router.go() / router. 获取路由参数：t通过 route 属性进行获取 (this.$route.query / this.$ro

table 表头固定

github_38186390 — Fri, 27 Sep 2019 14:06:34 +0800

一。table 表头固定说明。我们将表头和表内容分成两个表格就可以解决该问题。二。代码。 css代码：里面定死的宽高只是为啦方便看效果，实际中需要使用js计算出来。 * { box-sizing: border-box; } .table { border: 1px solid #efefef; ...

typeScript

github_38186390 — Fri, 02 Aug 2019 10:57:38 +0800

一。类型说明：JavaScript 的类型分为两种：原始数据类型和对象类型。原始数据类型包括：布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol。二。TypeScript 内如何定义类型。通过（:）进行定义。类型值分别是（number, string, boolean, null, undefined, any（代表任何类型））。如果没有定义类型则默认设...

js 函数节流

github_38186390 — Tue, 23 Jul 2019 15:45:37 +0800

一。函数防抖：基本思想是指，某些代码不可以在没有间断的情况连续重复执行。第一次调用函数，创建一个定时器，在指定的时间间隔之后运行代码。当第二次调用该函数时，它会清除前一次的定时器并设置另一个。如果前一个定时器已经执行过了，这个操作就没有任何意义。然而，如果前一个定时器尚未执行，其实就是将其替换为一个新的定时器。目的是只有在执行函数的请求停止了一段时间之后才执行。常用于onresize 事...

js 拖放

github_38186390 — Thu, 18 Jul 2019 14:37:05 +0800

一。说明：通过draggable 属性设置元素是否可拖动。true 则可拖动，反之不行。二。拖放API （1）拖动元素时触发的API： dragstart()：开始拖动的时候触发。 drag()：拖动期间触发，dragstart 触发后就开始触发。 dragend()：拖动停止时触发。（2）放置到目标元素时，触发的API： dragenter()：元素被拖动到放置目标上，就触发。...

html5 canvas API

github_38186390 — Thu, 18 Jul 2019 11:41:04 +0800

一。canvas 是一个html 标签。必须先设置其 width 和 height 属性，指定可以绘图的区域大小。width、height、css可以随便的修改。主要用于2D 绘图。画图操作必须先设置颜色，然后画线。所有以 fill 开头的API 都只能使用fillStyle 属性填充颜色，以stroke 开头的 API 都只能使用strokeStyle 属性进行描边。二。API说明：这...