【javascript】随手记代码
//js实现的当前界面的刷新、前进、后退 <input type="button" value="刷新" onclick="window.location.reload()"> <input type="button" value="前进" onclick="window.history.go(1)"> <input type="button" value="后退" onclick="window.history.go(-1)"> <input type="button" value="前进" onclick="window.history.forward()"> <input type="button" value="后退" onclick="window.history.back()">
console.log Firefox最先提出的,后来被各个浏览器采用;即在控制台输出日志,不会像alert一样打断程序进程,适合用于与Firebug或者是其他的开发者工具配合进行调试
//全局变量
function sum1(x,y){
result = x+ y;
return result;
}
/*上面这个函数中,result没有用var进行声明,实际上result变成了隐式的全局变量,result在其他函数中也可以访问;若写成var result其生存期就仅在函数内部,所以因为在一个项目中引用的js文件过多、很多地方使用到简单易用的全局变量,所以为了使自己引用的变量不被挂掉,尽量减少使用全局变量*/
function temp(){
var a= b =0;
var c,d;
}
/*同样进行链式声明的时候也应该注意全局变量,
上面这句中a是本地变量,b就是全局变量;c,d均为局部变量(前提是这个函数被调用一次后,要不变量压根不被声明出来)*/
/*全局变量可以通过delete来删除*/
var a=0;
delete(a);
/*删除成功的话会返回true,不成功返回false
继续测试一下,是否删除
*/
console.log ( typeof(a) );
/*如果删除成功的话,可以知道这个是输出undefined,没删出成功会输出正常的值number
用var声明的显示全局变量没办法delete,但是隐式的局部变量都可以delete
*/
js置顶解析:
所有函数内部新定义 var 的变量都会置顶解析,也算是一种预解析
所以全局变量可能在函数内部受影响,尽量避免函数内部使用全局变量的变量名称
myname = "global"; // 全局变量
function func() {
alert(myname);
var myname = "local";
alert(myname); //
}
func(); //最后结果是:第一个alert的是undefined,第二个alert的是myname
----------
window.onload() 和 $(document).ready(){}的区别:
1.window.onload是在等待界面内元素加载完毕前执行的函数,可以用于制作等待加载的遮罩效果
$(document).ready()并不是针对于界面内所有元素,而是针对于Dom对象,就是当浏览器经过渲染之后生成DomTree之前会执行。而图片、声音等不包括在内。所以适合做一些动画特效或者是css控制。
2. window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
$(document).ready()可以同时编写多个,并且都可以得到执行。
3.$(document).ready()可以简写成$(function(){});
在zepto中$被定义成了function,function直接调用了Init方法,Init方法中对$("参数")中的参数进行判断,其中一条就是若参数类型也为function的话,直接令其在文档加载后执行,
也就是类似的$(function(){我是函数})中,直接就把里面的function置于文档加载后即$(document).ready执行。
4.jquery中live方法能够为未来的元素绑定事件,即可以绑定所有后dom写入的元素
而bind只对当前文档内已有元素进行绑定,
.one方法是绑定后只能执行一次,若执行过后则自动取消绑定。
5.js获取某元素的属性值:
1.document.getElementbyId("input1").getAttributes("name") //type,classname,alt,title,id 没有该属性直接返回"",不报错
2.document.getElementbyId("input1").name //.type,.classname,.alt,.titlke 用什么点什么。
6.js插件形式
(function($){
$.fn.temp = function(){
//添加ele元素事件 this指向当前元素
}
})(jQuery);
(function($){
$.fn.temp = function(options){
//插件设置参数,可直接使用默认参数
var defaults = {
bgcolor:"red",
height:300,
width:400
};
var opts = $.extend(defaults, options);
})(jQuery);
//面向元素标签的插件调用方法: $("#ele").temp();
7.同一页面下多jQuery库共存(不推荐这么做,应该就插件本身做更新,而不应该将就着加载两个库)
$.noConflict函数,jQuery内部实现的共存机制函数,也可以用作多库共存函数。
使用方法:
<script type="text/javascript" src="jquery.1.7.2.min.js"></script>
<script type="text/javascript">
var jquery172 = $.noConflict(true);
</script>
<script type="text/javascript" src="jquery.1.9.0.min.js"></script>
<script type="text/javascript">
var jquery190 = $.noConflict(true);
</script>
<script type="text/javascript">
<!--具体使用方式-->
(function($){
//……函数代码……
})(jquery172);
</script>
noConflict函数实现原理:jQuery在种子模块中保存了全局对象中$和jQuery的状态,noConflict函数中可以将已经赋值的$和jQuery再还原,并返回当前库所对应的jQuery对象。
8. call&apply&bind
var obj = {
name:"Lee",
job:"f2e",
sayHello:function(){
console.log("Hello,I'm "+this.name+",my job is "+this.job);
}
}
var t = {name:"T",job:"XXX"};
obj.sayHello();
obj.sayHello.call(t);
obj.sayHello.apply(t,{});
var anotherSayHello = obj.sayHello.bind(t);
//bind函数不会自动执行sayHello函数,而是返回新的经过包装的函数
anotherSayHello();
9.看Node.js总结的一些异步方式
(1)CPS后继传递风格
CPS是指通过在函数内部调用回调函数的方式来实现异步,也称为标准回调模式。
readFile等IO函数都是此风格的回调模式;
CPS属于程序的控制权转让,JS单线程通过转让线程控制权来实现异步回调
function A(data,cb){
// deal with data
cb(newdata);
}
function B(nd){
//cout B
console.log(nd);
}
//调用 先执行A函数,直至A执行完再执行其回调函数B
A(10,B);
(2)事件发射器模式
Node.js里面称为事件发射器模式,前端库里面称为PUB-SUB模式,设计模式中称为观察者模式;
通过事件发射器发射事件,注册响应事件来处理该事件、执行响应函数;
Node.js中不是所有对象都可以发射事件,发射事件的对象必须集成events中的EventEmitter接口;继承方法直接调用inherits函数即可:
var util = require('util');
var EventEmitter = require('events').EventEmitter;
var Ani = function(){
// class init
}
util.inherits(Ani,EventEmitter);
注册事件之间不会覆盖,即如果先后声明过两次em.on('data',function1)和em.on('data',function2),f1和f2都会执行
var em = new (require('event').EventEmitter)();
em.emit('change',123456); //无任何输出
//注册事件响应函数
em.on('change',function(data){
console.log('change to '+data);
})
em.emit('change',654321); //因已经注册了事件响应函数,显示输出
回调模式适合处理单次的异步,比如文件读取、数据库写入等;
事件发射器模式适合多次重复的事件响应,比如HTTP获取数据等。
【javascript】随手记代码的更多相关文章
- Javascript 语言精粹 代码片段合集
Javascript 语言精粹 代码片段合集 标签:Douglas-Crockford Javascript 最佳实践 原文链接 更好的阅读体验 使用一个method 方法定义新方法 Function ...
- WebBrowser一点心得,如果在Javascript和Winform代码之间实现双向通信
原文:WebBrowser一点心得,如果在Javascript和Winform代码之间实现双向通信 最近工作需要,学习了一下winform内嵌webbrowser控件,然后与htm页面中的javasc ...
- Notepad++ 配置 支持jquery、html、css、javascript、php代码提示
原文:Notepad++ 配置 支持jquery.html.css.javascript.php代码提示 官网下载:http://notepad-plus-plus.org/ 获取插件的方法:打开软件 ...
- ASP.NET 前台Javascript调用后台代码 / 后台调用前台Javascript
1:ASP.NET 前台Javascript调用后台代码 1.1:前台Javascript <script> function CallCs() { var str = "< ...
- javascript拼接html代码
转自开源中国社区:http://www.oschina.net/code/snippet_94055_21640经常做jsp开发的朋友可能遇到一个情况,显示列表数据不是table,而是div或者其他很 ...
- 一步一步学Silverlight 2系列(22):在Silverlight中如何用JavaScript调用.NET代码
概述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, ...
- 浅谈javascript引擎执行代码的步骤-(2019-2)
平时面试经常会遇到类似下面的这种题,而且千变万化,让人一个头两个.示例这道题算是稍微有点难度的了,这种题考查的是JavaScript引擎执行代码的步骤. b = 'cba'; function a(a ...
- electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google JavaScript Style Guide代码规范
我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...
- JavaScript中的代码执行顺序
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head&g ...
随机推荐
- H264句法和语法总结(二)NAL层语法
1.NAL全称Network Abstract Layer, 即网络抽象层. 在H.264/AVC视频编码标准中,整个系统框架被分为了两个层面:视频编码层面(VCL)和网络抽象层面(N ...
- iOS中常见的设计模式——单例模式\委托模式\观察者模式\MVC模式
一.单例模式 1. 什么是单例模式? 在iOS应用的生命周期中,某个类只有一个实例. 2. 单例模式解决了什么问题? 想象一下,如果我们要读取文件配置信息,那么每次要读取,我们就要创建一个文件实例,然 ...
- 最小二乘拟合(转)good
在物理实验中经常要观测两个有函数关系的物理量.根据两个量的许多组观测数据来确定它们的函数曲线,这就是实验数据处理中的曲线拟合问题.这类问题通常有两种情况:一种是两个观测量x与y之间的函数形式已知,但一 ...
- JFrame 不规则窗体
效果截图: 这几天静心学java,由于学的不是很好,也没有什么有什么可以作品,但是毕竟也算刚开始认真学,也遇到了好多问题: 首先 1. JFrame的无边框设置:JFrame.setUndecorat ...
- 云计算三种服务模式SaaS、PaaS和IaaS及其之间关系(顺带CaaS、MaaS)
云计算架构图 很明显,这五者之间主要的区别在于第一个单词,而aaS都是as-a-service(即服务)的意思,这五个模式都是近年来兴起的,且这五者都是云计算的落地产品,所以我们先来了解一下云计算是什 ...
- Card objects
There are fifty-two cards in a deck, each of which belongs to one of four suits and one of thirteen ...
- 下雪了-js下雪效果
Jingle Bells,Jingle Bells,圣诞来临,做了一个下雪的小程序玩.有大雪花和小雪花. <!DOCTYPE html PUBliC "-//W3C//DTD XHTM ...
- 开源Cheops软件在企业中的应用
笔者在所属分公司的网络改造的网络改造中采用了开源软件作为其网络管理软件,曾经使用时间达2年多,没有出现过问题,其本身具备的主要管理功能完全可以商业的网管软件相媲美,下文将其部署心得和大家一起分享.一. ...
- javascript计算两个时间差
其实,javascript计算时间差的方式非常简单,如果是默认的Date()类型,直接相减就是相差的毫秒数. var d1 = new Date('2016/03/28 10:17:22'); var ...
- php 几种函数类型
<?php header("Content-type:text/html;charset=utf-8"); $a=; $b=; function demo(){ global ...