JS
文章平均质量分 88
半仙code
各位老铁 如果对我写的一些博文有问题的可以加我QQ:1023047818 共同学习 fighting!!!
展开
-
Promise实现原理浅析
Promise函数总体架构结构图#mermaid-svg-ODmq6aQf592tKUAy .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-ODmq6aQf592tKUAy .label text{fill:#333}#mermaid-svg-ODmq6aQf592tKUAy .node rect,#merm转载 2021-04-16 17:36:49 · 157 阅读 · 0 评论 -
js防抖的一些疑问解答:为什么addEventListener调用防抖可以,onClick不行
刚学习防抖/节流的时候就一直有一个疑问:为啥addEventListener调用防抖函数可以,但是我再HTML里写onClick方法就不行呢?百思不得其解,后来还是屈服了,用了addEventListener,但是后来学到了vue.....这下不能这么干了(因为vue不建议直接操作dom)懵圈了,在仔细整理闭包后才知道原因:这种防抖函数(生成器)的原理是防抖函数每执行一次返回一个受time变量控制的函数!上代码:/** * 防抖函数 * @param {*} func 回调函数 必传...原创 2020-09-02 22:55:35 · 1699 阅读 · 1 评论 -
iframe嵌套导致的无法获取serial
问题描述:当自己的页面被第三方嵌套时,无法获取serial,单独打开页面就没有这个问题刨析:新版谷歌浏览器采取了更严格的cookie管理策略,所以当老系统写的不严谨没有显示的加上serial时就会出现问题解决方法:1.最笨的办法是获取本页面的serial 并显示的为所有ajax代码加上serial2.在页面的ready函数里加上ajax拦截器 $.ajaxSetup({ data:{ "serial": getParam("serial").trim() } });原创 2020-08-13 17:53:56 · 323 阅读 · 0 评论 -
观察者模式浅析
//儿子class mySon { constructor(name) { this.name = name; this.status = "笑了"; this.arr = []; } //将家长插入监控组 attach(item) { debugger this.arr.push(item); } changeStatus(newStatus) { if (newStatus !== this.status) { //变化状态 .原创 2020-07-13 21:21:08 · 176 阅读 · 0 评论 -
手写实现防抖与节流
part1 防抖<!DOCTYPE html><html><!-- 防抖 --><!-- 防抖就是在n秒内 防止连续触发,在n秒内触发了下一次,那就重新计算 --><body> <div id="content" style="height:150px;line-height:150px;text-align:center; color: #fff;background-color:#ccc;font-size:原创 2020-06-29 11:54:47 · 2202 阅读 · 0 评论 -
深入理解call、apply、bind等及手写实现
part0前言这三种方式 不管是哪一种其实都是通过复制目标属性并将调用目标的方法实现。比如这个应用场景:对象调用Array的sort方法==》Array.sort(obj)part1 call///call bind apply的应用 ///call let PeoSon = { name: "里", say(param) { console.log(this); console.log(`我是${this.name}`) co.原创 2020-06-28 21:18:18 · 186 阅读 · 0 评论 -
为什么要用添加原型的方法丰富js自定义构造函数
在js面向对象思想里,所有方法都要交给不同对象来实现具体功能,那么问题来了。我们怎么来创建对象,京可能优雅的方式创建对象呢?老夫写代码要考虑优雅?不存在的,那就一把梭!<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title></head><body> <script> function原创 2020-05-25 08:05:03 · 119 阅读 · 0 评论 -
柯里化初步探究
柯里化代码://柯里化 提升性能 function coliTem(obj) { console.log(obj) return function mystyle(path) { console.log(obj.name + " " + path) } } let obj = { name: "张山" } debugg...原创 2020-05-08 12:06:56 · 100 阅读 · 0 评论 -
es6数组遍历
## ES5-数组的新方法### forEach`forEach()` 方法对数组的每个元素执行一次提供的函数。功能等同于`for`循环.应用场景:为一些相同的元素,绑定事件处理器!**需求:遍历数组["张飞","关羽","赵云","马超"]**```javascriptvar arr = ["张飞","关羽","赵云","马超"];//第一个参数:element,数组...原创 2020-01-17 15:03:38 · 394 阅读 · 0 评论 -
js之垃圾回收机制
js就像java一样拥有自动分配内存+垃圾回收机制在写代码的时候不注意就会造成内存泄漏解决方案:1.引用计数算法var a={ a:1}//计数1var b=a;//计数2a=null;//计数1b=null;//计数0提升释放内存2.标记清除算法但是引用计数算法是有缺陷的,当发生循环引用的时候就没法释放内存了例如:var obj1={};...原创 2020-01-16 15:44:00 · 94 阅读 · 0 评论 -
闭包的概念及基本语法
//啥是闭包?//官方定义:函数和声明函数的词法组合(closure)//函数 :inner函数//声明函数 :outer函数//词法组合 :作用域链//组合 :以上的组合//最简单的闭包:function outer(){ var num=10; function inner(num){ console.log...原创 2020-01-16 11:38:29 · 332 阅读 · 0 评论 -
js设计模式之桥接模式
桥接模式:对于不同维度相互组合而不是继承的方式叫桥接,也可以理解为实现与抽象相分离的方式:$(function () { var my=new myCanvas("changfangx",'red'); my.init();});////需求一个不同的形状,渲染各种颜色var shape=function (name) { this.shape...原创 2019-12-23 10:25:48 · 190 阅读 · 0 评论 -
js设计模式之装饰者模式
$(function () { var telInput=document.getElementById("telInput"); telInput.onclick=function () { telInput.style.display='inline-block' } decorator('telInput',function () { ...原创 2019-12-20 16:35:12 · 79 阅读 · 0 评论 -
js设计模式之建造者模式
$(function () { var Person=function (name,work) { var _person=new Human() _person.name=new Names(name); _person.work=new Work(work); return _person } var person...原创 2019-12-20 09:18:08 · 102 阅读 · 0 评论 -
js设计模式之安全工厂模式
$(function () { Factory('Java','TEXT')});var Factory=function(type,text){ if(this instanceof Factory){ var s=new this[type](text); return s }else{ return new ...原创 2019-12-19 14:53:58 · 167 阅读 · 0 评论 -
js基础之立即执行函数
立即执行函数的格式为funtion f1(){ (function (text){ alert(text) })(text)}也就是说最外面的那个括号是立即调用这个该函数的意思,括号里面可以写参数...原创 2019-12-19 11:53:19 · 107 阅读 · 0 评论 -
js基础之闭包
js闭包听上去可能不好理解但是可以粗略的理解为: 供外部访问内部方法/变量的机制由于js链式作用域链的存在,导致外部无法直接调用内部变量,所以如果将内部变量直接return出来,不久解决了么直接上测试代码:function f1(){ var i=999; var f2=function () { alert(i); } ...原创 2019-12-19 09:50:44 · 86 阅读 · 0 评论 -
JS设计模式之简单工厂模式
$(function () { var userNameAlter=createPopup("alert","验证");});function createPopup(type,text){ var o=new Object(); o.content=text; o.show=function () { alert("显示"); }...原创 2019-12-19 09:30:02 · 98 阅读 · 0 评论 -
跨域的另外两种解决思路
1.jsonp2.domain 首先说第一种:jsonp 主要思路是通过页面上script标签引入一个src为目标js的方法比如,在桌面新建一个crossDomain.html页面,它里面的代码需要利用ajax获取一个不同域上的json数据,假设这个json数据地址是http://192.168.x.xxx/JSONP/jsonpTest.php那么crossDomain.ht...原创 2018-09-10 11:51:11 · 178 阅读 · 0 评论 -
js获取URL里指定的参数
/** * 获取指定的URL参数值 * URL:http://www.quwan.com/index?name=tyler * 参数:paramName URL参数 * 调用方法:getParam("name") * 返回值:tyler * alert(getParam('date')); */ function getParam(name) { var ...原创 2018-09-07 10:05:20 · 2619 阅读 · 0 评论 -
js剪切板
<script type="text/javascript">function copyUrl2() { var Url2=document.getElementById("biao1").innerText; var oInput = document.createElement('input'); oInput.value...转载 2018-09-07 15:16:58 · 907 阅读 · 0 评论 -
Echars饼图入门
function gridShowInfo(values){ var myChart = echarts.init(document.getElementById('gridChars')); // 显示标题,图例和空的坐标轴 myChart.setOption({// title : {// text : '栅格详情',// subtext : '',// x :...原创 2018-11-29 10:20:57 · 487 阅读 · 0 评论 -
根据hover事件动态的获取元素所在屏幕上的位置!很骚的操作
var toolTop=$("#"+id).position().top;var toolLeft=$("#"+id).position().left; $("#tooltip").css("position","absolute").css("top",( toolTop+xOffset) + "px").css("left",(toolL原创 2018-11-28 14:24:52 · 1398 阅读 · 0 评论 -
识别特殊字符输出定长字符串
在我们遇到定长的DIV时,字符串太长会换行,样式会很丑,但是直接截取定长的字符串会有很大问题,比如数字占1个位置,汉字会占2个位置,这里提供了一种方法解决这种问题,如下:function splitStrSup(str,len){ var jmz = {}; var strTemp=""; jmz.GetLength = function(str) { ///<summar...原创 2019-01-18 11:42:05 · 474 阅读 · 0 评论 -
点击其他地方,隐藏本div
document.onclick = function(e) { $("div").hide();}$('button').on("click", function(e) { if($("#div").css("display") == "none") { $("#div").show();转载 2019-01-29 11:45:12 · 132 阅读 · 0 评论 -
JS获取指定的时间,比如上周/本周五
在这里先说明一下,月份,周几都是从0开始的这一点是需要我们注意的.本周,上周的开始结束时间function getTime(n){ var now=new Date(); var year=now.getFullYear(); //因为月份是从0开始的,所以获取这个月的月份数要加1才行 var month=now.getMonth()+1; va...转载 2019-03-13 09:11:14 · 1458 阅读 · 0 评论 -
跨域实战2
发送方://全屏function clickButton(){ var obj=new Object(); obj.mapFullScreen=true; obj.type='hrail';//场景类型:mr-mr分析;hrail-高铁;hroad-高速;subway-地铁;baseMerit-高价值基站;weaksigna-GIS服务前置 window...原创 2019-04-16 20:56:57 · 156 阅读 · 0 评论 -
针对非主流浏览器解决中文乱码(兼容主流)
在日常的开发中我们在不得不进行中文传输时,非主流浏览器糟糕的中文兼容性会让我们出现(400,404,405)找不到页面错误(因为url出错当然找不到页面)加密这里给出一种加密方式(js原生)../treeUtils/treeVillage.html'+"?city_name="+encodeURIComponent(select_city_name+"市")这里值得注意的是:...原创 2019-05-21 21:28:31 · 334 阅读 · 0 评论 -
纯JS解决内嵌iframe全屏(兼容IE/火狐/谷歌)
遇到一些政府/国企开发时经常遇到兼容IE的问题,给大家介绍一种我刚研究出的一种解决方案1.代码<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <script type="text/javascript" src="./../jquer...原创 2019-05-30 14:32:33 · 3198 阅读 · 0 评论 -
Ecxel导出
工具类package com.ai.common;import org.apache.poi.hssf.usermodel.HSSFCell;import org.apache.poi.hssf.usermodel.HSSFCellStyle;import org.apache.poi.hssf.usermodel.HSSFRow;import org.apache.poi.hss...原创 2019-06-12 11:06:58 · 123 阅读 · 0 评论 -
解决使用jQuery采用append添加的元素事件无效的方法
亲自踩坑,实测有效1.扫进垃圾堆的写法livejquery 9以下可用,现在一般不用了2.on 注意!注意!注意!格式$("父节点").on("mouseout","你要点击的节点",function(){});想想也就理解设计师的做法了,不断的从父节点遍历下面的选中子节点,这种方法确实是一种思路...原创 2019-07-02 10:39:55 · 720 阅读 · 0 评论 -
jQuery插件封装入门
jQuery插件我们用的很多,也很好用,我在生产任务中也碰到了很多冗余代码,我就想把他们封装起来,一直百思不得其解,现在捅破了这个窗户纸,分享给大家。jQuery对象封装其实很简单首先大家对prototype这个方法应该不陌生, Array.prototype.say=function(str){ console.log(str); }...原创 2019-07-06 23:53:56 · 127 阅读 · 0 评论 -
当前页面js与另一服务js,跨域问题解决方案
网上解决跨域问题的文章有很多,但是大多数都是页面与后台服务器的跨域问题,与我们要解决的问题没有太多的相关性。本文就不同服务js交互问题为核心给出解决方案。话不多说,先上代码:1./Demo01/WebContent/index.html<!DOCTYPE html><html><head><meta charset="UTF-8"&...原创 2018-08-31 09:26:56 · 331 阅读 · 0 评论