windy-boy-CSDN博客

原创前端面试题

很久之前就有关注一个关于前端面试题的项目，叫做前端知识每日3+1，好像之前不叫这个名字的，忘了。现在star数已经达到了17.2k了。参与人数还是很多的。有时间我会偶尔刷一刷这些题，不过没有一个系统的汇总，就想着汇总一下，后面如果需要看也更方便一些，毕竟里面的题目是没给答案的，需要自己寻找答案。当然，也可能会有一些并不是出自那里的题目，这里也会一并汇总。由于能力有限，有些答案可能会在网上摘抄，如果有不正确，或者有遗漏和需要补充的地方，望不吝赐教。HTMLDOCTYPE 的作用是什么...

2021-04-11 20:11:09 110

原创 uniapp 小程序开发工具没问题真机调试没问题发到线上页面就空白了

这个时候，直接就能看到结果了：接口查询优惠券返回null，而我在页面判断了有优惠券信息才显示。这就直接导致出现了这个谜一样的bug。后台分享一个小程序二维码，扫码之后打开领券优惠券的页面。这个在本地调试和真机调试都没有发现问题。看页面也没有用到什么特殊的语法。记录一下开发中遇到的一个问题。

2023-05-10 10:17:34 745 1

原创 vue-router 解读更新视图但不重新请求页面

前两天，有一位小伙伴问我：为什么说vue-router做到更新视图但不重新请求页面？我看路由更新都有请求数据啊。针对这个问题，我从以下几点进行答复。abstract其实就是用一个数组stack来模拟路由栈，对路由的增加修改其实就是对这个数组的增加修改。具体的实现就不展开了。

2022-10-16 22:55:18 992

原创 vue 组件通信的几种方式

vue组件通信的N种方式。

2022-02-28 22:07:14 6182

原创 html2canvas 图片跨域无法加载的问题

html2canvas无法画网络图片的问题。

2021-12-02 10:40:13 2108

原创 element el-cascader 选中但不显示的问题

一行代码解决element el-cascader 选中但不显示的问题。

2021-09-30 09:59:45 7568 3

原创浏览器事件循环(Event Loop)

JS 的异步执行逻辑依赖 Event Loop 机制，但是这套机制却是定义在 HTML 标准中的。因为 Event Loop 本身并不属于 ES 层面的功能，是宿主环境给脚本提供了这一机制，才让脚步有了异步执行的能力。

2021-07-24 23:16:43 1486 5

原创公众号跳小程序

公众号跳小程序，基本上有开发公众号和小程序的都会用到这个功能。那如何进行跳转呢？第一种，在公众号页面添加一个按钮，用户点击这个按钮跳转小程序。针对这种需求，公众号有个开放标签：wx-open-launch-weapp 可以实现。可以到官网上看下具体要求：官方文档第二种，就是在回复用户评论的时候带上跳转小程序某个页面的链接，或者在自动回复里面添加一个跳转到小程序的链接。针对这个功能，用上面的那个开放标签就没办法做到了。而且这个也不是公众号网页功能，所以在公众号官方文档上没有找到相关的文档。

2021-07-02 09:55:44 1406

原创 ES5/ES6 的继承除了写法以外还有什么区别

ES5 的继承实质上是先创建子类的实例对象，然后再将父类的方法添加到 this 上ES6 的继承机制完全不同，实质上是先创建父类的实例对象 this（所以必须先调用父类的super()方法），然后再用子类的构造函数修改 this。ES5 的继承时通过原型或构造函数机制来实现。ES6 通过 class 关键字定义类，里面有构造方法，类之间通过 extends 关键字实现继承。子类必须在 constructor 方法中调用 super 方法，否则新建实例报错。因为子类没有自己的 this 对象，而.

2021-06-30 23:23:38 317

原创对 BFC的理解

BFC，块格式化上下文（Block Formatting Context，BFC）是个啥？我们来看下MDN的解析：看完上面一大段，你会知道，哦，原来BFC就是块格式化上下文啊，是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。但是看完以后你会发现，你只记住了一个块格式化上下文。。。照我的理解，不用刻意去记或者说是去解释什么是BFC，可以简单的理解为就是页面中的一部分或者说是一块区域。然后就是要知道，怎么去创建这块区域，以及这块区域有什么作用就行。

2021-05-31 09:44:27 130

原创对 MVC、MVP、MVVM 模式的理解

首先要明确的是这三者是框架模式，为防止面试的时候一脸懵逼，还是要了解一下的。当然，如果是想要深入理解，是需要花费不小的精力的。MVC（ Model-View-Controller）M （模型）Model层，负责处理数据和业务逻辑，在数据变化时更新控制器。对于我们web应用来说，可以简单的理解为后台中负责处理业务逻辑以及操作数据库的部分。V（视图）视图(view)代表模型包含的数据的可视化，当然，还可以响应用户的一些操作。在web中可以理解为一个网页。C（控制器）控制器(Controller)

2021-04-17 19:50:33 199

原创什么是重绘和回流以及如何避免回流

重绘: 当渲染树中的一些元素需要更新属性，而这些属性只是影响元素的外观、风格，而不会影响布局的操作，比如 background color，我们将这样的操作称为重绘。回流：当渲染树中的一部分（或全部）因为元素的规模尺寸、布局、隐藏等改变而需要重新构建的操作，会影响到布局的操作，这样的操作我们称为回流。简而言之，任何会改变元素几何信息（元素的位置和尺寸大小）的操作，都会触发回流。比如：（1）添加或者删除可见的 DOM 元素(不可见元素不会触发回流)；（2）元素尺寸改变——边距、填充、边框、宽度和.

2021-04-13 23:34:26 6631

原创页面导入样式时，使用 link 和 @import 有什么区别

从属关系区别。 @import 是 CSS 提供的语法规则，只有导入样式表的作用；link 是 HTML 提供的标签，不仅可以加载 CSS 文件，还可以定义 RSS、rel 连接属性、引入网站图标等。加载顺序区别。加载页面时，link 标签引入的 CSS 被同时加载；@import 引入的 CSS 将在页面加载完毕后才加载。兼容性区别。@import 是 CSS2.1 才有的语法，故只可在 IE5+ 才能识别；link 标签作为 HTML 元素，不存在兼容性问题。DOM 可控性区别。可以通过 J.

2021-04-13 22:52:25 111

原创 SGML 、 HTML 、XML 和 XHTML 的区别

SGML 是标准通用标记语言，是一种定义电子文档结构和描述其内容的国际标准语言，是所有电子文档标记语言的起源。HTML 是超文本标记语言，主要是用于规定怎么显示网页。XML 是可扩展标记语言是未来网页语言的发展方向，XML 和 HTML 的最大区别就在于 XML 的标签是可以自己创建的，数量无限多，而 HTML 的标签都是固定的而且数量有限。XHTML 也是现在基本上所有网页都在用的标记语言，他其实和 HTML 没什么本质的区别，标签都一样，用法也都一样，就是比 HTML 更严格，比如标签必须都.

2021-04-11 20:21:01 225

原创 DOCTYPE 的作用是什么

我们写页面的时候经常会看到：<!DOCTYPE html>在h5之前是这样的：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">作用<!DOCTYPE> 声明一般位于文档的第一行，它的作用主要是告诉浏览器以什么样的模式来解析文档。一般指定了之后会以标准模式来进行文档解析，否则就以兼容模式进行解析。在标准模式下，浏览器的解析规则

2021-04-11 20:15:55 549 1

原创 js 数组的常用方法

数组的方法有哪些呢？看下图：这是定义在数组原型对象上的方法，常用的有：concateveryfilterfindfindIndexforEachincludesindexOfjoinmappoppushreduceshiftslicesomeunshift// 还有一些也很常用但没有定义在原型对象上的：isArrayoffrom在日常开发种，经常会用到的基本就这些，剩下的上场率都不高。接下来，温故一下：concat 拼接数组every 对数组中每一

2021-03-31 23:57:49 154

原创 js 防抖与节流

防抖节流

2021-03-24 00:07:31 159

原创 Module ‘amap_core_fluttify‘ not found

前言在用flutter做一个应用，需要用到地图导航，用到插件是amap_map_fluttify。之前是一直没有问题的，但是偶然间，它就出现了，还只出现在ios端，android端没有发现这个问题。ios端运行调试或者打包都会出现这个问题。网上找了一圈没有找到解决方法，也看了相关的issue：ios 编译报错Xcode在Archive阶段出错（真机和模拟机都是vscode环境运行正常）iOS真机测试错误：‘amap_core_fluttify/AmapCoreFluttifyPlugin.h’ f

2021-03-22 16:43:57 1255 4

原创闲聊LSP

前言最近在一个聊天群里，有人发了三个字母，就是本章的主人翁‘LSP’。我当时瞬间想到了很多，‘老司机’？‘老色鬼’？‘零食铺’？‘老算盘’？甚至连设计模式的‘里氏替换原则（LSP）’都想到去了，但很明显都不是，为了不暴露自己的无知，只能自己查一下：好家伙，整整一页都是介绍这个的。翻到第五页才出现‘里氏替换原则’...

2021-02-27 11:07:39 1562

原创 js继承 - class的继承

和之前讲的js的继承方式不同，class的继承是es6里面才有的。在讲class的继承之前，需要先了解一下class：class的基本语法class，也就是我们常说的类，// classclass Person { constructor(name, age) { this.name = name this.age = age } sayName() { console.log(this.name) }}const p1 = new Person('p1'

2021-02-20 23:48:08 7031 1

原创 css 画小箭头、小三角、聊天框

前言在写一个页面的时候，需要用到箭头：类似这种小箭头，小三角形什么的，是不用UI提供图片的，直接用css 画一个更好，不但能减少一次请求，对浏览器的渲染也更好。突然发现这个小三角小箭头不管是实际开发中还是面试中都是比较常见的(我就有被问到过)，有鉴于此，遂写一篇来总结一下。小箭头原理通过border来实现，border有四个边，去掉两个边就是个箭头，箭头指向可以通过rotate来改变。当然，除了这个方法也有其他的方法，比如background，两个元素设置background，然后通过定位

2021-01-31 19:10:46 1001

原创 js 阿拉伯数字金额转换为中文数字金额

前言最近遇到一个需求，需要把阿拉伯数字的金额如99.9元转换为中文数字金额玖拾玖元玖分。想了一下，感觉思绪有点混乱，就在网上找了下。方法有很多，择其一，根据自己的需求修改后，这里记录下来。大概思路如下：1、声明需要用到的中文数字// 汉字的数字const cnNums = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'] // 基本单位const cnIntRadice = ['', '拾', '佰', '仟'] // 对应整数部分扩展单位

2021-01-27 23:28:28 800

原创 js继承 - 原型式继承、寄生式继承

原型式继承基本思路：将需要继承的属性和方法放到一个对象上，然后将这个对象放到原型上。怎么做呢？看下例子：const util = { name: 'util', wealth: ['house', 'car']}function utilFn(util) { function fn(){} // 这里可以对传入的util进行修改，比如： util.weight = '80' // 这一步就是将对象放到原型上了 fn.prototype = util // 最后返回实

2021-01-24 19:18:34 190 3

原创 js继承 - 借用构造函数继承、组合继承、寄生组合式继承

因为这三种实现继承的方式都是有关联的，所以将他们放在一起了（其实可以将原型链继承也放进来）。一、借用构造函数实现继承二、组合继承三、寄生组合式继承

2021-01-24 19:18:04 380

原创 js继承 - 原型链继承

继承是js里面的一个重头戏，高程里面介绍了六种实现继承的方式，我们先来看一下通过原型链实现继承的方式。在js 创建对象的几种模式–原型模式里面介绍了构造函数，原型对象，和实例三者之间的关系，我们来简单回顾一下：每个构造函数都有一个原型对象，通过prototype可以访问到这个原型对象，而原型对象又可以通过constructor访问这个构造函数，实例和构造函数没有直接联系，但是实例可以通过[[Prototype]]访问原型对象，通过这种方式，实例也可以间接地访问构造函数。直接把之前的图搬过来：正是有

2021-01-17 18:58:05 545

空空如也

空空如也