自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(22)
  • 收藏
  • 关注

原创 面试题(高级)

1. MVVM响应式原理以Vue举例:MVVM响应式主要是通过Object.defineProperty配合发布订阅者模式来实现的, 对于Vue来说, 他内部是这么实现的:① 实现了属性监听器首先, Vue中data的属性会进行递归遍历, 将其中所有的属性以及数组元素进行Object.defineProperty绑定, 设置了属性的getter和setter监听, 其中,每个属性都会实例化一个该属性的订阅器对象, 该订阅器对象会在getter触发时收集视图更新回调方法, setter会通知该属性的视

2022-01-11 10:56:00 372

原创 flutter学习笔记01 -- 命名路由的跳转

首先,在MaterialApp中传递onGenerateRoute(路由跳转触发的事件), 指定起始路由import 'package:flutter/material.dart'; //引入material包(ui库)import 'BottomTabs.dart';import './router.dart' as router;//路由跳转时执行的方法//入口函数void main() => runApp(MyApp());class MyApp extends State.

2021-07-05 20:06:14 245 2

原创 拒绝js阻塞—defer、async作用和区别分析

js阻塞原理浏览器内核可以分成两部分:渲染引擎(Layout Engine 或者 Rendering Engine)和 JS 引擎。早期渲染引擎和 JS 引擎并没有十分明确的区分,但随着 JS 引擎越来越独立,内核也成了渲染引擎的代称(下文我们将沿用这种叫法)。渲染引擎又包括了 HTML 解释器、CSS 解释器、布局、网络、存储、图形、音视频、图片解码器等等零部件。JS 引擎是独立于渲染引擎存在的。我们的 JS 代码在文档的何处插入,就在何处执行。当 HTML 解析器遇到一个 script 标签时,它会

2021-06-14 20:45:50 336

原创 js的函数调用和声明提升的经典面试题解析

此题涉及的知识点:声明提升和提升优先级、构造函数返回值问题、js运算符优先级、实例化对象的属性访问优先级、逻辑运算符运算题目:// 方式1:创建了一个有返回值的构造函数,在里面定义了全部变量getName指向一个匿名函数(小心闭包) function Foo() { getName = function () { console.log(1); } return this; } // 方式2:构造函数的一个属

2021-06-12 11:45:19 225

转载 MVC、MVP、MVVM三种前端架构模式的意义及发展历程

前言做客户端开发、前端开发对MVC、MVP、MVVM这些名词不了解也应该大致听过,都是为了解决图形界面应用程序复杂性管理问题而产生的应用架构模式。网上很多文章关于这方面的讨论比较杂乱,各种MV模式之间的区别分不清,甚至有些描述都是错误的。本文追根溯源,从最经典的Smalltalk-80 MVC模式开始逐步还原图形界面之下最真实的MV模式。GUI程序所面临的问题图形界面的应用程序提供给用户可视化的操作界面,这个界面提供给数据和信息。用户输入行为(键盘,鼠标等)会执行一些应用逻辑,应用逻辑(applica

2021-06-06 13:31:50 769

转载 虚拟dom的详细描述与实现

写一个就知道了。刚好写了一篇博客刚好可以回答这个问题,copy过来:深度剖析:如何实现一个 Virtual DOM 算法 GitHub1 前言本文会在教你怎么用 300~400 行代码实现一个基本的 Virtual DOM 算法,并且尝试尽量把 Virtual DOM 的算法思路阐述清楚。希望在阅读本文后,能让你深入理解 Virtual DOM 算法,给你现有前端的编程提供一些新的思考。本文所实现的完整代码存放在 Github。2 对前端应用状态管理的思考假如现在你需要写一个像下面一样的表格的应

2021-06-06 11:28:59 233

转载 为什么 JavaScript 中 0.1+0.2 不等于 0.3 ?

在 js 中进行数学的运算时,会出现0.1+0.2=0.300000000000000004的结果,一开始认为是浮点数的二进制存储导致的精度问题,但这似乎不能很好的解释为什么在同样的存储方式下0.3+0.4=0.7可以得到正确的结果。本文主要通过浮点数的二进制存储及运算,和IEEE754下的舍入规则,解释为何会出现这种情况。一、浮点数的二进制存储JavaScript遵循IEEE754标准,在64位中存储一个数据的有效数字形式。其中,第0位为符号位,0表示正数1表示负数;第1到11位存储指数部分;第1

2021-04-18 20:19:16 526

转载 详解JS函数柯里化

第一次看到柯里化这个词的时候,还是在看一篇算法相关的博客提到把函数柯里化,那时一看这个词就感觉很高端,实际上当你了解了后才发现其实就是高阶函数的一个特殊用法。果然是不管作用怎么样都要有个高端的名字才有用。维基百科上说道:柯里化,英语:Currying(果然是满满的英译中的既视感),是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术。看这个解释有一点抽象,我们就拿被做了无数次示例的add函数,来做一个简单的实现。// 普通的

2021-04-12 20:30:13 73

原创 C语言指针变量的运算(加法、减法和比较运算)

指针变量保存的是地址,而地址本质上是一个整数,所以指针变量可以进行部分运算,例如加法、减法、比较等,请看下面的代码:#include <stdio.h>int main(){ int a = 10, *pa = &a, *paa = &a; double b = 99.9, *pb = &b; char c = '@', *pc = &c; //最初的值 printf("&a=%#X, &

2021-04-02 22:01:07 591

转载 C语言重点——指针篇(一篇让你完全搞懂指针)

一. 前言C语言是比较偏底层的语言,为什么他比较偏底层,就是因为他的很多操作都是直接针对内存操作的。这篇我们就来讲解C语言的一大特点,也是难点,指针和指针操作。这篇文章我会先从基本类型的存储过程和原理讲起,然后再讲解指针int *p,再举一反三,搞懂int **p和int ***p,学会指针。搞懂int *p,int **p和int ***p,完全学会指针!!!!二. 理解一个变量的存储过程和原理(必须清楚掌握)2.1 直接’='赋值int a = 5;printf("a = %d",a);

2021-03-29 22:18:02 271

原创 css垂直居中的七种方法

通过line-height和inline-block来垂直居中优点: 代码简洁,兼容性极好缺点: 需要知道div高度,并且要手动设置line-height .div1 { height: 200px; line-height: 200px; text-align: center; } .div1>div { display: inline-block; .

2021-03-25 22:07:25 124

原创 Vuex的理解与实践

Vuex是实现组件全局状态(数据)管理的一种机制, 可以方便的实现组件之间数据共享基本使用:1.安装vuex2.导入vuex, 创建store对象3.import Vue from 'vue';import vuex from 'vuex'Vue.use(vuex);const store = new vuex.Store({//创建store对象,对象中存放可全局共享的数据 state:{//state中存放的就是需要全局共享的数据 name:'helloVueX'

2021-03-24 19:38:47 103

原创 经验总结: 数组去重的六种方法

第一种:遍历数组法这种方法最简单最直观,也最容易理解,代码如下: var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2] var newArr = [] for (var i = 0; i < arr.length; i++) { if (newArr.indexOf(arr[i]) === -1) { newArr.push(arr[i]) } } console.log(newArr) // 结果:[2, 8, 5

2021-02-20 10:38:49 311

转载 webpack面试题以及相关问题汇总

随着现代前端开发的复杂度和规模越来越庞大,已经不能抛开工程化来独立开发了,如react的jsx代码必须编译后才能在浏览器中使用;又如sass和less的代码浏览器也是不支持的。 而如果摒弃了这些开发框架,那么开发的效率将大幅下降。在众多前端工程化工具中,webpack脱颖而出成为了当今最流行的前端构建工具。 然而大多数的使用者都只是单纯的会使用,而并不知道其深层的原理。希望通过以下的面试题总结可以帮助大家温故知新、查缺补漏,知其然而又知其所以然。问题一览webpack与grunt、gulp的不同?

2021-02-15 14:19:05 230

原创 JS算法之深度优先遍历(DFS)和广度优先遍历(BFS)

背景在开发页面的时候,我们有时候会遇到这种需求:在页面某个dom节点中遍历,找到目标dom节点,我们正常做法是利用选择器document.getElementById(),document.getElementsByName()或者document.getElementsByTagName(),但在本文,我们从算法的角度去查找dom节点,同时理解一下深度优先遍历(DFS)和广度优先遍历(BFS)的原理。准备假设页面上的dom结构如下: <div id="root"> <ul

2021-01-05 20:48:11 831 2

转载 算法的时间与空间复杂度(一看就懂)

算法(Algorithm)是指用来操作数据、解决程序问题的一组方法。对于同一个问题,使用不同的算法,也许最终得到的结果是一样的,但在过程中消耗的资源和时间却会有很大的区别。那么我们应该如何去衡量不同算法之间的优劣呢?主要还是从算法所占用的「时间」和「空间」两个维度去考量。 时间维度:是指执行当前算法所消耗的时间,我们通常用「时间复杂度」来描述。 空间维度:是指执行当前算法需要占用多少内存空间,我们通常用「空间复杂度」来描述。 因此,评价一个算法的效率主要是看它的时间复杂度和空..

2021-01-04 21:17:29 122

原创 ES6新特性

字符串扩展ES6为字符串扩展了几个新的API:includes():返回布尔值,表示是否找到了参数字符串。 startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。 endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。ES6中提供了`来作为字符串模板标记。我们可以这么玩:在两个`之间的部分都会被作为字符串的值,不管你任意换行,甚至加入js脚本键盘是的1的左侧,tab的上侧,esc的正下方解构表达式数组解构比如有一个数组:le.

2020-12-24 21:11:22 56

转载 JavaScript中的事件循环机制

我们都知道,javascript从诞生之日起就是一门单线程的非阻塞的脚本语言。这是由其最初的用途来决定的:与浏览器交互。单线程意味着,javascript代码在执行的任何时候,都只有一个主线程来处理所有的任务。而非阻塞则是当代码需要进行一项异步任务(无法立刻返回结果,需要花一定时间才能返回的任务,如I/O事件)的时候,主线程会挂起(pending)这个任务,然后在异步任务返回结果的时候再根据一定规则去执行相应的回调。单线程是必要的,也是javascript这门语言的基石,原因之一在其最初也是最主

2020-12-23 22:22:49 136 1

原创 什么是防抖和节流

在进行窗口的resize、scroll,输入框内容校验等操作时,如果事件处理函数调用的频率无限制,会加重浏览器的负担,导致用户体验非常糟糕。此时我们可以采用debounce(防抖)和throttle(节流)的方式来减少调用频率,同时又不影响实际效果。函数防抖函数防抖(debounce):当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次,如果设定的时间到来之前,又一次触发了事件,就重新开始延时。如下图,持续触发scroll事件时,并不执行handle函数,当1000毫秒内没有触发sc

2020-12-20 21:14:00 86

原创 前端性能优化方案

前端性能优化是个巨大的课题,如果要面面俱到的说的话,估计三天三夜说不完。所以我们就从实际的工程应用角度出发,聊我们最常遇见的前端优化问题。减少HTTP请求次数尽量合并图片、CSS、JS。比如加载一个页面,如果有5个css文件的话,那么会发出5次http请求,这样会让用户第一次访问你的页面的时候会长时间等待。而如果把这个5个文件合成一个的话,就只需要发出一次http请求,节省网络请求时间,加快页面的加载。使用CDN网站上静态资源即css、js全都使用cdn分发,图片亦然。避免空的src和h

2020-11-30 21:03:53 121

原创 JS 异步解决方案的发展历程以及优缺点

回调函数(callback)setTimeout(() => { // callback 函数体}, 1000)缺点:回调地狱,不能用 try catch 捕获错误,不能 return回调地狱的根本问题在于:缺乏顺序性: 回调地狱导致的调试困难,和大脑的思维方式不符嵌套函数存在耦合性,一旦有所改动,就会牵一发而动全身,即(控制反转)嵌套函数过多的多话,很难处理错误ajax('XXX1', () => { // callback 函数体 ajax('X.

2020-11-29 20:15:49 267

转载 快排详解

```javascript// ==UserScript==// @name New Userscript// @namespace http://tampermonkey.net/// @version 1.0// @description try to take over the world!// @author You// @include http*://note.youdao.com*// @match htt.

2020-11-29 20:10:13 408

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除