javascript零碎知识

一、函数去抖
debounce时间间隔t内若再次触发事件,则重新计时,直到停止时间大于或等于t才执行函数
来源:https://www.cnblogs.com/chenjinxinlove/p/6093246.html
二、jQuery零碎知识
1、把jQuery对象转化为js对象(1)$div[0];(2)$div.get(0);
2、任然获取jQuery对象(1)$div.eq(0);
3、把js对象转化为jQuery对象$(div)
4、用$().each(function(){})遍历DOM对象;
5、用$.each(data,function(){})遍历数组。
6、find()沿着 DOM 树向下遍历所有层级
7、children()沿着 DOM 树向下遍历单一层级。
8、对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
9、对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法
10、具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop()
三、new Date()的运行结果(????)
(1)在服务器端,参数和返回值均是格林尼治时间,比如nodejs下
(2)在客户端,参数和返回值均是本地时间,比如html下
四、继承的几种方式
(1)构造函数继承:
在子类构造函数内部,把父类构造函数的this换成子类的this,并且给子类实例增加属性。
(2)原型链继承:
将父类的实例赋给子类的原型,并且给子类的原型增加属性。
(3)实例继承:
在子类构造函数内部,new父类的实例并用变量接收,并给该变量增加属性,再返回该变量。
(4)拷贝继承:
在子类构造函数内部,new父类的实例并遍历该实例的属性,复制到子类的原型上,再给该子类的原型增加属性。
(5)组合继承:
构造函数继承+原型链继承
(6)寄生组合继承:
构造函数继承+原型链继承(原型链所在的新构造函数为空)。
四、Promise的执行流程(箭头函数的this总是指向实例对象)
(1)定义一个函数,在这个函数里,首先给Promise类传进一个函数参数用来定义个性化的逻辑,这个函数参数传入两个函数参数作为成功的回调和失败的回调。
(2)定义的那个函数执行时,首先new出Promise类的实例,即Promise类里的代码执行。执行到Promise类的参数函数时遇上异步,于是用then为Promise类注册成功和失败的回调,然后继续执行异步,调用成功或失败的回调。
五、ejs模板中的四种表达式输出形式
在ejs模板中,通常会用下面四种方式在HTML中输出服务端的变量或表达式的值:
直接在<%%>中写表达式或变量。这种情况通常只是用来进行表达式计算或给变量赋值,不会有任何输出,被称作无缓冲的代码。<% code %>
在<%%>中通过=号输出变量或表达式的值。默认输出到页面中的内容会进行HTML转义。<%= code %>
在<%%>中通过-号输出变量或表达式的值。内容不经任何转义直接输出到页面上。<%- code %>
在结束标记%>之前添加-号,这样输出的内容会自动带有HTML标记的缩进。如:<% code -%> 或 <% -%> 或 <%= code -%> 或 <%- code -%>
来源,https://www.cnblogs.com/jaxu/p/5065338.html
六、jQuery实例的无new构建

(1)怎么访问jQuery类原型上的属性与方法,做到既能隔离作用域还能使用jQuery原型对象的作用域呢,还能在返回实例中访问jQuery的原型对象?
(2)实现的关键点:jQuery.fn.init.prototype = jQuery.fn;通过原型传递解决问题,把jQuery的原型传递给jQuery.prototype.init.prototype
(3)换句话说jQuery的原型对象覆盖了init构造器的原型对象,因为是引用传递所以不需要担心这个循环引用的性能问题
(4)来源:https://segmentfault.com/a/1190000003501504
七、jQuery插件接口
(1)jQuery支持自己扩展属性,对外提供了一个接口----jQuery.fn.extend() 来增加方法
(2)从jQuery的源码中可以看到,jQuery.extend和jQuery.fn.extend其实是同指向同一方法的不同引用:jQuery.extend = jQuery.fn.extend = function() {}
(3)jQuery.extend 对jQuery本身的属性和方法进行了扩展;jQuery.fn.extend 对jQuery.fn的属性和方法进行了扩展
(4)通过extend()函数可以方便快速的扩展功能,不会破坏jQuery的原型结构
(5)jQuery.extend = jQuery.fn.extend = function(){...}; 这个是连等,也就是2个指向同一个函数,怎么会实现不同的功能呢?这就是this 力量了!
jQuery.extend 调用的时候,this是指向jQuery对象的(jQuery是函数,也是对象!),所以这里扩展在jQuery上。
而jQuery.fn.extend 调用的时候,this指向fn对象,jQuery.fn 和jQuery.prototype指向同一对象,扩展fn就是扩展jQuery.prototype原型对象。
(6)来源:https://segmentfault.com/a/1190000003501504
八、运行结果

九、函数的创建方式
(1)函数声明: function sum1(n1,n2){ return n1+n2 };
(2)函数表达式:又叫函数字面量 var sum2=function(n1,n2){ return n1+n2; };
(3)函数构造法:参数必须加引号 var sum3=new Function('n1','n2','return n1+n2');
(4)自执行函数
十、函数的调用方式
(1)直接调用
(2)对象调用
(3)new调用
(4)call、apply调用
十一、原生js事件
(1)DOM0事件模型:直接在dom对象上注册事件名称
(2)DOM2事件模型:通过addEventListener和removeEventListener注册事件
十二、zepto的tap事件点透的原因及解决
(1)点击事件会触发touch和click事件,touch执行时,可能将上层元素比如弹窗删除,300毫秒click执行时,会触发下层的元素比如a、input的click事件
(2)解决方案:A、fastclick;B、元素监听和阻止冒泡;C、延迟消失上层元素至350毫秒。
(3)300毫秒延迟来自于双击缩放。

十三、js 如何实现sum(2,3)===sum(2)(3);
所用思想:函数柯里化,意思是currying,又称部分求值。一个 currying 的函数首先会接受一些参数,接受了这些参数之后,该函数并不会立即求值,而是继续返回另外一个函数,刚才传入的参数在函数形成的闭包中被保存起来。待到函数被真正需要求值的时候,之前传入的所有参数都会被一次性用于求值。

来源1:http://blog.csdn.net/m0_37290635/article/details/56683233
来源2:https://www.cnblogs.com/chenjinxinlove/p/6093246.html
十四、普通函数与箭头函数对照
1、普通函数:var f=function(){return 5}
箭头函数:var f=()=>5
2、普通函数:var f=function(v){return 5}
箭头函数:var f=(v)=>5
3、普通函数:map(function(){return 5})
箭头函数:map(()=>5)
4、普通函数:map(function(v){return 5})
箭头函数:map(v=>5)
变量=参数=>函数体
十五、获取服务器端时间

十六、单向绑定与双向绑定
1、单向绑定:把Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新。
2、双向绑定:如果用户更新了View,Model的数据也自动被更新了,这种情况就是双向绑定。
十七、观察者模式(发布-订阅模式)
定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新。
十八、高阶函数,把函数作为参数或者返回值的函数。
十九、person1.proto===person.prototype
1、proto:对象所在类的原型
2、prototype:类的原型
二十、封装深度克隆方法

来源:http://www.jb51.net/article/79707.htm
二十一、循环里放定时器

二十二、定时器里放循环

二十三、$(this).attr("checked",!this.checked);
1、$(this)有attr方法
2、this有checked属性
二十四、Jquery的$(selector).each()和$.each()原理和区别
https://www.cnblogs.com/WreckBear/p/5953602.html
用$().each(function(index, value){})遍历DOM对象;
用$.each(data,function(index, value){})遍历数组。
二十五、点透的解决

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复