自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

xiaoxu的博客

专注Web前端开发

原创 宏任务、微任务

宏任务与微任务?B-树中含511个关键字,B-树为3阶,则包含叶子节点层该树最大深度为?891011

2018-10-10 10:58:47 4297 3

原创 js实现基于Base64的编码及解码

ddd

2018-08-05 13:38:03 33203 9

原创 stopPropagation与stopImmediatePropagation的区别

stopPropagationevent.stopPropagation();阻止事件冒泡。stopImmediatePropagationevent.stopImmediatePropagation(); 阻止事件冒泡并且阻止该元素上同事件类型的监听器被触发。例如:没有阻止事件冒泡:import React, { Component } from 'react';export d...

2020-03-01 14:22:20 177

原创 style-loader、mini-css-extract-plugin的区别

webpack初入门时强调处理css文件时一定要使用style-loader,使用loader的顺序为:[“style-loader”, “css-loader”, “sass-loader”],webpack调用loader是从右往左的,先使用sass-loader将.less或.scss文件转换成css,再使用css-loader加载css文件,最后使用style-loader将css-lo...

2019-12-28 19:26:11 825

原创 继承

文章目录4.1 为什么需要继承4.2 类式继承4.2.1 原型链4.2.2 extend函数4.3 原型式继承4.3.1 对继承而来的成员的读和写的不对等性4.3.2 clone函数4.4 类式继承和原型链继承的对比4.5 继承与封装4.6 掺元类4.7 示例:就地编辑4.7.1 类式继承解决方案4.7.2 原型式继承解决方案4.7.3 掺元类解决方案4.8 继承的适用场合4.9 小结在Jav...

2019-12-01 15:15:15 809

原创 TypeScript

文章目录变量声明基本类型变量声明TypeScript支持var、let、const声明变量,我们知道,JavaScript是弱类型语言,声明变量时不指定变量的数据类型,可以给变量赋予任何数据类型的值,TypeScript与JavaScript不同的是在使用var、let、const声明变量时,可以指定变量的基本类型(当然也可以不指定)。例如:var a:number;a = 123;le...

2019-11-28 00:03:02 51

原创 nginx从零开始配置

文章目录Nginx介绍Nginx环境准备配置文件Nginx启动、停止自定义错误页访问控制虚拟主机设置基于端口号基于域名基于ip反向代理设置适配PC或移动设备Gzip压缩配置也入门前端挺久的了,但一直对Nginx的理解比较模糊,每次需要的时候就去百度如何配置,学习比较零散,本周末终于奋起看了一个非常系统的教程技术胖的博客,里面有非常详细的视频教程,而且免费!!!非常感谢技术胖的技术分享。Ngin...

2019-11-17 16:56:19 85

原创 Object.assign是浅拷贝

一直以为Object.assign是深拷贝

2019-11-06 20:43:47 32

原创 require.ensure:代码分割、按需加载

文章目录语法:dependenciescallbackchunkNamewebpack在编译时,会静态地解析代码中的require.ensure(),同时将模块添加到一个分开的chunk中,这个新的chunk会被webpack通过jsonp来按需加载。语法:require.ensure( [dependencies1, dependencies2], callback: functio...

2019-09-12 17:01:31 63

原创 YAML语言教程

文章目录YAML是什么YAML基础语法规则YAML例子说明YAML是什么YAML是专门用来写配置文件的语言,非常简介强大,远比JSON格式方便。YAML基础语法规则大小写敏感空格缩进表示层级关系,不允许使用tab缩进空格数目不重要,相同层级的元素左侧对其即可#表示注释,而json不允许有注释支持三种数据结构:对象、数组、纯量(单个的不可再分的值)数组以一组“-”开头的行...

2019-09-12 14:36:56 62

原创 js监听页面元素变化window.MutationObserver

相信前端开发同学都熟悉各种各样的监听事件,比如元素点击事件onClick,鼠标事件onMouseDown、onMouseHover,键盘按键onKeyDown,浏览器窗口改变事件onResize等等。那我们如何监听页面某个元素的属性变化呢?window.MutationObserver(callback)该接口用来观察节点变化,MutationObserver是一个构造器,接收一个回调函数c...

2019-08-20 23:30:10 2852

原创 正向代理和反向代理

什么是代理服务器代理服务器的功能是代理网络用户去取得网络信息。为什么代理服务器代理服务器是网络信息的中转站,是个人网络和Internet服务器之间的中间代理机构,负责转发合法的网络信息,对转发进行控制和登记。代理服务器作为链接Internet与Internet的桥梁,它可用于多个目的。提高访问速度。 目标主机返回的数据会存放在代理服务器中,下次客户再次访问时可直接从代理服务器中取。...

2019-08-20 23:09:21 51

原创 iframe跨域通信方法详解window.postMessage

文章目录window.postMessage()用法实例今天接到个需求,A页面中要嵌入一个iframe,这个iframe是B页面,此时A页面需要得到B页面的一些信息。window.postMessage()我们都知道浏览器的同源策略,即对于两个不同页面的脚本,只有当他们的页面具有相同的协议,端口号和主机(document.domain)时,两个脚本才能互相通信。window.postMes...

2019-08-03 14:15:57 751

原创 如何将clone下来的项目添加到自己的远程仓库

最近入职新公司在培训阶段,需要把培训需要开发的demo复制到自己的仓库,总结一下步骤:clone你需要的项目:git clone 代码地址进入项目目录:cd app-demo删除原有git信息,有问题一直回车即可rm -r .git初始化.git:git init将本地代码添加到仓库git add .git commit -m “说明…”...

2019-07-26 15:39:54 1642

原创 JavaScript中window对象的函数btoa和atob

前言atob和btoa是window对象的两个函数,用来编码解码Base64。有关Base64的编码解码规则可参考我的博客:js实现基于Base64的编码及解码btoabinary to ascii,用于将binary数据用ascii码表示。常用于编码字符串。var str = "This is a string";var encoded_str = btoa(str);consol...

2019-03-12 16:34:07 2099

原创 伪类和伪元素的区别

文章目录前言伪类伪元素区别前言在CSS1和CSS2中对伪类和伪元素没有做出很明显的区别定义,而二者在语法是一样的,都是以:开头,这造成很多人会将某些伪元素误认为是伪类,如:before,:after;而在CSS3给出的定义中,二者区别更为明显,也更容易理解。伪类伪类用于选择DOM树之外的信息,包含那些 匹配指定状态的元素 ,比如:visited,:active;或是 不能用简单选择器进行...

2018-12-08 19:21:29 3294 1

原创 关于window.getSelection

文章目录selection对象术语属性方法window.getSelection(),返回一个Selection对象,表示用户选择的文本范围或光标的当前位置。selection对象先来看下面两个selection结果:selection对象一:selection对象二:很奇怪,为什么同样选中一段文字,为什么selection对象的属性会不一样呢?那就需要明确一下Selection...

2018-12-08 19:20:56 7233

原创 div模拟input的placeholder属性

今天有做到这么一个需求,一个div输入框,它模拟input输入框,并且也模拟input输入框的placeholder属性,但是现在这个placeholder属性值并不是唯一确定不变的。这个div输入框其实是一个类似微信朋友圈的回复输入框一样,当输入为空的时候,要显示给用户 @了谁,所以这个placeholder的内容是会变化的。在网上查了几种方式,使用js操作代价太大,行内css又不支持伪类,...

2018-12-03 20:42:32 536

原创 nodejs--process对象

文章目录前言process对象前言相信前端开发的同学看到下面这些命令都会很熟悉吧:npm startnpm build...这其实是执行了start脚本,build脚本,在项目代码中我们也可以看到这些脚本的代码下面是我的项目中的start脚本'use strict';const path = require('path');const fs = require('fs');...

2018-11-19 20:36:21 1021

原创 dangerouslySetInnerHTML

将HTML字符串解析为html样式显示在table的扩展中。使用如下:其中必须将要渲染的字段变为 var html = {__html:description} 形式 。参照react官方文档例子:调用remarkable 的库,实时转换渲染 <textarea> 里的内容。class MarkdownEditor extends React.Component { co...

2018-11-17 10:02:03 749

原创 封装和信息隐藏

文章目录3.1 信息隐藏原则3.1.1 封装与信息隐藏3.1.2 接口扮演的角色3.2 创建对象的基本模式3.2.1 门户大开型对象3.2.2 用命名规范区别私用成员3.2.3 作用域、嵌套函数和闭包3.2.4 用闭包实现私用成员3.3 更多高级对象创建模式3.3.1 静态方法和属性3.3.2 常量3.3.3 单体和对象工厂3.4 封装之利3.5 封装之弊3.6 小结为对象创建私用成员是任何面...

2018-11-08 19:45:24 2044

原创 接口

文章目录2.1 什么是接口2.1.1 接口之利2.1.1 接口之弊2.2 其他面向对象语言处理接口的方式2.3 在JavaScript中模仿接口2.3.1 用注释描述接口2.3.2 用属性检查模仿接口2.3.3 用鸭式辨型模仿接口2.4 本书采用的接口实现方式2.5 Interface类2.5.1 Interface类的使用场合2.5.2 Interface类的用法2.5.3 示例:使用Inter...

2018-11-07 10:03:43 109

原创 《JavaScript设计模式》谢廷晟 译

文章目录单体模式工厂模式内置工厂对象迭代器模式装饰者模式策略模式外观模式代理模式中介者模式观察者模式单体模式单体模式思想在于保证一个特定类仅有一个实例,意味着当你第二次使用同一个类创建新对象时,应得到和第一次创建对象完全相同。工厂模式工厂模式是为了创建对象内置工厂对象Object()构造函数即为内置工厂对象。迭代器模式有一个包含某种数据集合的对象,该数据可能存储在一个复杂数据结构内...

2018-11-04 15:04:26 455

原创 富有表现力的JavaScript

文章目录1.1 JavaScript的灵活性1.2 弱类型语言1.3 函数是一等对象1.4 对象的易变性1.5 继承1.6 JavaScript中的设计模式1.7 小结本章将探讨一些令JavaScript如此富有表现力的特性。从中你可以体会到,这种语言允许你用各种方式完成同样的任务,还允许你在面向对象编程的过程中借用函数式编程中的概念来丰富其实现方式。本章揭示了究竟为什么应该使用设计模式,以...

2018-11-04 15:01:39 342

原创 移动端Web基础--Viewport

文章目录移动端的三个视口布局视口视觉视口理想视口要想深刻理解Viewport,需知道像素的有关知识。大家可以参照我前面总结的关于像素的博客:移动端Web基础–像素我们常常会看到这样一个标签<meta name="viewport" content="width=device-width, initial-scale=1.0, m

2018-11-02 10:46:48 784

原创 移动端Web基础--像素

文章目录设备像素物理像素独立像素像素密度(PPI)Retina设备像素对于设备来说,有两个设备像素:物理像素、独立像素。物理像素也可以称为屏幕分辨率,指设备屏幕上的显示的最小单元。比如iPhone 6 的屏幕分辨率为750像素*1334像素,表示在宽度上,有750个像素点,高度上有1334个像素点。可通过此链接查询设备物理像素。独立像素又称为CSS像素,这是一个抽象的概念,指的是W...

2018-11-01 10:30:24 223

原创 为什么JavaScript是单线程的?

单线程

2018-10-24 10:04:50 713

原创 纯CSS实现垂直居中

CSS垂直居中的方法

2018-10-22 23:31:30 249

原创 深入理解JavaScript的作用域

文章目录执行环境全局执行环境作用域链块级作用域我想说的话今天面试滴滴被问到JavaScript的作用域,不知道是脑子短路还是怎么,就只回答了:被一对{ }括起来的就是一个作用域。执行环境、全局执行环境、作用域链都没有提及到,回答的很是“肤浅”。或许是自己本身对这块知识就理解的不够深刻吧,那就从头来过吧!执行环境执行环境(Execution context)是JavaScript中最为重要的...

2018-10-22 15:50:15 182

原创 如何解决行内元素换行符产生的间隙

行内元素之间如果有换行,那么两个元素显示在一行的时候,会有一个间隙<!DOCTYPE html><html><head> <title></title&a

2018-10-20 21:28:42 815

原创 src与href的区别

文章目录hrefsrchrefhref(Hypertext Reference)超文本引用。用来建立当前元素和文档之间的链接。常用的有:link、a。例如:<link href="reset.css" rel=”stylesheet“/>浏览器会识别该文档为css文档,并行下载该文档,并且不会停止对当前文档的处理。这也是建议

2018-10-20 15:56:42 128

原创 link与@import的区别

两者都是外部引入CSS的方式,那么二者有什么区别呢?@import是CSS提供的语法规则,只有导入样式表的作用;link是HTML提供的标签,不仅可以加载CSS文件,还可以定义RSS,rel连接属性等;加载页面时,link引入的CSS被同时加载,@import引入的CSS将在页面加载完毕后加载;link标签作为HTML元素,不存在兼容性问题,而@import是CSS2.1才有的语法,故老版...

2018-10-20 15:53:42 3545

原创 HTML标签marquee实现滚动效果

https://blog.csdn.net/wuyou1336/article/details/52353803

2018-10-18 16:04:15 1475

原创 call、apply、bind区别

分析《笔试题》最后一题

2018-10-18 14:38:01 145

原创 HEAD detached from XXX

今天提交代码时不知道做了什么,使用git status查看状态时提示:HEAD detached from XXX这是HEAD处于游离状态了了,解决方案如下:创建一个新分支,并切换到该分支,将当前代码提交到该分支git branch tempgit checkout tempgit add .git commit -m "[xiaoxu][网络请求修改+代码bug修复]"git ...

2018-10-11 16:38:37 3779

原创 if语句里面如果是赋值语句

我们习惯了向if里面传递布尔值,如果为true就进入if语句块中;或者传入一个判断语句(表达式a==表达式b);或者传入数值,0为false,其他都为true。等等初学者很容易在传入判断语句的时候将==写成=,而导致代码失误,这时会有什么情况发生呢?编译器在编译代码的时候是不会报错的,程序可正常运行程序如何运行来看一下这段代码:#include<stdio.h>int ...

2018-10-09 21:39:23 7012 1

原创 深入理解setTimeout

文章目录什么是setTimeout?今天认认真真的去了解了一下setTimeout之后,我才发现,我以前可能对setTimeout有什么误解…什么是setTimeout?setTimeout(fun,time);//fun为一个函数,time为等待的时间。等待time时间后,把要执行的任务(fun)加入到Event Queue中,又因为是单线程任务要一个一个执行,如果前面的任务需要的时间太...

2018-10-08 20:11:26 222

原创 JavaScript实现各种排序算法

插入排序function insertSort(arr){ for(var i=1;i<arr.length;i++){ var temp=arr[i]; for(var j=i-1;j>=0;j--){ if(temp<...

2018-09-22 20:43:58 203

原创 详解CSS——display各个属性值(带例子)

各个属性详解

2018-09-21 23:42:19 2323

原创 找出数组中移除的数与重复的数

题目描述:数组arr为一乱序数组,但排序后是[1,2,3,4,5,…,n-1,n];从其中随机取出一个数,再随机将其中的一个数重复,数组大小还是为n,请设计一个O(n)的算法,找出取出的数与移除的数。例如:输入:6 4 5 1 5 3输出:2(移除的数),5(重复的数)思路:如果先将数组排序的话,可以很容易的找到了,可是排序算法时间复杂度最低为O(nlogn),不符合题目的O(n...

2018-09-21 10:30:38 235

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