
JavaScript
文章平均质量分 62
My_Bells
Not all heroes wear capes
展开
-
event.stopPropagation/event.preventDefault()/event.cancelBubble等Event属性含义
Event 接口表示在 DOM 中出现的事件。event.bubblesevent.cancelableevent.defaultPreventedEvent.cancelBubbleevent.preventDefault()event.stopImmediatePropagation();event.stopPropagation();原创 2022-03-23 19:55:42 · 1029 阅读 · 0 评论 -
js中冷门但常用的字符串api
String.prototype.charAt()charAt() 方法从一个字符串中返回指定的字符。str.charAt(index)如果指定的 index 值超出了该范围,则返回一个空字符串。var anyString = "Brave new world";console.log("The character at index 0 is '" + anyString.charAt(0) + "'");console.log("The character at index 1原创 2022-02-27 13:43:21 · 168 阅读 · 0 评论 -
MutationObserver监视对DOM树所做更改的能力
https://developer.mozilla.org/zh-CN/docs/Web/API/MutationObserverhttps://developer.mozilla.org/zh-CN/docs/Web/API/MutationObserver/MutationObserver// 选择需要观察变动的节点const targetNode = document.getElementById('some-id');// 观察器的配置(需要观察什么变动)const config = {原创 2021-06-09 15:18:48 · 224 阅读 · 0 评论 -
深入理解Web Components
1. 什么是Web Components?它的出现原因?为什么要学习它?Web Components 是一个浏览器原生支持的组件化方案,允许你创建新的自定义、可封装、可重用的HTML 标记。不用加载任何外部模块,直接就可以在浏览器中跑。它的出现原因?因为早期组件生态很乱,有各种各样的框架和库,都有各自的规范,导致一个团队切换框架很困难 。为了解决这种分化的形式,让 Web 组件模型统一化,所以才有了Web Components规范的出现。目标是提供一种权威的、浏览器能理解的方式来创建组件。为什么要学习原创 2021-05-21 19:51:08 · 12484 阅读 · 6 评论 -
二叉树相关概念和解题思路JS代码
1. 二叉树二叉树分为以下几类:二叉搜索树(BST树)、平衡二叉树(AVL树)、满二叉树、完全二叉树、红黑树。1.1 二叉搜索树(BST树)1.2 平衡二叉树(AVL树)1.3 满二叉树1.4 完全二叉树1.5 红黑树1. 广度优先遍历和深度优先遍历1.1 概念深度优先对每一个可能的分支路径深入到不能再深入为止,先序遍历、中序遍历、后序遍历属于深度优先。广度优先又叫层次遍历,从上往下,从左往右(也可以从右往左)访问结点,访问完一层就进入下一层,直到没有结点可以访问为止。广度遍历原创 2020-07-30 14:05:15 · 291 阅读 · 0 评论 -
js中使用window.Date获取服务器时间
js中使用window.Date获取服务器时间原创 2020-07-17 10:25:17 · 1399 阅读 · 0 评论 -
Object.defineProperty和Proxy区别
Object.definePropertyObject.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。IE8不兼容。Object.defineProperty(obj, prop, descriptor)参数obj: 要定义属性的对象。prop: 要定义或修改的属性的名称或 Symbol 。descriptor: 要定义或修改的属性描述符。返回值被传递给函数的对象。Object.defineProperty(obj,原创 2020-07-15 15:00:26 · 15465 阅读 · 4 评论 -
jQuery和lodash导致原型污染的安全问题
jQueryjquery3.4.0(3.4.0及以后版本已修复)之前版本中extend函数会导致原型污染。let a = $.extend(true, {}, JSON.parse('{"__proto__": {"devMode": true}}'))console.log({}.devMode); // jquery3.4.0版本前会输出true解决方法:在遍历对象时,当遇见 __p...原创 2020-04-09 15:16:16 · 1479 阅读 · 0 评论 -
Js模拟实现call、apply、bind、new原理
实现一个call函数call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。该方法的语法和作用与 apply() 方法类似,只有一个区别,就是 call() 方法接受的是一个参数列表,而 apply() 方法接受的是一个包含多个参数的数组。function.call(thisArg, arg1, arg2, …)Function.prototype.ca...原创 2020-03-09 13:38:00 · 580 阅读 · 0 评论 -
js实现一个Promises/A+ 规范的Promise
1.代码实现// promise 三个状态const PENDING = 'pending';const FULFILLED = 'fulfilled';const REJECTED ='rejected';class Promisex { constructor(fn){ if(typeof fn !== 'function') throw new Error('Promi...原创 2020-02-06 14:55:26 · 223 阅读 · 0 评论 -
Promise学习记录
1.Promise兼容性2.IE8中的Promise polyfill在ECMAScript 3中保留字是不能作为对象的属性名使用的。 而IE8及以下版本都是基于ECMAScript 3实现的,因此不能将 catch 作为属性来使用,也就不能编写类似 promise.catch() 的代码。而现在的浏览器都是基于ECMAScript 5的,而在ECMAScript 5中保留字都属于 Iden...原创 2020-02-05 01:10:56 · 217 阅读 · 0 评论 -
js表达式和运算符总结
1.条件(三元)运算符condition ? exprIfTrue : exprIfFalse除了 false,可能的假值表达式还有:null 、NaN 、 0 、空字符串( “” )、和 undefined 。如果 condition 是以上中的任何一个, 那么条件表达式的结果就是 exprIfFalse 表达式执行的结果。2.解构赋值//默认值var a, b;[a=5, b=7...原创 2019-11-29 08:51:30 · 412 阅读 · 0 评论 -
Javascript Object | MDN总结(2)
Object.prototype.constructor返回创建实例对象的 Object 构造函数的引用示例var a = [];a.constructor === Array; // truevar a = new Array;a.constructor === Array // truevar n = new Number(3);n.constructor === Numb...原创 2019-11-21 08:50:48 · 711 阅读 · 0 评论 -
Javascript Object | MDN总结(1)
Object 构造函数创建一个对象包装器。Object 构造函数为给定值创建一个对象包装器。如果给定值是 null 或 undefined,将会创建并返回一个空对象,否则,将返回一个与给定值对应类型的对象。//Object 构造函数的属性Object.length//值为 1。Object.prototype//Object 构造函数的方法Object.assign()Object....原创 2019-11-13 09:01:05 · 766 阅读 · 0 评论 -
Javascript Function | MDN总结
Javascript Function | MDN总结原创 2019-11-13 08:26:20 · 1381 阅读 · 0 评论 -
Javascript Array | MDN总结(2)
记录一些MDN中js Array不懂的地方和印象不深刻的方法、描述。原创 2019-11-09 00:59:37 · 1538 阅读 · 1 评论 -
Javascript Array | MDN总结(1)
记录一些MDN中js Array不懂的地方和印象不深刻的方法、描述。原创 2019-10-31 21:07:25 · 1350 阅读 · 0 评论 -
for in与for of区别
//for..in.. : for(var i in {a:1,b:2}){console.log(i)}//a,bfor(var i in [1,2]){console.log(i)}//0,1//在vue中v-for和for..in..不一样<div v-for="(item, index) in items"></div><div v-for="(v...原创 2019-07-18 22:37:11 · 420 阅读 · 0 评论 -
js递归解决父子关系问题
最近碰到的一个需求,记录下。问题是:如图所示,要给策略六所在行编辑的时候选择一个父策略,父策略下拉框数据要求来自列表授权策略名称列。限制条件是:不能是自身(这里也就是策略六),授权策略名称所在行的父策略不能是自身,同时要满足继承关系。(比如说:第三行中策略六是策略一的父策略,第一行中策略一又是策略五的父策略,那么策略五也就不能成为选择项)将上列表可以转换为流程图:策略四策略五策略一策略...原创 2019-07-12 15:42:16 · 1366 阅读 · 0 评论 -
js正则表达式分组
1. 正则基础2. 正则表达式中 分组理解与实例原创 2019-08-02 14:26:36 · 3289 阅读 · 0 评论 -
js中数组与对象的深拷贝与浅拷贝
分别测试Object.assign(),lodash中cloneDeep,slice,concat,[…],JSON.parse(JSON.stringify),js方法实现拷贝。1. Object.assign()2. lodash中cloneDeep3. slice4. concat5. 扩展运算符6. JSON.parse(JSON.stringify())7. js方法8. 自身属性和原型上的浅拷贝9. 利用7和8实现自身属性浅拷贝和原型上的深拷贝10. 利用9实现自身深拷贝原创 2019-08-29 17:36:54 · 176 阅读 · 0 评论 -
javascript对象的一些方法
1. 检测属性in运算符:如果对象的自有属性或继承属性中包含这个属性则返回true var o={x:1}; "x" in o;//true "y" in o;//false "toString" in o;truehansOwnProperty():检测属性是否是对象的自有属性var o={x:1} o.hansOwnProper...原创 2018-06-28 10:17:09 · 149 阅读 · 0 评论 -
JavaScript parseInt() 函数
parseInt() 函数解析一个字符串参数,并返回一个指定基数的整数 (数学系统的基础)。const intValue = parseInt(string[, radix]);string 要被解析的值。如果参数不是一个字符串,则将其转换为字符串(使用 ToString 抽象操作)。字符串开头的空白符将会被忽略,且一旦遇到不符合指定进制的字符便终止。radix 一个介于2和36之间的整数...原创 2019-07-10 09:37:07 · 840 阅读 · 0 评论 -
ES6中Class的用法和继承
1. 类的实例生成类的实例的写法,与 ES5 完全一样,也是使用new命令。前面说过,如果忘记加上new,像函数那样调用Class,将会报错。class Point { // ...}// 报错var point = Point(2, 3);// 正确var point = new Point(2, 3);与 ES5 一样,实例的属性除非显式定义在其本身(即定义在this...原创 2019-06-16 20:39:22 · 269 阅读 · 0 评论 -
js作用域之LHS与RHS查询
LHS和RHS的含义是“赋值操作的左侧或右侧”并不一定意味着就是“=赋值操作符的左侧或右侧”。赋值操作还有其他几种形式,因此在概念上最好将其理解为“赋值操作的目标是谁(LHS)”以及“谁是赋值操作的源头(RHS)”。 例: function foo(a){ var b=a; return a+b; } var c=foo(2);1.找出原创 2017-09-10 18:24:29 · 606 阅读 · 0 评论 -
JavaScript 执行机制
https://juejin.im/post/59e85eebf265da430d571f89转载 2019-05-27 10:54:09 · 320 阅读 · 0 评论 -
JavaScript深入之从原型到原型链
https://github.com/mqyqingfeng/Blog/issues/2原创 2019-05-27 10:31:01 · 208 阅读 · 0 评论 -
JS 中深拷贝的几种实现方法
JS 中深拷贝的几种实现方法1. 使用递归的方式实现深拷贝//使用递归的方式实现数组、对象的深拷贝function deepClone1(obj) { //判断拷贝的要进行深拷贝的是数组还是对象,是数组的话进行数组拷贝,对象的话进行对象拷贝 var objClone = Array.isArray(obj) ? [] : {}; //进行深拷贝的不能为空,并且是对象或者是 i...转载 2019-04-02 16:24:18 · 1738 阅读 · 0 评论 -
ajax中get和post方法给c#传数组
post方法 var arr=["a","b"] $.ajax({ type: "post", url: "../workgroup/GetMapListByView_Monitor_RealtimeInfoOfAll", tanditional:true, data:{arr:arr}...原创 2018-10-16 14:32:36 · 2938 阅读 · 1 评论 -
两个异步均执行结束,再同步执行第三个函数
1.js用Promise方法// 封装地形 GeoJSON 数据接口// 将每个数据接口封装为一个返回 Promise 的函数function getArea () { return new Promise((resolve, reject) => { fetch('./resources/china.json').then(resp => resp...原创 2018-08-07 11:32:19 · 4747 阅读 · 0 评论 -
jQuery数据缓存用法分析
本文分析了jQuery数据缓存用法。分享给大家供大家参考。具体如下:在jQuery的API帮助文档中,jQuery这样描述数据缓存的作用:用于在一个元素上存取数据而避免了循环引用的风险。一、定义缓存数据使用$(selector).data(name,value)方法可以为jQuery对象定义缓存数据。这些缓存数据被存放在匹配的DOM元素集合中所有DOM元素中。var $link...转载 2018-06-07 10:19:23 · 1100 阅读 · 0 评论 -
学习Javascript闭包(Closure)
闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现。转载 2017-08-10 17:41:00 · 192 阅读 · 0 评论 -
JavaScript中获取样式值的方法总结
本人经过整理总结出以下获取样式值的方法,如有错误请各位大佬指正。 有四种方法:style,currentStyle,getComputedStyle,rules 与 cssRules方法。原创 2017-08-13 10:31:00 · 638 阅读 · 0 评论 -
javascript之function用括号包起来
(function a(){}) (命名函数表达式)会返回这个函数(不会执行),但是在括号外面无法调用该函数,需要一个变量接收这个函数,var fun = (function a(){}),一般这个用在递归上,比如 var fact = (function f(num){ if(num === 1 ) return 1; else return num *转载 2017-08-11 15:58:26 · 2757 阅读 · 0 评论 -
使用Cesium动态绘制点、线、面、圆、矩形
将一下代码复制到https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/?src=Drawing%20on%20Terrain.html,查看Demo.var activeShapePoints = [];var activeShape;var floatingPoint;//查看器var viewer = new Cesium.Viewer...原创 2019-06-04 03:00:14 · 44610 阅读 · 38 评论 -
ES6箭头函数及箭头函数中this指向理解
1.如果没有参数var f = () => 5;2.一个参数:var f = v => v 或者 var f = (v) => v3.多个参数:var sum = (num1, num2) => num1 + num2;4.如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回。var sum = (num1, n...原创 2019-06-20 09:58:13 · 160 阅读 · 0 评论 -
js词法作用域之欺骗词法
如果词法作用域完全由写代码期间函数所声明的位置来定义,怎样才能在运行时来“修改”(欺骗)词法作用域。有两种机制来实现这个目的,但最好不要使用,欺骗词法作用域会导致性能下降。 1. evaleval函数可以接受一个字符串为参数,并将其中的内容视为好像在书写时就存在于程序中这个位置的代码。function foo(str,a){ eval(str);//欺骗 console.log(a,原创 2017-09-10 19:23:51 · 349 阅读 · 0 评论 -
js函数声明和函数表达式
区分函数声明和表达式最简单的方法是看function关键字出现在声明中的位置(不仅仅是一行代码,而是整个声明中的位置)。如果function是声明中的第一个词,那么就是一个函数声明,否则就是一个函数表达式。函数声明和函数表达式间最重要的区别是它们的名称标识符将会绑定在何处。匿名函数表达式,因为function()没有名称标识符。函数表达式可以是匿名的,而函数声明则不可以省略函数名。立即执行函数表达式原创 2017-09-10 19:55:42 · 205 阅读 · 0 评论 -
js块作用域
表面上看javascript并没有块作用域的相关功能。 一般来说for循环和if语句中定义的变量会被绑定在外部作用域。with关键字:用with从对象中创建出的作用域仅在with声明中而非外部作用域中有效。 try/catch的catch分句会创建一个块作用域,其中声明的变量仅在catch内部有效。let关键字:可以将变量绑定到所在的任意作用域中,通常是{..}内部。换句话说,let为其声明的变原创 2017-09-10 20:18:32 · 220 阅读 · 0 评论 -
js作用域之提升
当你看到var a=2;时,可能会认为这是一个声明。但js实际上回将其看成两个声明:var a;和a=2;。第一个定义声明是在编译阶段进行的。第二个赋值声明会被留在原地等待执行阶段。a=2;var a;console.log(a);//2console.log(a);//undefinedvar a=2;每个作用域都会进行提升操作。函数内部也会对变量进行提升(显然并不是提升到了整个程序的最上方原创 2017-09-10 20:45:07 · 474 阅读 · 0 评论