- 博客(41)
- 资源 (4)
- 收藏
- 关注
转载 JS完整实现深拷贝【循环引用,Set,Map...】
评价一个深拷贝是否完善,请检查以下问题是否都实现了: 基本类型数据是否能拷贝?键和值都是基本类型的普通对象是否能拷贝?Symbol作为对象的key是否能拷贝?Date和RegExp对象类型是否能拷贝?Map和Set对象类型是否能拷贝?Function对象类型是否能拷贝?(函数我们一般不用深拷贝)对象的原型是否能拷贝?不可枚举属性是否能拷贝?循环引用是否能拷贝? 怎样?你写的深拷贝够完善吗? 深拷贝的最终实现 这里先直接给出最终的代码版本,方便想快速了解的人查看,当然,你想一步步了解可以继续查看文.
2021-06-16 23:56:55 3451 2
转载 探究CSS3中的transition和transform属性
探究CSS3中的transition和transform属性开门见山的说,transition、transform和translate这三者经常有人搞混,先把这三者做一个简单解释:transform是 转换,指的是改变所在元素的外观,它有很多种手段(转换函数)来改变外观,例如 位移、缩放、旋转 等,而其中的位移的函数名就叫translate,所以说,translate是transform的一部分。transition是 过渡,指的是某个CSS属性值如何平滑的进行改变,就是平常说的 动效。而tra
2021-06-07 17:19:22 886
原创 React引用库文件用例
react用例react在html中需要用到直接饮用库文件,写react demo,需要引用以下包react.development.jsreact-dom.development.sbabel.min.js【注意】需要在script标签中声明是text/babel类型<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta
2021-06-05 23:18:51 350 2
转载 instanceof和typeof实现原理
instanceof 和 typeof 的实现原理typeof实现原理typeof一般用来判断一个变量的类型,如:number,string,object,boolean,function,undefined,symbol,bigint等类型,需要注意的是:typeof在判断非引用类型时可以清除的分辩出数据的类型,但判断引用类型时就只会返回 'object’var a = 'test'typeof a // => "string"var b = 321typeof b// =>
2021-05-23 20:05:45 266
原创 三列布局
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <style> .w
2021-05-17 23:58:18 80
转载 BFC块级格式化上下文
转载:什么是BFCBFC的定义:(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域,只有Block-level box参与, 它规定了内部的Block-level Box如何布局,并且与这个区域外部毫不相干。我们常说的文档流其实分为==定位流、浮动流和普通流==三种。而普通流其实就是指BFC中的FC。 FC是formatting context的首字母缩写,直译过来是格式化上下文,它是页面中的一块渲染区域,有一套渲染规则,决定了其子元素如何布局,以及
2021-05-07 11:24:53 249
转载 伪元素和伪类
伪元素和伪类转自:伪元素和伪类的区别总结 其中伪类和伪元素的根本区别在于:它们是否创造了新的元素。 伪元素/伪对象:不存在在DOM文档中,是虚拟的元素,是创建新元素。代表某个元素的子元素,这个子元素虽然在逻辑上存在,但却并不实际存在于文档树中。 伪元素选择符
2021-05-07 10:15:08 160
转载 面经系列
寒冬求职季之你必须要懂的原生JS(上)寒冬求职季之你必须要懂的原生JS(中)寒冬求职之你必须要懂的Web安全这儿有20道大厂面试题等你查收一位前端小姐姐的五万字面试宝典github实战项目
2021-05-05 15:04:20 86
原创 5.CSS---过渡线
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>画一个直线</title> <style> /*中间的过度的横线*/ .link-top { width: 50%; height: 1px; border-top: solid
2021-05-02 20:18:27 383
原创 redux和vuex异同点
redux和vuex相同点1.都是通过Store来作为全局状态的存储;2.不能直接修改Store中状态,(vuex中的mutation、redux中的reducer),只允许同步操作;redux和vuex不同点1.vuex只展示组件,全局根部植入直接访问store,而redux中展示组件通过容器组件连接store进行防伪;2.vuex自带module模块化功能,而redux没有;3.vuex中消除了action概念;4.vuex只适用于vue,而redux可以配合任何框架;5。vuex中异步
2021-05-02 20:17:07 955
转载 17.react-fiber
Fiber 原理React Fiber 原理介绍产生背景当页面元素较多,且需要频繁刷新的场景中,React 15会出现掉帧的现象;其根本原因:大量的同步计算任务,阻塞浏览器的UI渲染,默认情况下,JS运算和页面布局以及页面绘制是运行在浏览器主线程中,他们之间是互斥的关系,如JS运算持续占用主线程,页面就没法得到及时的更新;当调用setState更新页面的时候,React会遍历应用的所有节点,计算出差异,然后更新UI。整个过程一气呵成,不能被打断;如果页面元素过多,整个过程占用的时间就会超过16毫秒
2021-05-02 20:15:57 156
原创 17.ES6模块 VS CommonJs模块
ES6对比CommonJs模块模块CommonJsES6适用端服务端服务端 / 浏览器端[主要]输出值类型输出值得拷贝输出值的引用加载时机运行时加载编译时加载同步/异步require()同步加载import异步加载加载时机差异因为CommonJs加载的是一个对象(Module.exports导出的内容),该对象只有在脚本运行完毕才会生成;而ES6模块不是对象,其对外接口是一种静态定义,在静态解析阶段才会完成;输出值类型Comm
2021-05-02 20:14:00 114
转载 对称加密和非对称加密
浅谈对称加密与非对称加密在数字加密算法中,通过可划分为对称加密和非对称加密。一:什么是对称加密? 在对称加密算法中,加密和解密使用的是同一把钥匙,即:使用相同的密匙对同一密码进行加密和解密;加密过程如下:加密:原文 + 密匙 = 密文解密:密文 - 密匙 = 原文对称加密图解 例如:小明给小红发送微信消息表白,为了避免小红手机临时不在身边而导致消息被其他热看到,远原本小明计划发送”我爱你一生一世”,小明和小红使用一种约定好的暗语”5201314”来替代。当小红收到消息时,则自然明白
2021-05-02 19:02:12 645
转载 Promise.all实现原理
promise.all功能promise.all特点promise.all()的入参是一个数组,可以传基本类型,也可以传promise对象;返回结果是一个Promise对象;入参数组中每一个都返回成功,此函数才返回成功;只要有一个执行失败,则返回失败;使用案例Promise.all([1, read2(file1), 3]).then(data => { console.log(data)},error => { console.log(error)})
2021-04-20 16:05:34 2450
转载 浏览器如何显示页面(一)
浏览器输入网址后。。。浏览器输入网址到页面显示的完整过程:https://mp.weixin.qq.com/s/dVAPIv7toJLv06P8feUOUw1.输入网址:www.baidu.com ,回车后。。。。。。2.开始DNS查询;
2021-04-18 14:31:32 802
原创 1.CSS结构
CSS 基础知识1. CSS全称:层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。 CSS结构1. CSS由样式表组成;2. 样式表由规则构成;3. 规则由选择器+声明块构成;4. 声明块包含各类样式声明数据;5. 声明数据为CSS属性+CSS属性组成的键值对组成; <style> .ceshi{
2021-04-11 18:56:29 300
原创 2.CSS选择器
CSS选择器常用选择器种类1.通配符选择器 * *{margin:0; padding:2px}2.id选择器 #list{ margin:0; padding:0px; border:none; }3.类选择器 .类名 .list{ width:23px; }4.元素 元素名(如:p) p{ font-size:12px; }
2021-04-11 18:52:44 83 1
原创 2.vuex
Vue 生态篇为什么用Vuex?应用场景:当多个子组件共享一个属性值时,如何保证某个子组件修改该值后,其他组件都响应发生修改?方法1:在子组件的父组件,或者祖父组件,或者共有的祖先组件中定义该共有属性,通过层层传递的方式,修改组件对应的属性值【不推荐,层层嵌套,一层层传递,关系比较脆弱,且复杂】;方法2:通过provide/inject方法,进行状态的管理,但是这种provide/inject方法一般适用于结构不算复杂,或者几个组件之间的状态共享,如果逻辑结构复杂,这种方法就不适用了;并且prov
2021-04-11 17:39:44 92
原创 3.CSS -position定位
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <style> .l
2021-04-11 15:26:11 64
原创 4.CSS---三角形
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> .border-wrap {
2021-04-11 12:54:09 120 1
原创 3.Vue-Router
Vue传统开发模式中,每个页面对应着唯一的url如:www.xxx.com====》index.html,www.xxx.com/about=====》about.html等,此类多页面应用在切换页面时,页面需要整体刷新重绘,极大的影响性能,因此,出现SPA应用模式,即单页面应用。SPA应用结合router解决了页面不必要的重绘问题,因此Vue-Router的作用: (1)监听URL的变化,并在变化前后执行相应的逻辑; (2)不同的URL对应不同的组件; (3)提供多种方式改变URL
2021-04-10 12:27:50 228 1
转载 2.React/Redux/Saga/Dva对比
React 图解转载:https://www.yuque.com/flying.ni/the-tower/tvzasn按照 React 官方指导意见, 如果多个 Component之间要发生交互, 那么状态(即: 数据)就维护在这些 Component 的最小公约父节点上, 也即是 <App/><TodoList/> <Todo/>以及<AddTodoBtn/>本身不维持任何 state, 完全由父节点<App/>传入 props以决定其展现
2021-04-07 00:16:40 616 1
原创 6.防抖和节流
防抖/节流目录防抖/节流一、什么是防抖和节流?二、什么是节流?1.引入库2.读入数据总结一、什么是防抖和节流?示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、什么是节流?1.引入库代码如下(示例):2.读入数据代码如下(示例):该处使用的url网络请求的数据。总结提示:这里对文章进行总结:例如:以上就是今天要讲的内容,本文仅仅简单介绍了pandas的使用,而pandas提供了大量能使我们快速便捷地处理数据的函数和方法。...
2021-04-06 01:02:14 249 3
原创 5.Ajax(一)
Ajax1.什么是Ajax?Ajax : Asynchronous JavaScript and XML(异步的 JavaScript 和 XML);特点:在不刷新网页的前提下,向服务器发送http请求,并且获得响应;AJAX = 异步JavaScript 和XML;是一种用于创建快速动态网页的技术;与后台服务器进行少量数据交换,无刷新地实现异步更新比较:传统方式(不适用AJAX),必须重载整个网页,即刷新2.什么是XML?XML:可扩展标记语言;XML 被设计用于传输和存储数
2021-04-02 16:07:13 70
原创 4.Promise常规用法
Promise.catch()注意:只要.then()抛出异常,就立即停止后续代码的执行,直接被.catch()捕获异常;new Promise((resolve, reject) => { console.log('初始化'); resolve();}).then(() => { throw new Error('有哪里不对了'); console.log('第一个回调then');}).catch(() => { consol
2021-04-02 16:04:59 118
原创 Table行自动滚动
scrollTop/clientHeight/scrollHeight实现自行滚动// 注意:设置interval循环计数器,不用时需要clearInterval(interValId.current),避免造成内存泄漏interValId.current = setInterval(() => { scorllRow(); }, 100);const scorllRow = () => { // 获取table中table-body的Dom元素 const ta
2021-04-02 13:43:34 1980
原创 Modal框的显示隐藏
/* * @Descripttion: * @version: * @Author: MingChenglong * @Date: 2021-03-17 11:44:22 * @LastEditors: MingChenglong * @LastEditTime: 2021-04-01 15:48:34 */import React, { useState, useEffect } from 'react';import { connect } from 'dva';import { T
2021-04-01 23:55:19 1412
原创 3.NodeJs(一)
NodejsNodejs出现背景当浏览器向服务器发送请求,服务器根据请求查询数据库并返回浏览器,在传统Web服务中(如Apache),每个请求都会在服务器端创建一个新的线程进行处理,但是在整个过程中,读取数据库操作因物理条件受到限制,即I/O会形成阻塞,此时创建的线程就必须等待I/O的处理结果,如果请求较多,此时产生的多个线程会持续占用服务器内存,影响服务器性能解决方法:Nodejs使用事件轮询,异步API,非阻塞I/O来解决;如图二,当多个请求发生时,每个请求创建一个回调函数,并且进入线程池
2021-03-31 23:40:48 95
原创 2.事件循环
事件轮训宏任务/微任务宏任务分类: setTimeout setInterval requrestAnimationFrame宏任务所处的队列就是宏任务队列第一个宏任务队列中只有一个任务: 执行主线程的js代码宏任务队列可以有多个注意:当宏任务队列的中的任务全部执行完以后,会先查看是否有微任务队列;如果有先执行微任务队列中的所有任务,如果没有就查看是否还有有宏任务队列微任务分类: new Promise().then(回调) process.nextTick微任务所处的队
2021-03-09 09:31:57 178 1
原创 1.JS数据类型
数据类型基础数据1. 基础数据类型在内存中,以键值对的形式存储在栈内存中;引用类型1. 引用数据类型的存储,如下图所示,栈内存中存放的是变量名及对应值的内存引用地址; 浅拷贝/深拷贝浅拷贝: 指的是直接将a变量赋值给b变量,当a为基本数据类型时,a,b的值相互独立,即基本数据类型的拷贝;当a变量为引用类型时,浅拷贝获得的b变量对应的内存引用地址与a相同,因此修改任一变量都会影响另一个变量;深拷贝: 特指引用类型数据的拷贝赋值,对应引用类型数据的拷贝,即引用类型变量a赋值给变量b,实现
2021-03-04 11:51:58 109
转载 二、computed 和 watch,method
computed 和 watch,method二者都可用于监听某个数据的变化,进而处理Data数据,进行页面重新渲染;<div id="myDiv"> <input type="text" v-model="firstName"> <input type="text" v-model="lastName"> <input type="text" v-model="fullName"></div>computed用
2020-08-19 00:15:42 116
转载 一、Require函数
Require函数Require函数: 用于引入模块、 JSON、或本地文件。 可以从 node_modules 引入模块。 可以使用相对路径(例如 ./、 ./foo、 ./bar/baz、 …/foo)引入本地模块或 JSON 文件,路径会根据 __dirname定义的目录名或当前工作目录进行处理// 引入本地模块:const myLocalModule = require('./path/myLocalModule');// 引入 JSON 文件:const jsonData = req.
2020-08-13 00:02:04 3044
原创 Android应用——Fragment(碎片)【1】
为了让界面可以在平板上更好地展示,Android在3.0版本引入了Fragment(碎片)功能,它非常类似于Activity,可以像Activity一样包含布局。Fragment通常是嵌套在Activity中使用的,现在想象这种场景:有两个Fragment,Fragment 1包含了一个ListView,每行显示一本书的标题。Fragment 2包含了TextView和ImageView,来显示书的详细内容和图片。
2017-11-10 10:57:17 352
Storm分布式实时计算模式PDF
2017-09-12
数据挖掘:概念与技术----韩家炜
2016-11-10
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人