灯火十里-CSDN博客

原创 CSS媒体查询常用写法

/* Extra small devices (phones, 600px and down) */@media only screen and (max-width: 600px) {}/* Small devices (portrait tablets and large phones, 600px and up) */@media only screen and (min-width: 600px) {}/* Medium devices (landscape tablets, 768

2021-07-17 12:06:23 749

原创 V8的垃圾回收机制

垃圾回收整体上分为两大类：手动垃圾回收，比如C语言自动垃圾回收，比如JavaScript本文关注的是JavaScript的垃圾回收机制，即V8的垃圾回收机制。目录从堆和栈说起堆中的垃圾回收方式垃圾回收器的工作流程新生代垃圾回收（副垃圾回收器）老生代垃圾回收（主垃圾收集器）全停顿从堆和栈说起我们知道，在JS中，基本数据类型存储在栈中，而引用数据类型是存储在堆中的。因此，垃圾回收机制也分为栈中的垃圾回收和堆中的垃圾回收。栈中的垃圾回收是比较容易理解的。当一个函数执行结束后，JS引擎会销毁该函数

2021-07-07 20:34:33 870

原创 JavaScript中的类型判断

目录从JavaScript中的类型说起判断数据类型的方法1. typeof2. instanceof3. constructor4. Object.prototype.toString.call()从JavaScript中的类型说起JavaScript中有7种基本类型。还有引用类型（即通常说的对象）、函数类型。判断数据类型的方法1. typeoftypeof常用于判断基本数据类型，对于引用数据类型，全部返回object。对于函数，返回function。特别的，对于typeof null，返回的

2021-07-06 20:29:46 259

原创手写Promise异步加载图片

手写Promise异步加载图片定义一个函数，在其中创建一个Promise，并且将这个Promise返回，在这个图片的onload和onerror上分别绑定获取图片成功和失败的逻辑，分别调用resolve和reject。最后别忘记修改图片的src。function loadImg(url) { const p = new Promise((resolve, reject) => { const img = document.createElement("img"); img.on

2021-07-05 22:34:26 224

原创圣杯布局和双飞翼布局

目录圣杯布局圣杯布局完整代码双飞翼布局双飞翼完整代码总结圣杯布局和双飞翼布局都是三栏布局，左右两栏宽度固定，中间区域宽度自适应。主要利用float来实现。为了让中间区域最先渲染，不论是圣杯布局还是双飞翼布局，都要把中间部分写在页面的最前端。圣杯布局首先定义页面的结构。需要一个最外层div，在其中定义左中右三个div，注意要把中间部分的div写在最前面，来达到最先渲染的目的。<div class="content"> <div class="middle">中间部分&lt

2021-07-04 20:45:38 108

原创单行/多行文字溢出省略

单行文字省略样式代码，添加对应的class即可.text-ellipsis{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}示例：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <title>单行文字溢出省略</title&gt

2021-05-27 12:28:09 133

原创关于Redux Middleware(中间件)的一些概念上的理解

中间件的本质，就是增强store的dispatch的能力。比如redux-thunk，允许把action写成一个函数，来发送AJAX请求。Redux的中间件是可以同时使用多个的。当多个中间件在Redux中串连起来的时候，在View层发送的每一个action会经过每一个中间件的处理，最后到达Reducer。通过这种方式来实现dispatch能力的增强。中间件需要遵循一定的规范。实际上，Redux中间件是一个函数，这个函数的签名形式是这样的：Function :({getState, d..

2021-05-25 16:46:14 192

原创 Leetcode88. 合并两个有序数组（JavaScript版）

链接：88. 合并两个有序数组合并两个有序数组真题描述：给你两个有序整数数组 nums1 和 nums2，请你将 nums2 合并到 nums1 中，使 nums1 成为一个有序数组。说明: 初始化 nums1 和 nums2 的元素数量分别为 m 和 n 。你可以假设 nums1 有足够的空间（空间大小大于或等于 m + n）来保存 nums2 中的元素。示例：输入:nums1 = [1,2,3,0,0,0], m = 3nums2 = [2,5,6], n = 3输出: [1,2

2021-05-23 08:29:31 220

转载首页白屏解决与优化方案

当前很多无线页面都使用前端模板进行数据渲染，那么在糟糕的网速情况下，一进去页面，看到的不是白屏就是 loading，这成为白屏问题。此问题发生的原因基本可以归结为网速跟静态资源1、css文件加载需要一些时间，在加载的过程中页面是空白的。解决：可以考虑将css代码前置和内联。2、首屏无实际的数据内容，等待异步加载数据再渲染页面导致白屏。解决：在首屏直接同步渲染html，后续的滚屏等再采用异步请求数据和渲染html。3、首屏内联js的执行会阻塞页面的渲染。解决：尽量不在首屏html代码中放置内联脚

2021-05-20 14:15:43 5344

原创闭包相关的面试题

阅读本文之前，默认大家理解闭包的相关知识，尤其是自由变量的查找。如果不了解，建议去读我的另一篇文章搞懂JavaScript的作用域、作用域链、闭包，理解之后再来阅读本文，效果更佳。1. 循环与闭包1.1 从一个例子引入将循环和闭包结合起来，是一种非常经典的命题方式。首先来看一个非常常见的例子。for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000);}co

2021-05-19 20:05:59 559

原创 JS中哪些常用事件可以冒泡

总结JS中的一些常用事件是否可以冒泡。事件是否可以冒泡click√dbclick√keydown√keyup√mousedown√mousemove√mouseout√mouseover√mouseup√keyup√scroll√focus×load×mouseenter×mouseleave×resize×unload×...

2021-05-19 15:56:47 1156

原创我的Vue学习笔记（1）

文章目录1. Vue初识1.1 初学编写hello world和Counter1.1.1 hello world1.1.2 counter1.2 编写字符串反转和内容隐藏小功能1.2.1 字符串反转（v-on指令）1.2.2 内容隐藏（v-if指令)1.3 编写TodoList小功能，了解循环和双向绑定（v-for指令、v-model指令）1.3.1 v-for指令1.3.2 实现TodoList1.4 组件概念初探，对TodoList进行组件代码拆分（v-bind指令）1.4.1 v-bind指令1.4.

2021-05-18 16:10:24 249

原创搞懂JavaScript的作用域、作用域链、闭包

文章目录1. 理解作用域的实现机制2. 作用域链——作用域套作用域3. 闭包1. 理解作用域的实现机制几乎所有编程语言最基本的功能之一，就是能够储存变量当中的值，并且能够在之后对这个值进行访问或者修改。引入变量之后，会引起几个问题：这些变量储存在哪里？程序在需要的时候，又要如何找到它们？这个时候，作用域就登场了。作用域用于就是一套规则，它规定了变量应该如何存储、访问。要想理解作用域的实现机制，我们需要结合 JS 的编译原理一起来看。（就几句话，不难的，求求你看下去TAT）通常我们提到JS，都会说：

2021-05-16 17:27:40 370

灯火十里