javascript
ken_ding
这个作者很懒,什么都没留下…
展开
-
升级打怪-精读javascript高级程序设计(BOM篇复盘)
BOM客户端检测原创 2020-11-26 14:52:18 · 86 阅读 · 0 评论 -
升级打怪-精读javascript高级程序设计(第九章)
BOMwindow对象原创 2020-11-24 17:50:03 · 169 阅读 · 2 评论 -
升级打怪-精读javascript高级程序-(ECMAScript篇复盘)
总结原创 2020-11-09 14:41:22 · 107 阅读 · 0 评论 -
升级打怪-精读javascript高级程序设计(第五章)
引用类型Object类型Array类型Date类型RegExp类型Function类型基本包装类型单体内置对象Object类型原创 2020-10-25 23:12:09 · 256 阅读 · 0 评论 -
升级打怪-精读javascript高级程序设计(第四章)
变量,作用域和内存问题理解基本类型和引用类型的值理解执行环境理解垃圾收集基本类型和引用类型的值动态属性定义基本类型和引用类型的方式类似操作基本类型和引用类型的方式不同基本类型,无法动态添加属性var name=“tom”;name.age=27;console.log(name.age);//undefined引用类型值可以动态添加属性var person = new Object();person.name="tom";console.log(person.n原创 2020-10-21 22:32:03 · 119 阅读 · 0 评论 -
升级打怪-精读javascript高级程序设计(第三章)
基本概念语法关键字和保留字变量数据类型操作符语句函数语法区分大小写ECMAScript中的一切(变量,函数名和操作符)都是区分大小写var demo="123"var Demo="456"//区分大小写console.log(demo);console.log(Demo);标识符定义:变量,函数,属性的名字,或者函数的参数。格式规则:第一个字符必须是一个字母,下划线(_)或者一个美元号($)其他字符可以是字母,下划线,美元符号或数字不推荐使用ASCII或Un原创 2020-10-21 00:55:29 · 229 阅读 · 4 评论 -
升级打怪-精读javascript高级程序设计(第二章)
在HTML中使用JavaScriptscript元素属性asyncasync的设置,会使得script脚本异步的加载并在允许的情况下执行async的执行,并不会按着script在页面中的顺序来执行,而是谁先加载完谁执行。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=dev原创 2020-10-18 02:30:34 · 143 阅读 · 2 评论 -
手写一个Redux简易版(一)
前言好像React技术中,最难理解的好像是Redux,为了让自己对Redux理解比较深刻一点,就写了这一篇文章,用来揭开Redux神秘的面纱。需要实现功能createStoresubscribedispatchgetStatereplaceReduceractionreducercombineReducersapplyMiddlewarebindActionCreators具体流程先抛一个问题:如何监听一个数据变化,并且可以通知所有的依赖碰到这个问题是不是想到o原创 2020-10-17 20:29:41 · 363 阅读 · 0 评论 -
升级打怪-精读javascript高级程序设计(第一章)
第一章背景为了完成简单的表单验证,避免频繁的与服务器交换数据。创作历程1995年2月,Netspece公司的布兰登·艾奇,开发LiveScript,后改名JavaScript1.0随后发布JavaScript1.11997年,以JavaScript1.1为蓝本组件TC39,发布ECMA-2621998年,ISO/IEC采用ECMScript作为标准(即ISO/IEC-16262)整体内容核心(ECMAScript)文档对象模型(DOM)浏览器对象模型(BOM)ECMScrip原创 2020-10-16 13:18:59 · 145 阅读 · 2 评论 -
webpack-dev-server启动报错Error: Cannot find module ‘webpack-cli/bin/config-yargs‘
异常场景异常原因由于webpack-cli版本4,删除了webpack-cli/bin/config-yargs文件,看图bin目录下没有config-yargs.js解决方案图上显示我们要下载webpack-cli版本3的依赖,流程如下:1.卸载webpack-clinpm uninstall webpack-cli 2.安装webpack-cli版本3npm install webpack-cli webpack-cli@3.3 -S打完收工...原创 2020-10-14 15:30:35 · 1932 阅读 · 5 评论 -
手写一个react-router-dom简易版(二)
接上面的一篇《手写一个react-router-dom简易版(二)》HashRouter原创 2020-10-14 11:10:10 · 109 阅读 · 1 评论 -
手写一个react-router-dom简易版(一)
背景自从接触处前端路由以来,一直想对前端路由深入理解,由于只会在项目中使用,无法深入其原理,遇到一些疑难问题容易只知其一不知其二,所以本文主要从零到一实现一个简易react-router-dom(纯底层实现)路由原理后端路由路由这个概念最先是后端出现的。响应的过程:浏览器发出请求服务器监听到80端口(或443)有请求过来,并解析url路径根据服务器的路由配置,返回相应信息(可以是 html 字串,也可以是 json 数据,图片等)浏览器根据数据包的Content-Type来决定如何解原创 2020-10-12 21:31:17 · 230 阅读 · 1 评论 -
Promise源码解读(二)-手写promise剩余方法实现
// 判断变量否为function const isFunction = variable => typeof variable === 'function' // 定义Promise的三种状态常量 const PENDING = 'PENDING' const FULFILLED = 'FULFILLED' const REJECTED = 'REJECTED' class MyPromise { constructor (handle) { if (原创 2020-10-09 17:14:47 · 214 阅读 · 0 评论 -
Promise源码解读(一)-手写一个promise
一个 Promise有以下几种状态:pending: 初始状态,既不是成功,也不是失败状态。fulfilled: 意味着操作成功完成。rejected: 意味着操作失败。我们先实现下面这种效果:new MyPromise(function(resolve,reject){ resolve(123)}).then((v)=>{ console.log(v);//123});MyPromise类class MyPromise(){ static PNEDING='pend原创 2020-09-30 12:56:41 · 189 阅读 · 0 评论 -
js处理excl文件转化成json
如何将选择的文件转为json数据1.将 xlsx.full.min.js 导入到页面中;2.然后通过 FileReader 对象读取文件利用 js-xlsx 转成 json 数据将得到的json数据渲染到页面上代码实例如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8...原创 2019-02-19 13:31:26 · 546 阅读 · 0 评论 -
大数据如何在前端流畅展示
如果要在前端呈现大量的数据,一般的策略就是分页。前端要呈现百万数据,这个需求是很少见的,但是展示千条稍微复杂点的数据,这种需求还是比较常见,只要内存够,javascript 肯定是吃得消的,计算几千上万条数据,js 效率根本不在话下,但是 DOM 的渲染浏览器扛不住,CPU 稍微搓点的电脑必然会卡爆。策略:显示三屏数据,其他的移除 DOM。一、 策略下面是我简单勾画的一个草图,我们把一串数据...原创 2019-01-22 21:36:56 · 10740 阅读 · 1 评论 -
整理 node-sass 安装失败的原因及解决办法
node-sass 安装失败的原因npm 安装 node-sass 依赖时,会从 github.com 上下载 .node 文件。由于国内网络环境的问题,这个下载时间可能会很长,甚至导致超时失败。这是使用 sass 的同学可能都会遇到的郁闷的问题。解决方案就是使用其他源,或者使用工具下载,然后将安装源指定到本地。解决方法一:使用淘宝镜像源(推荐)设置变量 sass_binary_site...原创 2019-01-02 16:31:02 · 84021 阅读 · 9 评论 -
安装vue-cli时-4058报错的解决方法
一,报错信息安装vue-cli时-4058报错二,解决方法终端运行以下指令npm --registry https://registry.npm.taobao.org info underscore而后运行下面的指令cnpm install --global vue-cli终端运行下面的指令查看vue版本vue --version...原创 2018-12-13 09:49:49 · 443 阅读 · 0 评论 -
for..in,for..of和forEach的区别
forEachforeach遍历数组的话,使用break不能中断循环,使用return也不能返回到外层函数。for..in使用for in 也可以遍历数组,但是会存在以下问题:1.index索引为字符串型数字,不能直接进行几何运算2.遍历顺序有可能不是按照实际数组的内部顺序3.使用for in会遍历数组所有的可枚举属性,包括原型。例如上栗的原型方法method和name属性所以for in更适合遍历原创 2017-11-15 21:39:34 · 358 阅读 · 0 评论 -
vueJS组件
什么是组件:组件是Vue.js最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码。在较高层面上,组件是自定义的元素,Vue.js的编译器为它添加特殊功能。在有些情况下,组件也可以是原生HTML元素的形式,以is特性扩展。 如何注册组件? 需要使用Vue.extend方法创建一个组件,然后使用Vue.component方法注册组件。Vue.extend方法格式如下:var MyC原创 2017-11-21 23:26:06 · 531 阅读 · 0 评论 -
js数组去重
1.双重循环var ary=[1,2,3,3,2,3,4,5];for(var i=0;i<ary.length;i++){ for(var j=i+1;j<ary.length;j++){ if(ary[i]===ary[j]){ ary.splice(i,1); i--; } }}2.新数组 var ary=[1,2,3,3,2,3,4,5]原创 2017-12-20 09:04:47 · 161 阅读 · 0 评论 -
callback使用与闭包
function a(callback){ callback()}a(function(err,data){ if(err){ console.log(err) }else{ var data="成功" console.log(data) } })如上简单的函数解析:(个人理解)1.当a函数调用时,传进了一个回原创 2017-12-12 11:16:20 · 743 阅读 · 0 评论 -
理解node中的require和exports
js模块的实现node中模块的实现,其实是依赖于闭包的,也就是说,module,exports其实都是外部传入的参数,这个简化形式如下:function NativeModule(id){ this.id=id; this.filename=id+".js"; this.exports={};}NativeModule.require=function(id){原创 2017-12-13 22:24:24 · 314 阅读 · 0 评论 -
js-对象深入学习
对象创建直接量:let obj={x:1};//具有prototype属性new方式:let obj=new Array();//具有protope属性Object方法:Object.create(原型);//对象属性的查询与设置let obj={x:1,y:2};obj.x//1obj["y"]//2ps:查询一个对象不存在的属性不会报错,如果在对象自身的属性或继...原创 2018-03-27 17:46:44 · 157 阅读 · 0 评论 -
前端缓存策略与基于Webpack的静态资源版本管理
为什么要做HTTP缓存 自Web2.0开始,随着Web产品和服务花样不断增加,网站的体积也开始变得越来越大。今天,体积过M的网站早已屡见不鲜。像facebook、twitter、淘宝、京东这样的网站,首屏的体积甚至接近10M(其中包含不少的部分是懒惰加载的图片)。如果不做前端缓存,每次打开网站都去服务器拉取,一个是绝大部分为重复的静态文件,浪费服务器网络资源;二是响应时间往往要在十几秒甚至二十秒...原创 2018-04-23 21:18:20 · 2165 阅读 · 0 评论 -
js中"Maximum call stack size exceeded"解决方法
错误直译过来就是“栈溢出”,出现这个错误的原因是因为我进行了递归运算,但是忘记添加判断条件,导致递归无线循环下去。。原创 2018-05-29 14:37:34 · 103423 阅读 · 0 评论 -
node.js async/await 继发执行与并发执行
async/await 继发执行与并发执行,看如何控制两个异步函数 foo barfunction foo() { return new Promise((resolve, reject) => { setTimeout(() => { console.log('foo:' + new Date().toLocaleStrin...原创 2018-07-25 13:42:33 · 2922 阅读 · 1 评论 -
document.compatMode介绍
对于document.compatMode,很多朋友可能都根我一样很少接触,知道他的存在却不清楚他的用途。今天在ext中看到 document.compatMode的使用,感觉这个对于我们开发兼容性的web页面还是很有帮助,我们都知道,IE对盒模型的渲染在 Standards Mode和Quirks Mode是有很大差别的,在Standards Mode下对于盒模型的解释和其他的标准浏览器是一样,...原创 2018-08-28 10:40:14 · 216 阅读 · 0 评论 -
高德地图PlaceSearch.clear()无法调用问题
高德地图JS-API,使用PlaceSearch搜索地址,在地图上产生Marker,但是在调用PlaceSearch.clear()之后,Marker并没有被清除。这个问题困扰了我好几天了。高德官方参考手册相当简单:https://lbs.amap.com/api/javascript-api/reference/search#m_AMap.PlaceSearch通过文档,确实没有办法找到问题...原创 2018-09-28 10:50:30 · 1742 阅读 · 2 评论 -
js判断浏览器内核 及ie的版本问题
首先说一下当前各大内核Trident: IE 以Trident 作为内核引擎 // 俗称 IE内核Gecko: Firefox(火狐) // 俗称Firefox内核WebKit: Safari(苹果), Google Chrome(谷歌),傲游3 基于 Webkit 开发 ...原创 2018-10-25 15:19:54 · 3722 阅读 · 1 评论 -
vue响应式原理(双向绑定)-1
首先将该任务分为几个子任务:输入框以及文本节点与data中的数据绑定输入框内容变化时,data中的数据同步变化。即view=>model的变化data中的数据变化时,文本节点的内容同步变化。即model=>view的变化。任务一:数据初始化绑定了解文档片段(DocumentFragment)DocumentFragment(文档片段)可以看作节点容器,它可以包含多个子节...原创 2018-11-18 13:27:59 · 179 阅读 · 0 评论 -
前端实现下载/导出的几种方式
1.iframe方式:function download () { var exportLink = '...' //看清楚!这边自己加下载链接!!! var iframe = document.createElement('iframe') iframe.src = exportLink iframe.style.display = 'none' doc...原创 2018-11-29 17:34:40 · 4621 阅读 · 0 评论 -
自执行函数
1.在JavaScript里,任何function在执行的时候都会创建一个执行上下文,因为为function声明的变量和function有可能只在该function内部,这个上下文,在调用function的时候,提供了一种简单的方式来创建自由变量或私有子function。如下:// 由于该function里返回了另外一个function,其中这个function可以访问自由变量i// 所有说,这个原创 2017-11-28 20:05:59 · 554 阅读 · 0 评论