
JavaScript
yusirxiaer
前端移动端一路の风景
展开
-
JS两个对象数组过滤掉相同的对象
JS两个对象数组过滤掉相同的对象原创 2022-06-06 22:22:53 · 1928 阅读 · 0 评论 -
.slice(0)
高手代码里看到.slice(0),查了下这样写的好处:1.对原数组进行深拷贝,这样进行一系列操作的时候就不影响原数组了;2.将类数组对象转化为真正的数组对象:var anchorArray = [].slice.call(document.getElementsByTagName(‘a’), 0);//用[]这原生数组提供的slice方法,将document.getElementsB...原创 2022-02-13 18:46:18 · 957 阅读 · 2 评论 -
读javascript百炼成仙笑死笔记一
“自然是这样的,但是我现在这样改一下,你说结果是多少呢?”叶小凡诡异地笑了笑,然后打出一段比较奇特的代码。var a = 1;var b;var sum = (b = a++ + --a) + a-- + b++;“噗!”看到这段代码,对面弟子差点一口老血喷出来,破口大骂:“叶小凡,你……你……你欺人太甚!”“呵呵,这位师兄,这可怨不了我,再说了,互相切磋技艺也是演武场的规矩啊。”叶小凡回想起这段被叶老折磨的日子,再看到面前这位弟子的表情,顿时开心了不少。其实这道题目就是平时叶老给叶小凡原创 2022-01-09 12:07:56 · 509 阅读 · 0 评论 -
Vue/Angular中父窗口新开的子窗口关闭的时候刷新父窗口
最近遇到一个项目需求:Angular中父窗口新开的子窗口提交完信息关闭的时候刷新父窗口。知识点:window.opener概述返回打开当前窗口的那个窗口的引用,例如:在window A中打开了window B,B.opener 返回A.语法var objRef = window.opener;例子 if (window.opener != indexWin) { referToTop(window.opener); }备注如果当前窗口是由另一个窗.原创 2021-12-20 23:06:28 · 925 阅读 · 0 评论 -
promise并发
一、Pomise.all的使用Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时,成功和失败的返回值是不同的,成功的时候返回的是一个结果数组,而失败的时候则返回最先被reject失败状态的值。let p1 = new Promise((resolve, reject) => { resolve('成功了')})let p2 = new Promise((resolve, reject) => { resolve('success')原创 2021-09-14 15:33:24 · 1009 阅读 · 0 评论 -
JavaScript 中 obj.hasOwnProperty(prop) 方法
语法obj.hasOwnProperty(prop)参数prop要检测的属性的String字符串形式表示的名称,或者Symbol。返回值用来判断某个对象是否含有指定的属性的布尔值Boolean。描述所有继承了Object的对象都会继承到hasOwnProperty方法。这个方法可以用来检测一个对象是否含有特定的自身属性;和in运算符不同,该方法会忽略掉那些从原型链上继承到的属性。备注即使属性的值是null或undefined,只要属性存在,...原创 2021-07-01 16:48:00 · 1691 阅读 · 0 评论 -
事件冒泡 bubbles cancelBubble stopPropagation() stopImmediatePropagation() 区别
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>事件冒泡</title> </head> <body> <input type="text" id="test"> <button type="button" id="btn" style="height: 30px;width: 200px;">.原创 2021-04-04 17:47:44 · 245 阅读 · 0 评论 -
js 操作location URL对象进行操作
把location 创建URL对象构造器new URL()创建并返回一个URL对象,该URL对象引用使用绝对URL字符串,相对URL字符串和基本URL字符串指定的URL。属性hash包含'#'的USVString,后跟URL的片段标识符。host一个USVString,其中包含域(即主机名),后跟(如果指定了端口)“:”和URL的端口。hostname包含 URL 域名的USVString。href包含完整 URL 的USVString。orig...原创 2021-02-25 11:00:46 · 682 阅读 · 0 评论 -
JS 常用字符串数组遍历函数方法整理
目录一、concat()二、join()三、push()四、pop()五、shift()六、unshift()七、slice()九、substring() 和 substr()十、sort 排序十一、reverse()十二、indexOf 和 lastIndexOf十三、every十四、some十五、filter十六、mapES6新增新操作数组的方法1、find():2、findIndex():3、fill():4、copyWi原创 2020-11-10 15:15:04 · 3359 阅读 · 0 评论 -
js的array.some()方法
定义和用法some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会依次执行数组的每个元素:如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测。 如果没有满足条件的元素,则返回false。注意:some() 不会对空数组进行检测。注意:some() 不会改变原始数组。检测数组中是否有值满足函数指定的条件cons...原创 2020-03-16 16:38:07 · 2981 阅读 · 1 评论 -
链式调用setTimeout()与setInterval()的区别
使用 setTimeout()和 setInterval()创建的定时器可以用于实现有趣且有用的功能。执行时机是不能保证的,因为在页面的生命周期中,不同时间可能有其他代码在控制 JavaScript 进程。在页面下载完后的代码运行、事件处理程序、Ajax 回调函数都必须使用同样的线程来执行。实际上,浏览器负责进行排序,指派某段代码在某个时间点运行的优先级。有关于js的单线程请点击:浏览器的多进程...原创 2019-09-24 10:55:26 · 376 阅读 · 0 评论 -
网页里如何使用js禁用控制台
网页里如何禁用右击事件?使用jQuery,几句代码就可以搞定了document.oncontextmenu = function(){return false;}简单示例:js实现:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> &...原创 2019-08-06 16:59:30 · 6132 阅读 · 1 评论 -
修改系统默认 alert 弹框样式
修改默认 alert 弹框,思路很简单,定义一个 alert(e) 函数,加载最开头即可。css部分:<style> #msg{ width:266px; position: fixed; z-index:999; top: 49%; margin-top:-80px; l...原创 2018-12-21 16:21:46 · 15945 阅读 · 2 评论 -
判断JavaScript对象为null或者属性为空
首先说下null与undefined区别:对已声明但未初始化的和未声明的变量执行typeof,都返回"undefined"。null表示一个空对象指针,typeof操作会返回"object"。一般不显式的把变量的值设置为undefined,但null相反,对于将要保存对象的变量,应明确的让该变量保存null值。var bj;alert(bj); //"undefined"b...原创 2018-11-30 16:50:58 · 6679 阅读 · 0 评论 -
js利用HTML5的拖拽API做流程图
上代码直接用看效果,学习一下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css&原创 2018-09-05 15:42:26 · 7796 阅读 · 2 评论 -
掌握ES6/ES2015核心内容
ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准。因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015。也就是说,ES6就是ES2015。虽然目前并不是所有浏览器都能兼容ES6全部特性,但越来越多的程序员在实际项目当中已经开始使用ES6了。所以就算你现在不打算使用ES6,但为了看懂别人的你也该懂点ES6的语法了...在我们正式讲解ES6语...原创 2018-06-21 15:43:04 · 254 阅读 · 0 评论 -
Underscore.js常用方法介绍
Underscore.js是一个很精干的库,压缩后只有4KB。它提供了几十种函数式编程的方法,弥补了标准库的不足,大大方便了JavaScript的编程。MVC框架Backbone.js就将这个库作为自己的工具库。除了可以在浏览器环境使用,Underscore.js还可以用于Node.js。Underscor.js定义了一个下划线(_)对象,函数库的所有方法都属于这个对象。这些方法大致上可以分成:集...原创 2018-06-11 15:32:03 · 465 阅读 · 0 评论 -
Javascript重温OOP之原型与原型链
prototype原型对象每个函数都有一个默认的prototype属性,其实际上还是一个对象,如果被用在继承中,姑且叫做原型对象。在构造函数中的prototype中定义的属性和方法,会被创建的对象所继承下来。举个栗子:function F(){}F.prototype.work = function(){ console.log('F is working..');};var f =...原创 2018-05-11 16:08:18 · 227 阅读 · 0 评论 -
document.createDocumentFragment 以及创建节点速度比较
document.createDocumentFragmentdocument.createDocumentFragment()方法创建一个新空白的DocumentFragment对象。DocumentFragments是DOM节点。它们不是主DOM树的一部分。通常的用例是创建文档片段,将元素附加到文档片段,然后将文档片段附加到DOM树。在DOM树中,文档片段被其所有的子元素代替。因为文档片段存在...原创 2018-05-02 17:16:18 · 1495 阅读 · 0 评论 -
js实用算法
判断文本是否为回文定义:如果将一个文本翻转过来,能和原文本完全相等,那么就可以称之为“回文”。方法一(字符串、数组内置方法)123456789101112131415/** 判断文字是否为回文* @param {string|number} val 需要判断的文字* @return {boolean} bool 是否为回文 */function isPalindrome1(val){ // 允许输...原创 2018-04-13 17:25:53 · 289 阅读 · 0 评论 -
JavaScript 字符串处理方法总结
变量从字符串转换成int和float型 var weightincrease = "2.5kg";undefinedparseInt(weightincrease);2parseFloat(weightincrease);2.5字符串处理方法var words = "鱼神是个帅哥";undefinedwords.length6words.ch原创 2017-02-27 12:05:55 · 258 阅读 · 0 评论 -
JavaScript 数组处理方法总结
数组处理方法//定义数组var array = [];undefined//查看类型typeof(array);"object"//往数组里添加数据array = ['first','second','third']["first", "second", "third"]//数组长度array.length3//索引array[0]"first"//添加数组新内容array原创 2017-02-27 12:06:44 · 289 阅读 · 0 评论 -
JS ===和==区别
这是一种隐式类型转换var a = 12;var b = '12';alert(a == b);//先把两边的转换成一样的,再进行比较 。结果会返回truealert(a === b);//不转换两边类型,直接比较,结果返回false原创 2017-04-07 11:56:41 · 257 阅读 · 0 评论 -
(function ( ){...})( ) IIFE 的原理
你需要明白 IIFE 的原理,我简单说一下:function foo() {...} // 这是定义,Declaration;定义只是让解释器知道其存在,但是不会运行。foo(); // 这是语句,Statement;解释器遇到语句是会运行它的。IIFE 并非必须,传统一点可以这么写:function foo() {...}foo原创 2017-03-14 16:35:29 · 1880 阅读 · 0 评论 -
JS 中的return false的作用
在大多数情况下,为事件处理函数返回false,可以防止默认的事件行为.Return False 就相当于终止符,终止默认的事件行为,反之,Return True 就相当于执行符,执行终止默认的事件行为。在js中return false的作用一般是用来取消默认动作的。比如你单击一个链接除了触发你的onclick时间(如果你指定的话)以外还要触发一个默认事件就是执行页面的跳转。所以如果你想取消原创 2017-03-15 15:02:57 · 7090 阅读 · 0 评论 -
JS性能优化之文档碎片-document.createDocumentFragment
讲这个方法之前,我们应该先了解下插入节点时浏览器会做什么。 在浏览器中,我们一旦把节点添加到document.body(或者其他节点)中,页面就会更新并反映出这个变化,对于少量的更新,一条条循环插入也会运行很好,也是我们常用的方法。代码如下: for(var i=0;i){ var op = document.createElement("span"原创 2017-06-06 14:56:52 · 472 阅读 · 0 评论 -
window.onload和$(document).ready(function(){})的区别
前段时间在面试之前查找并整理了一下window.onload和$(document).ready(function(){})区别,今天有时间更到我的博客上,由于本人资历尚浅,如有不对的地方,还请指正。原文出自:http://www.php100.com/html/program/jquery/2013/0905/5954.html 1、执行时间上的区别:window.onl原创 2017-06-07 10:50:52 · 297 阅读 · 0 评论 -
用Canvas画圆环百分比进度条
canvas圆环进度 *{padding: 0; margin: 0; } .circle{width: 200px;height: 200px;margin: 20em auto;position: relative;} canvas{display: block;margin: 0;position: absolute;background: white;left: 0;t原创 2017-07-17 16:48:50 · 6192 阅读 · 2 评论 -
自执行匿名函数剖析整理
格式: (function(){ //代码 })();解释:这是相当优雅的代码(如果你首次看见可能会一头雾水:)),包围函数(function(){})的第一对括号向脚本返回未命名的函数,随后一对空括号立即执行返回的未命名函数,括号内为匿名函数的参数。来个带参数的例子: (function(arg){原创 2017-07-18 11:59:04 · 228 阅读 · 0 评论 -
原生js来实现对dom元素class的操作方法
jQuery操作class的方式非常强大写了一个利用原生js来实现对dom元素class的操作方法1.addClass:为指定的dom元素添加样式2.removeClass:删除指定dom元素的样式3.toggleClass:如果存在(不存在),就删除(添加)一个样式4.hasClass:判断样式是否存在下面为一toggleClass的测原创 2017-08-16 11:49:39 · 4059 阅读 · 0 评论 -
JSON.parse和JSON.stringify方法
JSON.parse()JSON.parse()方法将json字符串转化为Javascript值或对象。语法JSON.parse(text[,reviver])参数text:要被解析成Javascript值的字符串reviver:若是一个函数则规定了原始值(text)如何被解析改造,在被返回前。示例JSON.parse('{}'); //原创 2017-08-16 14:46:34 · 1748 阅读 · 0 评论 -
JavaScript-内存空间
深入了解js这门语言后,才发现它有着诸多众所周知的难点(例如:闭包、原型链、内存空间等)。有的是因为js的设计缺陷导致的,而有的则是js的优点。不管如何,总需要去学会它们,在学习过程中我觉得只看别人的文章并不能做到深刻理解,所以我决定写这一系列的文章来记录我所学习到的知识点,也方便自己以后回顾,如有写错的地方欢迎指正。 废话不多说,马上进入正题!一、基本数据类型和引用类型JS中原创 2017-07-28 17:27:58 · 389 阅读 · 0 评论 -
javascript-排序算法
插入排序算法描述: 1. 从第一个元素开始,该元素可以认为已经被排序 2. 取出下一个元素,在已经排序的元素序列中从后向前扫描 3. 如果该元素(已排序)大于新元素,将该元素移到下一位置 4. 重复步骤 3,直到找到已排序的元素小于或者等于新元素的位置 5. 将新元素插入到该位置后 6. 重复步骤 2~5现有一组数组 arr = [5, 6, 3,原创 2017-07-28 17:33:22 · 277 阅读 · 0 评论 -
Javascript面向对象编程:构造函数的继承
今天要介绍的是,对象之间的"继承"的五种方法。比如,现在有一个"动物"对象的构造函数。 function Animal(){ this.species = "动物"; }还有一个"猫"对象的构造函数。 function Cat(name,color){ this.name = name; thi原创 2017-10-11 16:17:35 · 197 阅读 · 0 评论 -
javascript对URL中的参数进行简单加密处理
javascript的api本来就支持Base64,因此我们可以很方便的来进行编码和解码。var encodeData = window.btoa("name=xiaoming&age=10")//编码var decodeData = window.atob(encodeData)//解码。下面来个具体的例子来说明如何对url中参数进行转码,并取得解码后的参数原创 2017-11-10 17:14:06 · 14551 阅读 · 0 评论 -
Array.prototype.slice.call(arguments)
Array.prototype.slice.call(arguments)能将具有length属性的对象转成数组,除了IE下的节点集合(因为ie下的dom对象是以com对象的形式实现的,js对象与com对象不能进行转换)如:1 var a={length:2,0:'first',1:'second'};2 Array.prototype.slice.call(a);// [原创 2017-12-13 16:48:58 · 218 阅读 · 0 评论 -
常用的javascript设计模式
请坚持什么是设计模式百度百科: 设计模式(Design pattern)是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。 使用设计模式是为了可重用代码、让代码更容易被他人理解、保证代码可靠性。 毫无疑问,设计模式于己于他人于系统都是多赢的;设计模式使代码编制真正工程化;设计模式是软件工程的基石脉络,如同大厦的结构一样。 实际情原创 2017-12-13 17:17:45 · 190 阅读 · 0 评论 -
JS生成动态表格并为每个单元格添加单击事件的方法
Demo function getColumnDetail(column) { column.style.color = "blue"; //将被点击的单元格设置为蓝色 alert(column.innerHTML); //弹出被点单元格里的内容 } function setTable(trLineNumber, tdData) { v原创 2017-03-03 15:56:36 · 14860 阅读 · 0 评论