JavaScript
文章平均质量分 61
swpu_lwf
前端爱好者
展开
-
input = file 实现上传文件
使用input = file实现文件上传功能, 如果点击提交按钮,提交表单并上传选中的文件:<FormItem label="上传简历"> <div className="section-pushInChannel-fileInput"> <input id="file" onChange={this.handleFileChange} t...原创 2019-07-02 16:37:39 · 94264 阅读 · 1 评论 -
数组去重方法总结
1、使用双重循环 优点:兼容性好function unique(arr){ var len=arr.length; if(len&amp;lt;=1) return arr; var newArr=[]; for(var i=0;i&amp;lt;len;i++){ for(var j=0;j&amp;lt;newArr.length;j++){ ...原创 2018-04-15 11:41:34 · 529 阅读 · 2 评论 -
javascript模块化编程的运用
今天又一次学习了阮一峰:Javascript模块化编程,然后用学到的require.js的用法对之前所做的考试系统的nlineLib_practice页面作了进一步的优化,如下:删掉了onlineLi_practice.js原有的常见通用函数引入required.js: <script src="../static/lib/js/require.js" defer async="a...原创 2018-03-07 22:30:13 · 180 阅读 · 0 评论 -
一键分享工具share.js
今天做网站时,要用到一键分享工具,在网上搜了下,尝试了下:首先网站中引入一下文件:<!-- css & js --><link href="dist/css/share.min.css"><script src="dist/js/share.min.js"></script>html: <div class="social-share"></div>js进行相应配置://一键分享相关配置 v原创 2018-01-02 15:31:27 · 26280 阅读 · 1 评论 -
js实现一键导出Excel
想要如下页面,一键导出Excel:html:<div class="container"> <table id="backViewTable" class="table table-hover table-sm table2excel"> <tr> <td>#</td> <td>ID</td>原创 2017-12-05 14:00:25 · 24307 阅读 · 3 评论 -
checkbox的change事件(IE浏览器change事件问题及解决方法)
在JQuery中,当给radio或checkbox添加一个change事件时,如果它的值发生变化就会触发change事件。 $('document').ready(function(){ $('#checkbox').change(function(){ alert('checked'); }) })上面几行代码在Firefox等浏览器中原创 2017-10-25 21:00:20 · 13598 阅读 · 0 评论 -
javascript中函数的arguments实参集合
1、arguments是实参集合,类似于数组,却不是数组在JavaScript中,arguments对象是比较特别的一个对象,实际上**是当前函数的一个内置属性。**arguments非常类似Array,但实际上又不是一个Array实例。 如果用typeof arguments,返回的是’object’。虽然我们可以用调用数据的方法来调用arguments。比如length,还有index方...原创 2017-05-30 20:42:02 · 1119 阅读 · 0 评论 -
数组、对象、类数组对象的不同以及类数组转数组方法总结
一、数组、对象、类数组对象数据结构的异同1、数组 一组有序的数据集合,其索引为从0开始且自然增长的整数,其元素值可以是任何js数据!并且包含一个名为length的属性,该属性表示数组元素的个数!var array = [1,2,3];console.log(array[0])//1console.log(array[1])//2console.log(array[2])//3cons原创 2017-11-11 12:17:24 · 3836 阅读 · 0 评论 -
连接数组、字符串方法总结
一、 连接数组1、concat() concat()可以基于当前数组的所有项创建一个新数组。具体来说,它会创建当前数组的一个副本,然后将接收到的参数添加到这个副本的末尾,最后返回新构建的数组。 如果传递给concat()方法的是一或多个数组,则该方法会将这些数组中的每一项添加到结果数组中。如果传递的值不是数组,这些值就会被简单地添加到结果数组末尾。var colors=['red','yello原创 2017-11-11 11:07:16 · 4233 阅读 · 0 评论 -
前端面试常见问题——字符串反转
这道题呢,来源于一篇文章,《如何准备一次技术面试》,它以作为面试官的角度讲了一些技术面试的小技巧。 大家应该也都知道技术面试中对于基础知识的考察,总是从一些基本的问题,层层深入。 字符串反转就是一个面试的常见问题。这是我最初的解法,当然也是大部分人的解法://解法一 function reverse(str){ for(var i=0;i<str.length原创 2017-10-29 16:00:02 · 1374 阅读 · 0 评论 -
javascript中的+运算符
加法操作符+规则1:字符串连接// string + string = string (concatenation)var result = "Hello, " + "World!";console.log(result); // "Hello, World!"规则2:数字加法运算// number + number = number (addition)var result = 10 + 5转载 2017-09-21 15:24:39 · 432 阅读 · 0 评论 -
js中递归实现的方法及其区别
递归函数:递归函数是在通过名字调用自身的情况下构成的。递归实现阶乘函数: 方法一:通过使用函数的名字 function factorial(num){ if(num<=1){ return 1; }else{ return num*factorial(num-1); } } consol原创 2017-09-12 12:45:15 · 828 阅读 · 0 评论 -
原生JS forEach()和map()遍历的区别以及兼容写法,jQuery $.each()和$.map()遍历
一、原生JS forEach()和map()遍历共同点:1.都是循环遍历数组中的每一项。2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前项的索引index,原始数组input。3.匿名函数中的this都是指Window。4.只能遍历数组。1.forEach()没有返回值。arr[].forEach(function(value,index,转载 2017-09-11 19:30:08 · 410 阅读 · 0 评论 -
统计数组arr中的值等于item的元素出现的次数
var arr=[1,3,4,3,6,8,3,9]; var item=3; var count=0;思路一: for(var i=0;i<arr.length;i++){ if(arr[i]==item){ count++; } } console.log(count);或者 var fn=func转载 2017-09-11 16:09:29 · 2736 阅读 · 0 评论 -
函数式编程初探
一、定义简单说,”函数式编程”是一种”编程范式”(programming paradigm),也就是如何编写程序的方法论。 它属于”结构化编程”的一种,主要思想是把运算过程尽量写成一系列嵌套的函数调用。举例来说,现在有这样一个数学表达式: (1 + 2) * 3 - 4传统的过程式编程,可能这样写: var a = 1 + 2; var b = a * 3; var c = b -转载 2017-09-11 15:21:49 · 158 阅读 · 0 评论 -
Javascript严格模式详解
一、概述1、什么是严格模式?除了正常模式意外,ES5(2009年发布)还添加了一种模式,即“严格模式”。这种模式使javascript在更加严格的条件下运行。2、为什么使用严格模式?消除javascript语言中一些不合理、不严谨之处,减少怪异现象;消除代码运行的一些不安全的地方,保证代码运行的安全;提高编译器效率,提高运行速度;为未来新版本的javascript打好基础;...原创 2018-04-16 20:18:37 · 700 阅读 · 0 评论 -
如何实现同一浏览器多个标签页之间的通信(一)——localStorage
一、localStorage (1)localStorage是什么? localStorage对象在修订过的HTML5规范中作为持久保存在客户端数据的方案取代了globalStorage,是Storage的实例。 注意:要访问一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一种协议,在同一个端口上。相当于globalStorage[localhost.host]...原创 2018-04-18 20:20:57 · 8982 阅读 · 0 评论 -
将请求返回的图片转为Base64形式显示在页面上
情景:如图该请求返回一张图片,我该如何显示在页面上呢?代码如下:transformArrayBufferToBase64 (buffer) { var binary = ''; var bytes = new Uint8Array(buffer); for (var len = bytes.byteLength, i = 0; i <...原创 2019-07-02 16:11:47 · 6085 阅读 · 0 评论 -
观察者模式(发布-订阅者模式)
观察者模式定义了一种依赖关系,解决了主体对象和观察者之间功能的耦合,主要应用于大型项目的模块化开发中,解决团队开发中模块之间的通信问题,利用观察者模式还可以实现自定义事件。//观察者var Observer=(function(){ var _messages={};return{ //注册消息接口 register:function(type,fn){ ...原创 2018-06-17 11:55:55 · 387 阅读 · 0 评论 -
数组的扁平化方法总结
数组的扁平化:将一个嵌套多层的数组转换为一个只有一层的数组比如有一个数组扁平化的方法flattenvar arr=[1,[2,[3,4]]];flatten(arr);//[1,2,3,4]实现数组扁平化的方法:(1)循环+递归function flatten(arr){ var result=[]; for(var i=0;i<arr.length;i...原创 2018-06-16 11:25:14 · 2207 阅读 · 0 评论 -
JavaScript内存泄漏及常见方式
一 内存管理 程序的运行需要内存。只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存。对于JavaScript来说,有栈内存(stack)和堆内存(heap)。对于持续运行的服务进程(daemon),必须及时释放不再用到的内存。否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃。不再用到的内存,没有及时释放,就叫做内存泄漏(memory leak)。有些语言...原创 2018-06-14 21:42:52 · 258 阅读 · 0 评论 -
JavaScript与C、C++、Java这几类语言的不同
从静态类型还是动态类型来看静态类型,编译的时候就能够知道每个变量的类型,编程的时候也需要给定类型,如Java中的整型int,浮点型float等。C、C++、Java都属于静态类型语言。动态类型,运行的时候才知道每个变量的类型,编程的时候无需显示指定类型,如JavaScript中的var、PHP中的$。JavaScript、Ruby、Python都属于动态类型语言。静态类型还是动态类型对...原创 2018-06-13 15:42:34 · 8064 阅读 · 0 评论 -
从js运行机制看setTimeout与setInterval
setTimeout:超时调用; setInterval:间歇调用调用时,代码是在全局环境中执行的,里面的this在正常模式下指向window,严格模式下指向undefined。参数:第一个参数为字符串或者函数(建议使用函数,传递字符串可能导致性能损失)第二个参数为以毫秒表示的时间,该时间表示多少毫秒后将当前任务加入任务队列。 注意:对于定时器,是准时添加的,但不是准时执行的。...原创 2018-06-12 21:02:40 · 515 阅读 · 0 评论 -
事件循环进阶:macrotask与microtask的应用
题目:setTimeout(()=&gt;{ console.log(0)},1000);new Promise((resolve,reject)=&gt;{ console.log(1); resolve();}).then(()=&gt;{ setTimeout(()=&gt;{ console.log(3) },0);...原创 2018-06-12 19:57:18 · 1314 阅读 · 1 评论 -
javascript中new的模拟实现
new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。语法:new constructor[([arguments])]那么什么是构造函数呢? 构造函数 constructor 是用于创建和初始化类中创建的一个对象的一种特殊方法。(1)我们来看一下new 和 constructor 的基本使用:function Person(name,ag...原创 2018-06-05 14:27:26 · 4477 阅读 · 2 评论 -
javascript中call和apply的模拟实现
call() call() 方法调用一个函数, 其具有一个指定的this值和分别地提供的参数(参数的列表)。语法:fun.call(thisArg, arg1, arg2, ...)实例:var name="lee";var obj={ name:"lwf"};function foo(){ console.log(this.name);}foo...原创 2018-06-05 15:40:45 · 1810 阅读 · 0 评论 -
javascript中的深浅拷贝(非构造函数的继承)
首先,我们应该明确深浅拷贝是针对Array、Object这样的复杂类型的。一 常见的深浅拷贝的方法(1)数组和对象的浅拷贝 如果是数组,我们可以利用数组的一些方法比如:slice、concat 返回一个新数组的特性来实现拷贝。//新旧数组都改变,对象指向同一块地址var arr=['old',{"old":"old"},["old"],null,undefined];var ..原创 2018-06-04 21:32:45 · 403 阅读 · 0 评论 -
javascript中的动态集合——NodeList、HTMLCollection、NamedNodeMap
一、NodeList、HTMLCollection、NamedNodeMap的相同点与不同点 (1)相同点 1. 三者都是类数组对象 2. 都有item()方法(2)不同点 1. NodeList是节点(12种)的集合、HTMLCollection是元素节点的集合、NamedNodeMap是属性节点的集合 2. NodeList有静态的、有动态的,HTMLCollection...原创 2018-06-03 14:14:24 · 998 阅读 · 0 评论 -
如何实现同一浏览器多个标签页之间的通信(二)——cookie+setInterval
二、cookie (1)cookie是什么? HTTP Cookie,通常直接叫做cookie,最初是在客户端用于存储回话信息的。该标准要求服务器对任意HTTP请求发送Set-CookieHTTP头作为相应的一部分,其中包含回话信息。浏览器会存储这样的回话信息,并在这之后,通过每个请求添加CookieHTTP头将信息发回服务器。 (2)cookie怎么用? 在JavaScript中,coo...原创 2018-04-21 10:46:35 · 5136 阅读 · 0 评论 -
JavaScript中的模块化
一、什么是模块(module)?前端领域的模块一般指JavaScript模块,往往表现为一个单独的js文件,对外暴露一些属性和方法。注意区分:“模块”和“组件” 组件往往是业务层面的,可以看成一个可独立使用的功能实现,往往表现为一个UI部件(并不绝对),如下拉菜单等。一个组件包含其所需要的所有资源,包括逻辑(JavaScript)、样式(CSS)、模板(HTML/Template),甚至...原创 2018-04-30 19:50:05 · 162 阅读 · 0 评论 -
js中的this是什么、作用、指向
1、this是什么? this是JavaScript语言中定义的众多关键字之一,它的特殊在于它自动定义于每一个函数域内。2、this的作用? 看个例子:function identify() { return this.name.toUpperCase();}function sayHello() { var greeting = "Hello, I'm " + identi原创 2017-05-12 13:49:25 · 420 阅读 · 0 评论 -
js作用域(函数作用域、变量作用域、作用域链、with语句)
一:函数作用域先看一小段代码:var scope="global"; function t(){ console.log(scope); var scope="local" console.log(scope); } t(); 第一句输出的是: “undefined”,而不是 “global” 第二讲输出的是:”local” 你可能会认为第一句会原创 2017-05-12 14:08:19 · 420 阅读 · 0 评论 -
javascript中的垃圾收集及内存泄漏
一、什么是内存泄漏?程序的运行需要内存。只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存。 对于持续运行的服务进程(daemon),必须及时释放不再用到的内存。否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃。不再用到的内存,没有及时释放,就叫做内存泄漏(memory leak)。有些语言(比如 C 语言)必须手动释放内存,程序员负责内存管理。char * buffe原创 2017-09-13 10:32:46 · 354 阅读 · 0 评论 -
学习javascript闭包
闭包:是指有权访问另一个函数作用域变量的函数。创建闭包的常见方式就是在一个函数内创建另一个函数。理解如何创建作用域链以及作用域链的用途对于理解闭包非常重要。作用域链本质上是一个指向变量对象的指针列表,它只引用但不实际包含变量对象。无论在任何时候在函数中访问一个变量时,就会从作用域链中搜索相应名字的变量。当某个函数被调用时,会创建一个执行环境(execution context)及相应的作用域链。然后原创 2017-09-12 22:24:35 · 354 阅读 · 0 评论 -
js删除数组中的元素
一、从数组中删除指定值元素: 下面的代码使用了两种方式删除数组的元素,第一种定义一个单独的函数,第二种为Array对象定义了一个removeByValue的方法,调用非常简单 定义函数removeByValue进行元素删除function removeByValue(arr, val) { for(var i=0; i<arr.length; i++) { if(arr[i] ==原创 2017-06-01 15:54:53 · 27712 阅读 · 1 评论 -
js中forEach、map
JavaScript数组的 forEach()方法调用数组中的每个元素。 语法array.forEach(callback[, thisObject]);下面是参数的详细信息: callback : 函数测试数组的每个元素。 thisObject : 对象作为该执行回调时使用。forEach方法中的function回调有三个参数:第一个参数是遍历的数组内容,第二个参数是对应的数原创 2017-06-01 15:40:40 · 408 阅读 · 0 评论 -
getcomputedstyle、currentStyle、style
style属性: 在JavaScript中,通过document.getElementById(id).style.XXX只能取到通过内嵌方式设置的样式值,即style属性里面设置的值。解决方案:引入currentStyle,runtimeStyle,getComputedStyle style 标准的样式,可能是由style属性指定的! runtimeStyle :运行时的样式!如果与styl原创 2017-05-30 21:36:15 · 377 阅读 · 0 评论 -
深入理解js中的return
JavaScript在事件中调用函数时用return返回值实际上是对window.event.returnvalue进行设置,而该值决定了当前操作是否继续。当返回的是true时,将继续操作。当返回是false时,将中断操作。直接执行时(不用return),将默认返回undefined,不会对window.event.returnvalue进行设置,会默认地继续执行操作详细说明如下: 例如:原创 2017-05-30 19:58:52 · 783 阅读 · 0 评论 -
js兼容性解决及判断过程中的注意事项
1、js中不允许出现“ - ” 页面中改变文字大小-案例:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>页面中改变文字大小-案例</title><script type="text/javascript"> window.onload = function () {原创 2017-05-09 20:22:26 · 441 阅读 · 0 评论 -
遮罩层的实现及应用
遮罩层的实现: 1、实现思路: 利用div实现遮罩层效果:利用一个全屏、半透明的div遮住页面上其它元素<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>遮罩层</title> <style> html,body { margin:0; h原创 2017-05-08 21:01:38 · 11452 阅读 · 0 评论