前端基础
文章平均质量分 51
前端基础
teng28
这个作者很懒,什么都没留下…
展开
-
CSS多行内容展开收起自动隐藏
CSS多行内容展开收起自动隐藏原创 2022-09-30 09:42:41 · 565 阅读 · 1 评论 -
如何绘制一条0.5px的直线
如何绘制一条0.5px的直线原创 2022-03-14 11:09:37 · 467 阅读 · 0 评论 -
webpack的热更新原理
webpack的热更新原理原创 2022-03-14 11:09:23 · 111 阅读 · 0 评论 -
lodash的作用与常见API
lodash的作用与常见API原创 2022-03-14 11:08:45 · 1595 阅读 · 0 评论 -
webpack是什么?
webpack是什么?原创 2022-03-14 11:08:25 · 218 阅读 · 0 评论 -
json和jsonp的区别,ajax和jsonp的区别
json和jsonp的区别,ajax和jsonp的区别...原创 2022-03-14 11:08:11 · 150 阅读 · 0 评论 -
http的请求方式
http的请求方式原创 2022-03-14 11:06:58 · 112 阅读 · 0 评论 -
前端角度如何做好SEO
前端角度如何做好SEO原创 2022-03-14 11:06:36 · 334 阅读 · 0 评论 -
session、cookie、localstorage、sessionstorage的作用与区别
session、cookie、localstorage、sessionstorage的作用与区别原创 2022-03-14 11:05:57 · 167 阅读 · 0 评论 -
强缓存和协商缓存
强缓存和协商缓存原创 2022-03-14 11:05:30 · 336 阅读 · 0 评论 -
实现跨域的几种方法
实现跨域的几种方法原创 2022-03-14 11:05:05 · 3820 阅读 · 0 评论 -
网页的重绘与重排以及重构
网页的重绘与重排以及重构原创 2022-03-11 18:00:06 · 585 阅读 · 0 评论 -
防抖与节流的实现原理和区别
防抖与节流的实现原理和区别原创 2022-03-11 17:59:43 · 147 阅读 · 0 评论 -
图片的懒加载是怎么实现的
图片的懒加载是怎么实现的原创 2022-03-11 17:59:17 · 867 阅读 · 0 评论 -
常见的盒子垂直居中的方法
常见的盒子垂直居中的方法原创 2022-03-11 15:12:52 · 124 阅读 · 0 评论 -
数据类型的判断的方法以及它们的优缺点、区别
数据类型的判断的方法以及它们的优缺点、区别原创 2022-03-11 15:12:13 · 352 阅读 · 1 评论 -
常见的布局方法以及它们的优缺点
常见的布局方法以及它们的优缺点原创 2022-03-11 15:07:00 · 1776 阅读 · 0 评论 -
清除浮动的方法
清除浮动的方法原创 2022-03-11 15:06:35 · 50 阅读 · 0 评论 -
什么是BFC?
BFC(Block formatting context)直译为“块级格式化上下文”。BFC它是一个独立的渲染区域,只有Block-level box(块元素)参与,它规定了内部的Block-level box如何布局,并且与这个区域外部毫不相关。可以理解成:创建了 BFC的元素就是一个独立的盒子,里面的子元素不会在布局上影响外面的元素(里面怎么布局都不会影响外部),BFC仍属于文档中的普通流不是所有的元素,模式都能产生BFC。BFC的布局规则内部的Bo原创 2022-03-11 15:06:02 · 3833 阅读 · 0 评论 -
js事件委托(事件代理)的原理以及优缺点
js事件委托/事件代理的原理以及优缺点什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件。也就是利用冒泡的原理,把事件加到父级上,触发执行效果。好处1: 提高性能我们可以看一个例子:需要触发每个li来改变他们的背景颜色。<ul id="ul"> <li>aaaaaaaa</li> <li&g原创 2022-03-01 16:40:14 · 8460 阅读 · 0 评论 -
js中的set与map
js中的set与map简述:Set 和 Map 主要的应用场景在于 数据重组 和 数据储存。Set 是一种叫做集合的数据结构,Map 是一种叫做字典的数据结构。集合 与 字典 的区别:共同点:集合、字典 可以储存不重复的值不同点:集合 是以 [value, value]的形式储存元素,字典 是以 [key, value] 的形式储存集合(Set):ES6 新增的一种新的数据结构,类似于数组,成员唯一(内部元素没有重复的值)。且使用键对数据排原创 2022-03-01 16:40:01 · 5486 阅读 · 0 评论 -
js实现数组排序
js实现数组排序冒泡排序 function arrSort(arr){ for(var i = 0;i<arr.length-1;i++){ for(var j = 0;j<arr.length-1-i;j++){ if(arr[j]>arr[j+1]){ var temp ; temp = arr[j+1];原创 2022-03-01 16:39:34 · 286 阅读 · 0 评论 -
js数组去重方法
js数组去重方法for循环嵌套,利用splice去重:此方法是比较常用的方法之一,也是es5中比较实用的方法之一。话不多说,上代码:function newArr(arr){for(var i=0;i<arr.length;i++){ for(var j=i+1;j<arr.length;j++){ if(arr[i]==arr[j]){ //如果前者等于后者,splice方法删除后者 arr.splice(j,1);原创 2022-03-01 16:39:17 · 56 阅读 · 0 评论 -
什么是递归,递归有哪些优点和缺点?
什么是递归,递归有哪些优点和缺点?递归: 直接或间接调用自身算法的过程使用递归的条件:子问题为同类事物,且更简单必须有个出口优点:代码简洁符合思维习惯,容易理解缺点:效率较低递归层次太深,耗内存且容易栈溢出一定要使用的话,最好使用缓存避免相同的计算,限制递归调用的次数举个例子(0-100求和)方法一function sumFunc(num, start) { num += start start++; if (start >原创 2022-03-01 16:39:01 · 2459 阅读 · 0 评论 -
js中的this的指向
js中的this的指向this指向详情解析在普通函数中,this指向window function fn() { console.log(this); // window } fn(); // window.fn(),此处默认省略window在构造函数中,this指向创建的对象 function Person(age, name) { this.age = age; this.name = name co原创 2022-03-01 16:38:45 · 78 阅读 · 0 评论 -
js中常见的继承
js中常见的继承原型链继承// 1.原型链继承/* 缺点:所有属性被共享,而且不能传递参数*/function Person(name,age){ this.name = name this.age = age}Person.prototype.sayName = () =>{ console.log(this.name)}function Man(name){}Man.prototype = new Person()Man.prototype原创 2022-03-01 16:38:26 · 53 阅读 · 0 评论 -
js中的闭包
js中的闭包闭包的定义闭包是指有权访问另一个函数作用域中变量的函数。创建闭包的最常见的方式就是在一个函数A内创建另一个函数B,通过函数B访问函数A的局部变量。(js高级教程)手写一个简单的闭包function f1() { var n = 999; function f2() { console.log(n); } return f2;}var result = f1();result(); // 999上面代码中,函数f1的返回值就原创 2022-03-01 16:38:12 · 88 阅读 · 0 评论 -
原型和原型链
原型和原型链原型所有引用类型都有一个__proto__(隐式原型)属性,属性值是一个普通的对象所有函数都有一个prototype(原型)属性,属性值是一个普通的对象所有引用类型的__proto__属性指向它构造函数的prototype var a = [1,2,3]; a.__proto__ === Array.prototype; // true原型链当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的__proto__隐式原原创 2022-03-01 16:37:57 · 40 阅读 · 0 评论 -
async和await的作用
async和await的作用async/await是一种建立在Promise之上的编写异步或阻塞代码的新方法,被普遍认为是js一步操作的最终且最优雅的解决方案。相对于Promise和回调,它的可读性和简洁度都更高。一直.then()也不好看。所以从语义上就很好理解 async用于声明一个function是异步的,而await用于等待一个异步方法执行完成。一个函数如果加上async,那么该函数返回的是一个Promiseasync function test() { return "1"}co原创 2022-03-01 16:37:36 · 2271 阅读 · 0 评论 -
深拷贝与浅拷贝
什么是深拷贝、什么是浅拷贝?参考地址:深浅拷贝什么是浅拷贝与深拷贝?浅拷贝:就是拷贝对象的引用,而不深层次的拷贝对象的值,多个对象指向堆内存中的同一对象,任何一个修改都会是使得所有对象的值被修改,因为它们公用一条数据;深拷贝不会拷贝引用类型的引用,拷贝的是引用类型的值,形成一个新的引用类型。实现深拷贝的几种方法。使用递归的方式实现深拷贝//使用递归的方式实现数组、对象的深拷贝function deepClone1(obj) {//判断拷贝的要进行深拷贝的是数组还是对象,是数组原创 2022-02-25 11:23:35 · 49 阅读 · 0 评论 -
js常用的字符串方法
js常用的字符串方法ES5concat(string…)连接多个字符串不改变原数组var str = 'a'console.log(str.concat('b','c')) //'abc'replace(regexp/substr, replacement)字符串替换如果第一个参数传入的是子字符串或是没有进行全局匹配的正则表达式,那么replace()方法将只进行一次替换(替换最前面的),返回经过一次替换后的结果字符串不改变原数组var str = 'abcabcabcd'c原创 2022-02-25 11:14:06 · 93 阅读 · 0 评论 -
js中数组的几种循环方式
js中数组的几种循环方式for循环最基本的循环方式,不多说。这种最基本的循环才是速度最快的,效率最高的。for(var i = 0;i<5;i++){ console.log(i)}for in循环用来遍历对象的。要知道JavaScript对象的所有属性都是字符串,不过属性对应的值可以是任意数据类型。(注意:遍历时不仅能读取对象自身上面的成员属性,也能遍历出对象的原型属性)let obj = {a:1, b:2, c:3};for (let prop in obj) { //p原创 2022-02-25 11:10:25 · 15217 阅读 · 1 评论 -
js常用的数组方法
js常用的数组方法concat():连接两个或更多的数组,并返回结果 var arr = new Array(3) arr[0] = 1 arr[1] = 2 arr[2] = 3 console.log(arr.join()) //1,2,3join():把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。参数可选,指定要使用的分隔符,如果省略则默认使用逗号作为分隔符 var arr = new Array(3) arr[0] = 1 ar原创 2022-02-25 11:07:37 · 66 阅读 · 0 评论 -
js的执行机制
js的执行机制javascript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事,这是因为 javascript 这门脚本语言诞生的使命所致-------javascript 是为处理页面中用户的交互,以及操作DOM而诞生的,比如我们对某个DOM 元素进行添加和删除操作,不能同时进行,应该先进行添加,之后再删除。单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务,这样所导致的问题是:如果JS执行的时间过长,这样就会造成页面的渲染不连贯,导致页面渲染加载阻塞的感觉。原创 2022-02-25 10:33:29 · 127 阅读 · 0 评论 -
js的数据类型
js的数据类型基本类型引用类型基本类型Underfined ,Null, Boolean,Number,String,Symbol引用类型Object,Array,Date,Function原创 2022-02-25 10:15:00 · 43 阅读 · 0 评论 -
js中var、let、const的区别
js中var、let、const的区别如果使用关键字 var 声明一个变量,那么这个变量就属于当前的函数作用域,如果声明是发生在任何函数外的顶层声明,那么这个变量就属于全局作用域。var a = 1; //此处声明的变量a为全局变量function foo(){ var a = 2;//此处声明的变量a为函数foo的局部变量 console.log(a);//2}foo();console.log(a);//1如果在声明变量时,省略 var 的话,该变量就会变成全局变原创 2022-02-25 10:13:21 · 188 阅读 · 0 评论 -
css3新增特性
css3新增特性选择器:伪类和伪元素(根本区别在于它们是否创造了新的元素(抽象))背景和边框文本效果2D/3D转换动画、过渡多列布局用户界面选择器:伪类和伪元素(根本区别在于它们是否创造了新的元素(抽象))伪类:用于向某些选择器添加特殊的效果(没有创建新元素):last-child /* 选择元素最后一个孩子 */:first-child /* 选择元素第一个孩子 */:nth-child(1) /* 按照第几个孩子给它设置样式 */伪类:用于向某些选择器添加特殊的效果(没有创建新元素)原创 2022-02-25 10:06:58 · 58 阅读 · 0 评论 -
html5的新增特性
html5的新增特性语义标签增强型表单视频和音频Canvas绘图SVG绘图地理定位(Geolocation)拖放API(Drag and drop)WebWorkerWebStorage语义标签header,nav,footer,aside,article,section增强型表单新的表单元素<input><textarea><select><option>…<datalist>:数据列表,为input提供输入建议列表<原创 2022-02-25 09:41:21 · 336 阅读 · 0 评论 -
es6的新增特性
es6有哪些新特性变量的改变模版字符串(``)箭头函数循环字符串新增api变量的改变用来声明变量(块级作用域)const 用来表示常量(块级作用域)模版字符串(``)字符串拼接。将表达式嵌入字符串中进行拼接。用${}来界定。console.log(hello ${name}) //hello lux在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。es6直接使用``箭头函数不需要function关键字可以省略return关键字继承当前上下文的this关键原创 2022-02-25 09:30:54 · 233 阅读 · 0 评论 -
JS中bignumber处理高精度小数运算的使用
JS中使用bignumber处理高精度小数运算安装或引用bignumber.js API地址:静态方法实例方法项目开发中发现精度丢失的问题,如0.1+0.2 = 0.30000000000000004的问题解决方式:引用bignumber.js用于数字精度要求较高的计算。安装或引用下载地址:https://github.com/MikeMcl/bignumber.js/releases或 npm install bignumber.js --save 命令安装后使用 import BigNum原创 2021-09-07 14:49:55 · 1561 阅读 · 0 评论