![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JS
蜗牛1T
中山大学计算机系网络工程专业本科毕业。
2010年加入金山安全至今,专注前端开发,PHP和NodeJS也有所涉猎。
喜欢关注业界动态,乐于学习新技术,有代码洁癖强迫症,追求高质量高效率的代码。
欢迎关注微信公众号《前端分享吧》
展开
-
带你认识和理解Promise
文章目录Promise是什么?有什么用?Promise 基本用法Promise 的一些特性我的Promisethencatch_resolve_rejectPromise 的精髓Promise的其它方法Promise是什么?promise,承诺的意思。意思就是,JS执行线程 承诺 在将来的某个时刻执行某一块代码。也就是说,你可以把一段将来才需要执行的代码,通过promise,把它放进异步任务队列中,在将来的某个时刻执行。So,promise就是用来写Javascript异步代码的。有什么用?这就要原创 2020-07-24 18:31:24 · 444 阅读 · 0 评论 -
for in & for of 的区别
对于纯对象的遍历,for..in要厉害一些;Object.prototype.objCustom = function() {}; Array.prototype.arrCustom = function() {};var arr = [3, 5, 7];arr.foo = 'hello';for (var i in arr) { // 如果不需要输出原型上的属性,可以用 arr.hasOwnProperty(i) 判断,返回false的则是原型上的属性 console.log原创 2020-05-14 16:47:55 · 132 阅读 · 0 评论 -
JS中的descriptor
JS中的descriptor,属性描述对象,在Object.defineProperty()中会用到,其值如下:{ value: 属性值, enumerable: false, // 是否可枚举 configurable: true, // 是否可配置 writable: true // 是否可写}...原创 2020-04-25 21:51:33 · 980 阅读 · 0 评论 -
Webpack 按需打包 Loadsh
Loadsh 是一个一致性、模块化、高性能的 JavaScript 实用工具库。在数据操作时,我们经常会用的 loadsh 封装好的一些工具方法,但是并不想把整个包打包进项目里面。以下提供几个按需打包 lodash 的方法。使用方法:import {isEmpty, isObject, cloneDeep} from 'lodash';存在问题:当我们仅使用 lodas...原创 2019-11-07 14:08:53 · 1764 阅读 · 0 评论 -
webpack-bundle-analyzer 打包文件可视化分析工具的安装使用
1 安装依赖首先安装webpack-bundle-analyzernpm install --save-dev webpack-bundle-analyzer大多数情况下,在windows平台下使用类似于: NODE_ENV=production的命令行指令会卡住。cross-env能跨平台地设置及使用环境变量npm install --save-dev cross-env...原创 2019-11-04 15:34:33 · 2780 阅读 · 1 评论 -
echarts中在地图上显示label时的阴影问题
先来贴一张最终效果图:对应的option是这样的option = { backgroundColor: 'rgb(55, 105, 0, .2)', title: [{ text: '测试', left: 'center', top: '2%', textStyle: { font...原创 2019-10-12 17:52:29 · 7235 阅读 · 2 评论 -
Javascript原型小结
实例上的__proto__指向原型上的prototype,prototype和__proto__的区别:实例.__proto__ === 原型.prototype 凡是通过new Function()创建的对象都是函数对象,其他的都是普通对象 每个对象都有__proto__属性,但只有函数对象才有 prototype 属性,这都是js解释器自动加上的 所有函数对象的__proto__都指向 ...原创 2019-04-08 18:14:41 · 87 阅读 · 0 评论 -
无法将“webpack”项识别为 cmdlet、函数、脚本文件或可运行程序的名称
背景环境:1、并没有全局安装webpack和webpack-cli 2、项目没有安装其他模块1、运行“npm install webpack webpack-cli -D”安装webpack和webpack-cli包到项目。版本如下:2、项目根目录下创建webpack.config.js// 向外暴露一个打包的配置对象// 因为 webpa...原创 2019-05-02 16:07:39 · 24234 阅读 · 11 评论 -
ES6中 import 和 export 的一些小总结
ES6之前已经出现了js模块加载的方案,最主要的是CommonJS和AMD规范。CommonJS主要应用于服务器,实现同步加载,如nodejs。AMD规范应用于浏览器,如requirejs,为异步加载。同时还有CMD规范,为同步加载方案如seaJS。ES6在语言规格的层面上,实现了模块功能,而且实现得相当简单,完全可以取代CommonJS和AMD规范,成为浏览器和服务器通用的模块解决方案。...原创 2019-04-23 17:10:43 · 1134 阅读 · 0 评论 -
ES6项目构建
ES6项目主要按以下几大步骤走:基础架构 任务自动化 编译工具 代码实现1、基础架构主要分以下三大块:业务逻辑:包括页面和交互 自动构建:包括编译和辅助,辅助包括自动刷新、文件合并、资源压缩 任务自动化gulp 编译工具(babel、webpack)服务接口:包括数据和接口2、开始架构(创建目录) 1)项目根目录下创建pack...原创 2019-04-19 15:52:18 · 506 阅读 · 0 评论 -
NaN 是什么?如何测试一个值是否等于 NaN ?
NaN 这个知识点的问题在《趣味ES6》的系列很多人留言说觉得很绕,不好理解,的确,NaN 也成为面试官喜欢考察的一个知识点。NaN 属性代表一个“不是数字”的值。这个特殊的值是因为运算不能执行而导致的,不能执行的原因要么是因为其中的运算对象之一非数字。例如: "abc" / 4,是因为运算的结果非数字。例如:除数为零。虽然这看上去很简单,但 NaN 有一些令人惊讶的特点,如果你不知道它们...转载 2019-05-25 09:17:48 · 4656 阅读 · 0 评论 -
关于JS字面量及其相关的一些小知识点
字面量:用来为变量赋值时的常数量。对象字面量对象字面值是封闭在花括号对({})中的一个对象的零个或多个"属性名:值"列表。var person={ "name":"Jack", "age":29, 5:true // 这里的数值属性,不能使用传统的点访问符,需要使用数组访问符}console.log(person.name) // Jackco...原创 2019-05-26 11:34:46 · 322 阅读 · 0 评论 -
深拷贝与浅拷贝的区别,实现深拷贝的几种方法
如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力。此篇文章中也会简单阐述到栈堆,基本数据类型与引用数据类型,因为这些概念能更好的让你理解深拷贝与浅拷贝。我们来举个浅拷贝例子:let a=[0,1,2,3,4], b=a; console.log(a=...转载 2019-05-26 13:16:04 · 259 阅读 · 0 评论 -
JS使用in和hasOwnProperty获取对象属性的区别
in判断的是对象的所有属性,包括对象自身及其原型的属性;而hasOwnProperty则是判断对象自身是否具有某个属性。 function Person(){} Person.prototype.name = "allen"; var person = new Person(); console.log(person.has...转载 2019-05-26 16:55:52 · 755 阅读 · 0 评论 -
Reflect.ownKeys()与Object.keys()区别 以及 JS中的可枚举属性与不可枚举属性
代码test1:var obj = {}Object.defineProperty(obj, 'method1', { value: function () { alert("Non enumerable property"); }, enumerable: false})console.log(Object.keys(obj)) // []...转载 2019-05-26 18:25:49 · 4342 阅读 · 0 评论 -
JavaScript任务队列的顺序机制(事件循环)
同步与异步模式简介我们知道,Javascript语言的执行环境是单线程(single thread)的。所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行。常见的浏览器无响应(假死),往往就...原创 2019-05-28 19:35:06 · 7932 阅读 · 7 评论 -
Object.create()和JS继承
Object.create()介绍语法:Object.create(proto [, propertiesObject])参数:proto:必须。表示新建对象的原型对象,即该参数会被赋值到目标对象(即新对象,或说是最后返回的对象)的原型上。该参数可以是null(创建空的对象时需传null),对象, 函数的prototype属性 , 否则会抛出TypeError异常。 prope...原创 2019-06-02 19:01:49 · 936 阅读 · 0 评论 -
ie6下js动态更改图片地址,图片不显示的bug
当在ie6中用js动态更改图片地址时,图片不会变换,产生的原因是或如应用a标签的话其实不能禁止a标签最后触发一个甚么行动,致使ie6会过错的以为页面刷新或重定向了,而且中止了当前所有衔接,新图片的加载就被aborted了。解决方法是不使用a标签,或者在方法的最后加上一句 return false;就可以了。如看不清楚?换一张图片转载 2014-08-13 17:13:27 · 1324 阅读 · 0 评论 -
TextArea的值中有换行时的问题
当在一个textarea标签中键入一个回车时,实际上会插入2个符号:\n\r. (\原创 2014-04-24 18:02:47 · 3386 阅读 · 0 评论 -
使用jquery.easydrag拖拽插件的拖拽出界问题
在Iframe框架里使用了jquery.easydrag.handler.beta2.js插件,用来拖动DIV块。JS代码如下: $(document).ready(function(){ $("#msgbox").easydrag(); $(原创 2011-08-16 14:36:20 · 3530 阅读 · 2 评论 -
javascript创建css样式的方法
有很多方法可以调用css样式,如使用内嵌样式,在html直接加入样式,给定外部样式文件,在外部样式文件中使用@import url(样式文件路径),这些都是大家常用的,其实还有就是使用javascript进行样式的定义. 第一种: var style = document.createElement(’link’); style.href = ’style.css’; style.rel = ’stylesheet’; style.type = ‘text/css’; do原创 2011-05-05 14:47:00 · 3584 阅读 · 0 评论 -
JavaScript和jQuery的DOM操作
<br /><br />1.创建元素节点<br />传统的javascript方法,创建元素节点<br />var a = document.createElement("p");<br />jQuery中创建节点的方法是:<br />$('< p>< /p>');<br />和createElement()一样,创建出来的新元素节点不会被自动添加到文档里。<br />如果想把它添加到文档里,可以使用 jQuery中的append()或者insertAfter()方法或者before ()等方法。<br转载 2011-02-15 11:01:00 · 800 阅读 · 0 评论 -
jquery对象和DOM对象调用一些方法及属性的区别(收集中)
通常我们的用法是:document.getElementById("表格id名").reset().如果你想这么用:$("#表格id名").reset(),sorry to tell you that这是错误的。你要是非要跟jquery扯上点关系,那你得这么用:$("#表格id名")[0].reset().为什么捏?因为reset()是DOM对象的方法,不是jquery对象的方法。$("#表格id名")获取的是jquery对象,$("#表格id名")[0]获取的是DOM对象(为什么加上个[0]就是DOM对象原创 2011-01-20 15:10:00 · 3180 阅读 · 0 评论 -
用js判断是否联网
需要用js判断是否联网,一开始的做法是用jquery的ajax打开外网的网站,通过判断是否能打开来判断是否联网,结果报错:没有权限。在网上查阅了众多资料,说是由于浏览器的安全设置,js是不允许跨域访问的,但是可以用一个叫jsonp的方法解决。具体见http://kb.cnblogs.com/a/1509552/如果用jsonp的方法需要在服务器端做相应的配合返回数据,不符合我的情况。后来的解决办法是:通过img的error和load事件去转向。参考资料:http://www.ibiancheng.com/h原创 2011-01-20 13:21:00 · 5176 阅读 · 2 评论 -
jquery改变disabled的状态
<br />设置input框可用:<br />1.$("#input").attr("disabled",true) <br />2.$("#input").removeAttr("disabled") <br />3.$("#input").attr("disabled","")<br /><br />设置input框不可用:<br />1.$("#input").attr("disabled",false)<br />2.$("#input").attr("disabled","disabled"原创 2011-01-20 18:27:00 · 11204 阅读 · 2 评论 -
javascript对象属性的访问
假如有对象test:var test = { "a":1, "b":2};直接访问对象test的属性a的值,有两种方法:1.test.a;2.test["a"]; (注意这里要用引号)但若是用for/in语句访问对象的属性值,则必须用“[]”运算符啦:for(m in test){ alert(test[m]); alert(test.m); //这里会弹出undefined}原创 2011-01-14 17:28:00 · 4337 阅读 · 0 评论 -
关于jquery的ajax的一点小发现
jquery调用ajax时出现“msg未定义”的情况原创 2010-12-29 11:10:00 · 758 阅读 · 2 评论 -
点击a标签导致页面向上滚动的问题
在iframe里的页面,有这样一句代码:弹出一个DIV 点击该链接时,会导致整个iframe页面向上滚动了20px,这种情形出现在IE6、IE7、chrome、safari浏览器。 解决办法:修改为:弹出一个DIV 原因:a的href属性会在整原创 2011-08-22 20:34:05 · 4112 阅读 · 1 评论 -
在JS中使用全局变量
在JS中使用全局变量不像C++,也不像PHP。先摆出错的代码:var globalvar = 'a';function test(){ alert(globalvar);}这里弹出的是undefined. 要像这样用:var globalvar = 'a';function test(){ alert(window.globalvar);}这里弹原创 2011-11-16 11:51:28 · 21505 阅读 · 9 评论 -
兼容不同浏览器的获取滚动高度的方法
[*]几乎所有浏览器都不支持在document.body上监听整个网页的滚动事件,除了QQ浏览器[*]几乎所有浏览器都支持在window对象上监听整个网页的滚动事件;[*]几乎所有浏览器都支持在document对象上监听整个网页的滚动事件,除了QQ浏览器;[*]几乎所有浏览器都支持用document.documentElement.scrollTop来获取网页的滚动高度,除了Chrome和Sa转载 2014-04-22 10:00:18 · 3685 阅读 · 0 评论 -
JS中的left,pixelLeft,posLeft,offsetLeft
left(字符串,即系html中left的值.)用法:1、alert(document.getElementById('divid').style.left) //没有设置则返回空2、document.getElementById('divid').style.left = '100px'; //注意带上单位pixelLeft(数值类型,将left的值(如果是空串则赋为原创 2013-12-04 11:45:12 · 4920 阅读 · 0 评论 -
jquery的each函数中的break和continue功能
each函数不能使用break和continue关键字,替代方法是: $('.container').each(function(i){ if($(this).attr('name')=="continue"){ return ;//实现continue功能 }else if($(this).attr('name')=="break"){转载 2013-10-09 11:20:08 · 5547 阅读 · 0 评论 -
关于页面上某些点击事件无效的问题
今天在客户那遇到一个比较罕见的问题。【问题描述】用户是英文版2k3操作系统,IE9,页面上部分点击事件无效。我的点击事件是在js中生成html元素时写在onclick属性里的,代码如下:for(var i = 0; i < t; i++){ htmlstr += "test"; } $("#group-list").append(htmlstr); 【解决办原创 2013-06-28 18:48:04 · 11403 阅读 · 1 评论 -
jqplot的DateAxisRenderer使用min、max时用到的问题
var line1 = [['2013-5-7',2],['2013-5-8',3],['2013-5-9',4],['2013-5-10',5],['2013-5-11',6],['2013-5-12',7],['2013-5-13',8]];情形一:想让横轴上的日期间隔是1天,根据文档设置tickInterval:'1 day‘不生效,改成一天的毫秒数tickInterval:''+8原创 2013-05-14 11:25:33 · 3035 阅读 · 0 评论 -
IP正则
re = /(\d{1,3}.){3}\d{1,3}(:\d{1,4})?/原创 2012-11-22 17:34:11 · 583 阅读 · 0 评论 -
jquery判断checkbox
在不用jquery的情况下我们是这样判断的:document.getElementById("checkboxID").checked 取得的值为true(选中)或false(不选中) jquery情况:(只测试了3个版本)1、jquery版本:jquery-1.4.4.jsalert($("#checkboxID").attr("checked")),会打印出true或者原创 2011-01-20 17:12:00 · 3353 阅读 · 0 评论 -
使用jqplot绘图出现window.G_vmlCanvasManager is null or not an Object
使用jqplot,在ie6,ie7,ie8上不能绘图,ie9可以,调试出现window.G_vmlCanvasManager is null or not an Object这样的信息。解决办法:原创 2012-04-24 18:16:20 · 6071 阅读 · 5 评论 -
JavaScript 获取浏览器的页面编码和支持语言
function getPageCharset(){ var charSet = ""; var oType = getBrowser(); switch(oType){ case "IE": charSet = document.charset; break; case "FIREFOX": charSet = document.characterSet;原创 2010-12-27 10:47:00 · 4764 阅读 · 0 评论