
JavaScript
白兔仔
所知甚少,唯善学。
展开
-
手撕代码彻底理解Promise
手写Promise实现原理,理解其基本使用和使用场景。原创 2022-11-10 14:00:07 · 1001 阅读 · 0 评论 -
Js 继承机制的设计思想文章总结
参考原文1. js 的继承机制–原型链模式(prototype chain)在 js 中没有,子类、父类的概念,也没有类(calss)和实例(instance)区分,而是依靠原型链机制2. 为什么要这么设计从 js 诞生说起94 年网景公司发布 0.9 版本浏览器,但是只能用于浏览不具备交互能力,比如判断用户是否填写用户名,只能让服务器判断,这样做既浪费时间又浪费资源,网景公司急需一种网页脚本语言,使得浏览器可以与网页互动。此时的外界环境:面向对象编程(object-oriented原创 2020-12-18 16:34:53 · 177 阅读 · 1 评论 -
ES6初识
概述JavaScript发展历史1、目前用的版本是ECMAScript3.1,后来改了名字叫ECMAScript52、ECMAScript6的特点 ES6增添了许多必要的特性,例如模块和类,块级作用域,常量与变量3.检测浏览器的支持程度:http://kangax.github.io/compat-table/es6/4、可以通过Babel转码器把ES6写的代码转...原创 2019-02-13 13:34:40 · 200 阅读 · 0 评论 -
关于cookie总结
参考链接和推荐阅读彻底理解cookie,session,token (这篇介绍的很详细和清楚)原生JS操作Cookie-基础轻量级JS Cookie插件js-cookie的使用方法官方说明:js-cookie 的github地址npm安装js-cookieimport Cookies from 'js-cookie';//设置cookieCookies...原创 2019-03-19 13:40:52 · 206 阅读 · 0 评论 -
递归解决问题思路
/*先遍历节点,记录所有index, map的key是when的index, 值是这个when对应的要执行的代码对应的indexmap = { 0: [1, 2, 3], 4: [5, 6], 7: [8], 9: [10, 11]}*/var map = {};var whenIndexList = [] // 记录所有when的indexvar curWhenInde...原创 2019-04-29 21:20:11 · 300 阅读 · 0 评论 -
算法图解1.2二分查找(js版解析)
function binarySearch(mapData,item){ let low = 0; let high = mapData.length; while (low<=high){ mid = parseInt((low+high)/2); guess = mapData[mid] if(guess===it...原创 2019-05-15 23:10:26 · 241 阅读 · 0 评论 -
ChromeDevTools控制台报错 Uncaught SyntaxError: Identifier 'a' has already been declared
Uncaught SyntaxError: Identifier 'a' has already been declared注意es6语法,在控制台中依然一样原创 2019-05-21 22:37:32 · 17277 阅读 · 0 评论 -
js 二维数组和字符串互转
需求原因:项目游戏地图是二维数组,向后台post数据时需要将数据转为字符串类型。function arrToStr( objarr ){ var arrLen = objarr.length; var tree = "["; for (var i = 0 ;i < arrLen ; i++){ tree += "["; for(var ...原创 2019-07-01 14:58:10 · 7639 阅读 · 1 评论 -
vue nuxt项目中引入iframe页面中鼠标滑过事件mousemove
问题描述:vue项目,某个页面是左中右竖三栏布局,每个区域相互独立可以自由左右拉伸。使用组件vue-multipane demo页面因为我的项目右侧使用iframe,此插件没有考虑到这种情况导致在iframe页面的mousemove事件没有触发。/* 这样做将导致iframe页面内容不能点击 */iframe { pointer-events:none; }类似插件 :vue-sp...原创 2019-07-01 15:41:43 · 1912 阅读 · 1 评论 -
HTTP400错误 请求无效 (Bad request)
HTTP 400 Bad Request 响应状态码表示由于语法无效,服务器无法理解该请求。 客户端不应该在未经修改的情况下重复此请求。出现这个请求无效报错说明请求没有进入到后台服务里可能的原因:首先确定请求接口连接是否正确前端提交数据的字段名称或者是字段类型和后台的实体类不一致前端提交的到后台的数据应该是json字符串类型,而前端没有将对象转化为字符串类型;解决方案:前后台...原创 2019-07-01 18:28:58 · 13085 阅读 · 0 评论 -
深坑之图片资源加载状态:Status (blocked:other)
本地测试环境localhost报错首先:检查文件静态资源确实存在其次:引入路径没有问题。检查network请求状态如下:Status (blocked:other)![Status (blocked:other)]](https://img-blog.csdnimg.cn/20190701013626750.png)搜索出现问题的原因,找到相关文档 传送门: link.原因:浏览器使...原创 2019-07-01 01:47:35 · 3701 阅读 · 2 评论 -
拿到后台接口后要做的事情
首先把所有接口在postman里面跑一遍,以下是注意事项:get方法检查能否正确跑通此接口。在第一步的基础上,检查获取的数据里面的字段是否有你需要的字段。检查第二步字段的内容是否有且合理或正确。post方法一般都是使用json格式传输数据。检查接口能不能跑通 ,和后台确认需要的字段以及字段的数据类型。注意有的接口需要登陆后才能调用,在postman里先跑一下登陆接口,再...原创 2019-08-30 09:27:41 · 1253 阅读 · 0 评论 -
牛客 错题整理1
关于表单的 select option错误原题链接MDN参考果然还是学好英文重要,很多文档英文原版是很健全的,翻译成中文要么不全面要么不太能表达清楚意思。原题如何获取下面表单 select<form name="a"> <select name="a" size="1" id=”obj”> <option value="a">1</op...原创 2019-10-06 21:25:37 · 370 阅读 · 0 评论 -
Ajax(2)
Ajax上传上传只能用post的方式,并且后台需要处理中文 ajax对象.upload.onprogress 上传的进度事件 e.loaded 已经上传文件的大小 e.total 总文件的大小 new FormData() 用来创建与表单格式相同的数据,它是由XMLHttpRe...原创 2019-02-13 13:13:36 · 223 阅读 · 0 评论 -
Ajax(1)
AJAX即“Asynchronous JavaScript and XML”(异步的JavaScript与XML技术)Ajax是一种技术方案,但并不是一种新技术。它依赖的是现有的CSS/HTML/Javascript,而其中最核心的依赖是浏览器提供的XMLHttpRequest对象,是这个对象使得浏览器可以发出HTTP请求与接收HTTP响应。Ajax不属于JS核心语法(ECMA Scrip...原创 2019-02-13 13:02:02 · 235 阅读 · 0 评论 -
jQuery1
jQuery是一个JavaScript库作用:1. 提供强大的选择器、简洁的API、优雅的链式、便捷的操作 2. 核心理念 The Write Less,Do More(写更少,做更多) 3个大版本,N个小版本 1字开头的:做了很多低版本IE兼容处理的 2字开头的:基本抛弃了低版本IE(9以下) 移动先行 3...原创 2019-02-08 21:44:59 · 200 阅读 · 0 评论 -
package.json文件中 script字段 --摘自阮一锋日志
npm 允许在package.json文件里面,使用scripts字段定义脚本命令。{ // ... "scripts": { "build": "node build.js" }}上面代码是package.json文件的一个片段,里面的scripts字段是一个对象。它的每一个属性,对应一段脚本。比如,build命令对应的脚本是node build.js。命令行下使用np...转载 2018-05-28 23:32:37 · 9006 阅读 · 0 评论 -
移动端click事件延迟300ms问题(web页面点击没问题,手机端单击变成双击效果)
移动端300ms点击延迟和点击穿透问题详细原理参考https://www.jianshu.com/p/6e2b68a93c88(此文章内方法未测试,只参考原理)具体解决方案如下:(亲测有效)操作系统ubuntu18.4 64位因为历史原因,移动端点击事件会有300ms延迟,来判断用户是连续双击缩放还是点击跳转。即如果300ms内连续点击两次,则会理解为对页面进行缩放操作(当然前提是移动端页面设置为...原创 2018-06-20 18:46:55 · 1513 阅读 · 0 评论 -
常见前端问题汇总(1)
301重定向和302重定向的区别 http状态码301和302详解及区别——辛酸的探索之路 img 是不是DOM节点? 轮播图3D效果:参考链接地址 ajax中post方法传参数,会丢失&,%,+',要转义 ajax 设置Access-Control-Allow-Origin实现跨域访问 git拉取远程分支并创建本地分支 git回退到某个历史版本 git reset --...原创 2018-11-08 23:50:31 · 351 阅读 · 0 评论 -
鼠标移入div显示查看更多demo
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">原创 2018-12-19 22:53:26 · 1032 阅读 · 0 评论 -
JS获取设备横竖屏幕方向并监听变化
先上完整代码:var mql = window.matchMedia('(orientation: portrait)');console.log(mql);function onMatchMediaChange(mql){ if(mql.matches){ //竖屏 console.log('此时竖屏') }else{ /...原创 2018-12-16 15:50:24 · 3484 阅读 · 1 评论 -
跳转无效location.href
原因是 a标签的href跳转会执行在window.location.href之前执行解决办法:在js函数中加上window.event.returnValue=false问题展示:html:<div class="pub-header-menu"> <ul class="nav-content"> <li>&l...原创 2018-12-16 16:13:32 · 1771 阅读 · 0 评论 -
js获取窗口大小并监听窗口变化
demo: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&a原创 2018-12-16 21:19:57 · 13898 阅读 · 0 评论 -
Object.prototype.toString.call()方法
在JavaScript里使用typeof判断数据类型,只能区分基本类型,即:number、string、undefined、boolean、symbol。对于null、array、function、object来说,使用typeof都会统一返回object字符串。要想区分对象、数组、函数、单纯使用typeof是不行的。在JS中,可以通过Object.prototype.toString方法,...原创 2019-01-17 21:40:21 · 225 阅读 · 0 评论 -
Array.isArray()方法
用法: Array.isArray(object) 参数object:要检测的内容返回值返回值是布尔类型的。如果传进来的object是数组,返回true,如果不是数组,则返回false。 举例: Array.isArray([1, 2, 3, 4]); // --> truevar obj = { a: 1, b: 2};Arr...原创 2019-01-17 21:47:45 · 20960 阅读 · 1 评论 -
Two Sum 之javascript 解法
给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是,你不能重复利用这个数组中同样的元素。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]方法一...原创 2019-01-17 21:49:28 · 777 阅读 · 0 评论 -
正则匹配:match()、test()函数区别
首先要了解这点:match()函数是String对象的方法,参数是正则表达式,返回值是数组。test()函数是RegExp对象的方法,参数是字符串,返回值是boolean类型。match()举例一://test1var name = 'zhangsan';var a = name.match(/a/g);console.log(a);//["a", "a"]//...原创 2019-01-12 23:05:02 · 4666 阅读 · 0 评论 -
前端面试题目总结1
1. 非严格模式下写出下面表达式结果parseInt(“123a”)//123parseInt()方法首先查看位置0处的 字符,判断它是否是个有效数字;如果不是,该方法将返回NaN,不再继续执行其他操作。但如果该字符是有效数字,该方法将查看位置1处的字符,进行同样的 测试。这一过程将持续到发现非有效数字的字符为止,此时parseInt()将把该字符之前的字符串转换成数字。2....原创 2019-02-07 21:24:36 · 397 阅读 · 0 评论 -
js作用域和闭包
作用域变量或者函数可访问的一个范围,以函数来划分,一个函数块就是一个作用域范围:不在其为,不谋其政只有变量和函数有作用域全局作用域 全局:整个文档 变量或者函数在函数外面声明,那它们就是全局变量和全局函数 全局的作用范围是整个文档,在这个页面任何地方都可以访问到它们声明全局作用域的方法 1、变量或者函数放在函数外面声明 2、...原创 2019-02-07 23:54:13 · 154 阅读 · 0 评论 -
前端面试题目总结2
请问 a 的结果是什么? 作用域 变量声明 变量提升if(! "a" in window){ var a = 1;}alert(a);//javascript只有函数作用域, 没有块作用域,所以在if 里面的赋值语句 //var a = 1;等价于下面的代码var a ; //这个声明语句会被提升到代码顶部。 if(! "a" in window){ ...原创 2019-02-08 00:28:30 · 269 阅读 · 0 评论 -
js预解析题目
1. 定义预解析:在当前作用域下,js运行之前,会把带有var和function关键字的事先声明,并在内存中安排好。然后再从上到下执行js语句。预解析只会发生在通过var定义的变量和function上。2. var通过var关键字定义的变量进行预解析的时候:都是声明declare,不管它有没有赋值,都会赋值undefined。只要是通过var定义的,不管是变量,还是函数,都是先...原创 2019-02-08 13:22:00 · 1014 阅读 · 0 评论 -
HTTP头部信息(Request Headers请求头和Response Headers响应头)
Request Header(请求头)Accept:告诉服务器,浏览器能够处理的数据类型。(P575)Accept-Charset:浏览器能显示的字符集。Accept-Encoding:告诉服务器,客户机支持的数据压缩格式。Aceept-Language:浏览器当前设置的语言。Cache-Control:缓存控制,服务器通过控制浏览器要不要缓存数据Connection:处理原创 2018-06-24 15:36:51 · 10779 阅读 · 0 评论