一、关于全局变量的 var test=function(){ var a=1; setTimeout(function(){ console.log(a); a=2; },1000); a=3; setTimeout(function(){ console.log(a); a=4; },2000); }; test(); 结果是3,2； 共享内存。setTimeout等异步，是取现在当时的a的值。执行第一个setTimeout的时候，a=3,已经执行了。 二、全局变量和new变成全局的 var…

注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是将 M 和 V 的实现代码分离,从而使同一个程序可以使用不同的表现形式. 交互方式(所有通信都是单向的): View 传送指令到 Controller Controller 完成业务逻辑后,要求 Model 改变状态 Model 将新的数据发送到 View,用户得到反馈 更详细的说明: 模型(Mod…

在现在安卓应用原生开发中,为了追求开发的效率以及移植的便利性,使用WebView作为业务内容展示与交互的主要载体是个不错的折中方案.那么在这种Hybrid(混合式) App中,难免就会遇到页面JS需要与Java相互调用,调用Java方法去做那部分网页JS不能完成的功能. 网上的方法可以告诉我们这个时候我们可以使用addjavascriptInterface来注入原生接口到JS中,但是在安卓4.2以下的系统中,这种方案却我们的应用带来了很大的安全风险.攻击者如果在页面执行一些非法的JS(诱导用户打…

最近有点忙,很久无写博客,记录一下之前的配置require.js和sea.js的配置.(有误有望提出 require.js 文件目录 /app(项目使用js) /lib(require.js jq存放处) /plugin(框架对应的功能插件) require.js比较方便在于,不是amd的模块组件可以通过配置文件进行依赖配置.而且异步加载js 页面加载速度是杠杠的.当然会有点问题的,网速过慢的话,可能会出现js,timeout(可以通过配置解决. config.js (配置文件) // 配置信息…

1)我为什么要学习JavaScript? 在我立志说要当一名前端开发工程师之后,我做的第一件事情,就是上知乎.去搜"前端开发工程师"这几个字.然后就会发现很多答案中涉及到,一名前端工程师,必须要会的是html+css+javascript.在[怎样长成一个优秀的web前端开发工程师?]这个问题下,有人转了一篇外文博客的译版来回答,其中一段很表述得简单明了,"首先,前端工程师必须掌握HTML.CSS和JavaScript.只懂其中一个或两个还不行,你必须对这三门语言都很熟悉.也…

var koooke ={androidShare:{ show : function() {alert(1000)}}};koooke.androidShare.show(); 以上JS是偶然缩写.可以清晰的表示逻辑结构,比起老的文件包含的方式多出一层逻辑层次的表现.算是进行了自我注释.…

目录 一. CSS动画 和 JS动画 1.1 CSS动画 1.2 JS动画 1.3 小结 二. 使用Velocity.js实现动画 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园地址:<大史住在大前端>原创博文目录 华为云社区地址:[你要的前端打怪升级指南] 一. CSS动画 和 JS动画 Web动画的本质是元素状态改变造成的样式变更,CSS动画和JS动画的区别并不是由语言来决定的,而是由两者的特点和适用场景来判断的.CSS动画简洁高效,…

[摘要] 介绍CSS动画和JS动画的基本特点,以及轻量级动画库velocity.js的基本用法. 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园地址:<大史住在大前端>原创博文目录 一. CSS动画 和 JS动画 Web动画的本质是元素状态改变造成的样式变更,CSS动画和JS动画的区别并不是由语言来决定的,而是由两者的特点和适用场景来判断的.CSS动画简洁高效,提升交互体验而编写的代码可以轻松地和主要业务逻辑之间实现隔离,开发中建议优先使…

[摘要] 介绍CSS动画和JS动画的基本特点,以及轻量级动画库velocity.js的基本用法. 示例代码托管在:http://www.github.com/dashnowords/blogs 博客园地址:<大史住在大前端>原创博文目录 一. CSS动画 和 JS动画 Web动画的本质是元素状态改变造成的样式变更,CSS动画和JS动画的区别并不是由语言来决定的,而是由两者的特点和适用场景来判断的.CSS动画简洁高效,提升交互体验而编写的代码可以轻松地和主要业务逻辑之间实现隔离,开发中建议优先使…

本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写JavaScript,而你的JavaScript代码又与业务相关.我想无非就是一下三类功能: 1.请求后台数据 2.渲染后台数据,拼接Html 3.事件操作 当然你如果封装JS底层的控件,不在我们今天的讨论范围.你也许写过单文件上千行的JS,你也许维护过几千行的JS,每次重新看起来,或者增删改功能吃力吗,如果…

什么是jsx?    JSX是JavaScript  XML 这两个单词的缩写,xml和html非常类似,简单来说可以把它理解成使用各种各样的标签,大家可以自行 百度.所以jsx就是在javascript中来编写长得很像xml的语言,这里只是像,在本质上是不一样的.    jsx是一种基于Ecmascript的一种新特性,        是一种定义带属性树结构的语法,树结构就是我们的dom结构,属性就是dom节点中的属性,比如所class,id等    jsx不是xml或者Html,     …

一眨眼,快三个月没有写博客了.一直在为自己没有写博客而懊恼,忙过这段时间,好好总结一下. 新项目主要是自己一个人在写,先搭建了一个初步的架构,用了我并不熟悉的angular,这个过程中,慢慢也熟悉了angular,同时也优化了自己的项目架构. 这两个多月里一直处在高强度的工作中,项目是一个面向用户的创作中心,涉及到数据.语音.图片.地图等等. 地图上的交互很复杂,由于项目需要还会同时用两种地图,一个谷歌一个高德,谷歌主要面向国外数据,高德面向国内数据, 两个地图可以任意切换,但是内容都要保持一致…

本文结合最近的工作经验,总结出一个较简洁的前端自动化构建方案,主张css和js的模块化,并通过grunt的自动化构建,有效地解决css合并,js合并和图片优化等问题,对于提高前端性能和项目代码质量有一定参考价值,欢迎阅读和点评:) github地址:https://github.com/liuyunzhuge/generator-web demo地址:https://liuyunzhuge.github.io/generator-web/ 有兴趣的同学,在阅读文章,学习或使用demo的过程中,有…

  本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写JavaScript,而你的JavaScript代码又与业务相关.我想无非就是一下三类功能: 1.请求后台数据 2.渲染后台数据,拼接Html 3.事件操作 当然你如果封装JS底层的控件,不在我们今天的讨论范围.你也许写过单文件上千行的JS,你也许维护过几千行的JS,每次重新看起来,或者增删改功能吃力吗,…

键盘控制应用范围非常广泛,比如快捷键控制页面的滚动:在填写表单时候,限制输入内容:或者是屏蔽复制.粘贴.退后等功能.这里说说用jQuery比原生态的JS好用,代码简单清晰,不要问我JS怎么写,因为我不知道.在现在交互满天飞的年代,你加载一个jQuery大家还是能接受的. $(window).keydown(function(event){ switch (event.which) { case(74): //J键 //要执行的操作 break; case(75)://K键 //要执行的操作 br…

键盘控制应用范围非常广泛,比如快捷键控制页面的滚动:在填写表单时候,限制输入内容:或者是屏蔽复制.粘贴.退后等功能.这里说说用jQuery怎么来实现.个人觉得jQuery比原生态的JS好用,代码简单清晰,不要问我JS怎么写,因为我不知道.在现在交互满天飞的年代,你加载一个jQuery大家还是能接受的. $(window).keydown(function(event){   switch (event.which) {   case(74): //J键   //要执行的操作   break;  …

webpack是时下十分流行的编译和打包工具,它提供一种可扩展的loader的方式,简单的配置,便可以编译打包各类型的文件,包括js.css.image.font.html,以及各种预编译语言都不在话下. 一.回顾与思考 在上一节的[入门:十分钟自动化构建]中我们讲解了如何用gulp去搭建一个工作流.我们认识到gulp是一个流程管理工具,以单个任务为基础单元,组合成为一套完整的工作流,而且gulp还有很多的以gulp-*格式命名的工作模块,用来处理各种资源文件,如果没有看过上一节内容的同学,建议…

项目成果展示(所有项目文件都在阿里云的共享云虚拟主机上,访问地图可以会有点慢,请多多包涵). 01:中国地图:http://test.sharegis.cn/mapbox/html/3china.html 02:德国-德累斯顿市:http://test.sharegis.cn/mapbox/html/6germany.html 1.中国地图离线实例 将所有的在线资源替换为本地资源,这里主要关注一下三种矢量切片的获取方式, 1.通过tms服务http://localhost:8080/geoser…

html 命名规则 一.注意事项: 1. 一律小写; 2. 尽量用英文; 3. 不加中杠和下划线; 4. 尽量不缩写,除非一看就明白的单词. 主要的 master.css 模块 module.css 基本共用 base.css 布局,版面 layout.css 主题 themes.css 专栏 columns.css 文字 font.css表单 forms.css 补丁 mend.css 打印 print.css 5. 坚持以字母开头命名选择器,这样可保证在所有浏览器下都能兼容. 二.常用的cs…

什么是jsx?    JSX是JavaScript  XML 这两个单词的缩写,xml和html非常类似,简单来说可以把它理解成使用各种各样的标签,大家可以自行 百度.所以jsx就是在javascript中来编写长得很像xml的语言,这里只是像,在本质上是不一样的.    jsx是一种基于Ecmascript的一种新特性,        是一种定义带属性树结构的语法,树结构就是我们的dom结构,属性就是dom节点中的属性,比如所class,id等    jsx不是xml或者Html,     …

根据维基百科,CSS框架是事先准备好的库,是为了让使用层叠样式表语言来美化网页更容易,更符合标准.在这篇文章中,我们已经收集了一些现成的框架,这将使你减少你的任务流程和代码.我们希望你会发现列表中的方便和有用的为您的开发需求.如果你知道任何其他方便和有用的CSS框架,请在评论框中,留下你的建议! 1. Pure : CSS Framework Pure是来自雅虎的 CSS 框架,使用 Normalize.CSS 无需任何 JavaScript 代码.框架基于响应式设计,提供多种样式的组件,包括表…

前端文件上传功能比较依赖后端,所以第一步用nodejs实现一个供文件上传的功能接口. 因为本人对nodejs也是一知半解,所以刚开始的想法是像原始的ajax交互那样,获取上传文件的内容,然后再通过nodejs的buffer的知识,将获取到的文件流输出到准备好的目录中.于是就悲剧了.下面是获取图片资源的代码. 运行结果 首先获取资源是非常的慢,要等几分钟才会输出内容.后来看到可以在每一步获取文件流时就进行文件处理,不必等所有内容获取后再操作.但是随之又产生了一个新问题,就是获取来的文件内容中不仅包…

原生JS是指遵循ECMAscript标准的javascript,不同于微软的jscript也不依赖于任何框架,依托于浏览器标准引擎的脚本语言. jquery是在原生态的js上集成的框架资源,使用jquery并不代表代码就不是你写的,区别在于使用jquery只是使用了它的语法,更利于兼容以及实现,jquery已经将常规的js兼容问题解决,所以使用起来出现不兼容的情况会更少,更利于开发. 但同时,要使用jquery等框架也需要去学习相关的语法,拥有js基础的同学学习jquery时会发现很轻松,在使用…

随着前端技术日新月异迅猛发展,为了实现更好的前端性能,最大程度提高用户体验,支持单页应用的框架逐渐占领市场,如众所周知的React,Vue等等.但是在单页应用的趋势下,快速定位并解决JS错误却成为一大难题.在当下的互联网行业,对前端性能要求越来越高,前端性能监控的产品层出不穷,javascript错误诊断更是其中举足轻重的一个环节.帮助开发者排查线上bug,实现快速定位问题,高效解决问题,是我们努力的方向. 一.JS错误诊断 目前已经有了许多诸如Arms,Sentry等前端性能监控框架,都在一定…

本文以 JavaScript 为例,介绍了该如何优化函数,使函数清晰易读,且更加高效稳定. 软件的复杂度一直在持续增长.代码质量对于保证应用的可靠性.易扩展性非常重要. 然而,几乎每一个开发者,包括我自己,在职业生涯中都见过低质量的代码.这东西就是个坑.低质量代码具备以下极具杀伤力的特点: 函数超级长,而且塞满了各种乱七八糟的功能. 函数通常有一些副作用,不仅难以理解,甚至根本没法调试. 含糊的函数.变量命名. 脆弱的代码:一个小的变更,就有可能出乎意料的破坏其他应用组件. 代码覆盖率缺失. 它…

一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Java代码 收藏代码var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Java代码 收藏代码function f1(){ var n=999; } alert(n); // error 这里…

引自  https://www.cnblogs.com/huangwentian/p/6854472.html#commentform ① this指向的,永远只可能是对象!       ② this指向谁,永远不取决于this写在哪!而是取决于函数在哪调用.       ③ this指向的对象,我们称之为函数的上下文context,也叫函数的调用者.…

function Queue(type) { //type 是否是一个接着一个执行 function QueueConst() {} QueueConst.execute_ing=[], QueueConst.execute_no=[], QueueConst.state=1, QueueConst.type = type?type:false QueueConst.prototype.stop=function () {//暂停 QueueConst.state=2 } QueueConst.…

之前发过该文,后来不知怎么回事不见了,现在重新发一下. 中秋主题的3D旋转相册 如图,这是通过Javascript和css3来实现的.整个案例只有不到80行代码,我希望通过这个案例,让正处于迷茫期的js初学者感受到学习的乐趣.我会尽可能讲得详细,不需要你对css和js有多么高深的理解,你也可以跟着一步步做出来.如果你是为了讨女票开心,那么也完全可以把图片换成对方的照片,在某个特别的时刻给对方一个惊喜哦 ~ css3的强大使得网页的展示变得空前得丰富起来,再配合简单的js代码,就可以实现这个效果.…

引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会更偏爱Vue,对于某些问题用Vue来解决会更好,如果没有这点信念,我们也就不会整天为此忙活了.但是,我们想尽可能地公平和准确地来讲述.其他的框架也有显著的优点,比如 Rect 的生态系统,或者 Knockout 对浏览器支持到 IE6 .我们把这些也都会全列出来. 我们希望得到你们的帮助,来使文档保…