前端web
关注
分享
扫一扫
文章平均质量分 94
Louis_lan
不知归来是少年，此间少年当出发
展开
-
JavaScript 中原型继承与寄生继承
引言在 ES5 中，继承的方式有原型继承，构造继承，原型组合继承，寄生式继承，寄生组合继承。其实原型组合继承就是原型继承与构造继承的组合，而寄生组合继承则是寄生式继承和构造继承的组合。不尽会猜想是否寄生式继承是原型继承的某种替代方案？如果是的话，那究竟是为什么要选择寄生继承呢？请往下看：继承方式1. 原型组合继承function Father(){ this.msg = "Hello"}Father.prototype.say = function(){console.log(this.ms原创 2020-06-16 07:47:10 · 406 阅读 · 0 评论 -
JavaScript 中 foreach 的回调函数并行执行探究
在我们正常的表里数组操作中有两大类方式：一种是通过for/while的方式进行遍历，另一种就是通过Array内置的方法，比如 foreach，map，every，some，reduce等。这些操作处理同步的回调函数都是串行执行的，以下选取 for 和 foreach 做示例：// 定义数组const arr = [1,'a',2,'b',3,'c']// 定义同步回调函数const foo = i => { if(typeof i === 'number'){ for(let i原创 2020-05-28 09:23:52 · 2399 阅读 · 1 评论 -
node之Path介绍
Node.js 常用的内置 npm 模块，主要为了更加方便的处理文件与目录路径，通常可通过 const path = require('path') 引用。Windows vs. POSIXPOSIX 称之为可移植操作系统接口（Portable Operating System Interface of UINX，POSIX），定义了操作系统为应用程序提供的了统一的接口标准，具体想了解的可自行 Google，在这可以简单把其认为是 uinx。path 模块根据 node 应用程序所在的系统环境不同而呈原创 2020-05-25 08:49:42 · 8550 阅读 · 0 评论 -
《深入浅出Webpack》学习笔记
入门先简单地提下模块化的思想。模块化简单来说就是将复杂的系统分解成各个简单的子模块，便于开发和维护。一般 JavaScript 模块化规范有 CommonJS，AMD 和 ES6 中的模块化。CommonJS其核心思想就是利用 require 来同步加载依赖的模块，通过 module.exports 来暴露模块的接口。优点在于代码可在 node.js 环境下运行NPM 包中大部分模块都支持 CommonJS缺点在于：无法在浏览器环境下运行，要想运行必须通过工具转换。AMD异步模块原创 2020-05-20 19:42:25 · 415 阅读 · 0 评论 -
react-router 4.x 常见用法示例
常用组件及方法全部整合进一个demo中。主要涉及的概念有：HashRouter 与 BrowserRouterRoutechildren 和 render 创建地址与组件的关系Link 与 NavLinkSwitch页面传参路由嵌套Redirect目录如下：主要的文件有 index.html, index.css, index.js，主要呈现下以下三个文件，以便大家快速上手。index.html<!DOCTYPE html><html lang="en"&原创 2020-05-20 17:42:23 · 221 阅读 · 0 评论 -
浏览器工作机制
译文1. 介绍(Introduction)浏览器可能是使用最广泛的软件。在此我将介绍其屏幕后的工作原理。我们将会看到当我们在地址输入栏中敲入"google.com" 后浏览器将 Google 页面呈现出来的过程中具体发生了什么。1.1 主流的浏览器(The browsers we talk about)至今有五种主流的浏览器在使用 ：Internet Explorer(IE)/Edge，...原创 2020-04-30 17:23:07 · 1465 阅读 · 0 评论 -
Flex 属性清单
在容器上有 6 个属性flex-directionflex-wrapflex-flowalign-itemsjustify-contentalign-content在项目上有 6 个属性orderflex-growflex-shrinkflex-basisflexalign-self具体讲解可查看文献链接。文献https://www.ruanyif...原创 2020-04-29 08:59:03 · 216 阅读 · 0 评论 -
BFC定义及其应用
BFCBFC 的定义浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks，table-cells 和 table-captions），以及 overflow 值不为“ visible ”的块级盒子，都会创建 BFC（块格式化上下文）。BFC 特点元素的布局不受外界影响，往往利用其来消除浮动。在一个BFC中，块盒与行盒（行盒由一行中所有的内联元素所组成）都会垂直...原创 2020-04-29 08:56:29 · 251 阅读 · 0 评论 -
垂直居中与水平居中的方法汇总
垂直居中如果是 inline 元素，并且父元素高度已知。可使用样式 line-height:父元素高度如果是 inline-block 元素利用父元素的伪元素和 vertical-align 样式：.father:after, .son{ display:inline-block; vertical-align:middle;}.father:afte...原创 2020-04-29 08:49:31 · 197 阅读 · 0 评论 -
CSS 盒模型浅谈
盒模型的定义在浏览器中，每个元素都可以被认为是盒模型。盒模型一般有以下属性：display, position, float, width, height, padding, border, margin.盒模型一般由 元素内容, padding, border, margin 组成 , 所以又有内盒和外盒的概念。其中内外盒元素的宽高计算如下：内盒元素宽(高)内盒元素宽(高) = 元...原创 2020-04-29 08:45:55 · 156 阅读 · 0 评论 -
像素与viewport浅谈
像素：对于像素有两个概念，一个是物理像素，一个是逻辑像素。物理像素是由屏幕自身决定的，一旦屏幕生产出来后其物理像素就固定了，我们知道屏幕之所以能够显示图像，是因为屏幕上排布着密密麻麻的小光点，通过这些光点呈现各种的色彩而显示出不同的图像，其中一个物理像素的大小就等于屏幕上光点分布的间距。逻辑像素是抽象的，是存在于设计稿中的，也就是 CSS 中的 1px 的概念。它与设备像素是独立的，两者并不...原创 2020-04-29 08:41:56 · 200 阅读 · 0 评论 -
javaScript 中Boolean类型的一些理解
在js中，任何数据类型都可转换成Boolean类型，所以理论上任何数据类型都可以放在if条件判断中。众所周知，js对于非Boolean类型的真假判断比较模糊，当然也可以通过Boolean()函数显示判断当前数据类型的布尔值，比如：var str = "Hello";console.log(Boolean(str)); // output: true.以下对于各非Boolean类型转成布尔值...原创 2020-01-18 10:33:05 · 376 阅读 · 0 评论 -
剖析javaScript中的Promise、generator、async
前言了解js的小伙伴们知道，js是一门单线程语言。所以js要实现“异步”操作，就需要一些奇淫异巧，此三种是较为常用的js异步操作处理技巧。在本文中我会先介绍这三种的定义与用法，其次会比较三者之间的联系。在以下的例子中我会用到setTimeout函数来模拟异步。Promise说起Promise依稀还记得当时初学微信小程序，异步调用后台数据被他血虐的情形。在将其弄懂之后，至今一直在用Promis...原创 2019-06-27 22:51:39 · 281 阅读 · 0 评论 -
微信小程序开发小结
引言开发微信小程序也有一段时间了，从之前的懵懂无知到逐渐的入门。故此，写一篇学习小结来记录自己的学习轨迹。大家都知道微信小程序的开发文档写的很详细，但是文档那么多，要想快速入门又不知从何看起，所以此文主要是为了引导读者该如何去看文档并辅以简单的说明，使得能够快速的能够上手小程序。1 申请微信小程序1.1 注册微信小程序相关文档访问微信公众平台，在主页面上找到立即注册，然后按流程进行注册即...原创 2018-12-07 21:25:41 · 536 阅读 · 0 评论 -
微信小程序flex-row布局中button的问题
.carbin-item{width: 90%;justify-content: space-between;padding: 20rpx;border-bottom: solid #eee 2rpx;font-size: 11pt;}.carbin-item button{font-size: 11pt;width:40%;margin-right: 0;}原创 2019-02-23 11:14:31 · 3792 阅读 · 0 评论