1,创造简短的写法

你可以这么写:

 var slice = Array.prototype.slice;
slice.call(arguments); //转化成数组

也可以这么写:(ie9+)

 var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.call.bind(unboundSlice);
slice(arguments);//转化成数组

还可以这么写:

 (function(slice){
slice(); //可以直接调用该方法
})(Array.prototype.slice);

2,原型方法扩展:

你可以这么写:

 function   A(){};
A.prototype.fn1=function(){};
A.prototype.fn2=function(){};

也可以这么写:

  function A(){};
A.prototype={
constructor:A,
fn1:function(){},
fn2:function(){}
};

还可以这么写:

 function A(){};
$.extend(A.prototype,{
fn1:function(){},
fn2:function(0{}
});

3,返回一个由数组拼合成的字符串

你可以这么写:

 function A(){
var a=[]; a.push("str1");
a.push("str2");
a.push("str3"); return a.join("");
};

也可以这么写:

 function A(){
return [
"str1",
"str2",
"str3"
].join("");
};

4,逗号表达式

你可以这么写:

 var   a;
var b;
var c;

也可以这么写:

1 var  a,b,c;

5,巧用&&

你可以这么写:

1 if(a){
2 b();
3 };//如果a为真,则执行函数b

也可以这么写:

1 a && b();

6,巧用||

你可以这么写:

 if(!a){
c();
};//如果a为假,则执行函数c

也可以这么写:

 !a || c();

7,巧用三元表达式

你可以这么写:

 if(a){
b();
}else{
c();
}//如果a为真,则执行函数b,否则执行函数c;

也可以这么写:

 a ? b():c();

8,同一个对象上绑定多个事件

你可以这么写:

 1 $(obj).click(function (){});
2 $(obj).focus(function (){});
3 $(obj).blur(function (){});

也可以这么写:

 $(obj).bind({
click:function(){},
foucus:function(){},
blur:function:(){}
});

9,缓存对象属性,防止每次都去读取属性

你可以这么写:

 for(var i =0 ;i < obj.length; i++){};

也可以这么写:

for(var i=0, len=obj.length;  i < len; i++){};

10,数组拼合

你可以这么写:

 var a=[1,2,3];
var b=[4,5,6];
var a=a.concat(b);//a=[1,2,3,4,5,6]

也可以这么写:

 var a=[1,2,3];
var b=[4,5,6];
a.push.apply(a,b);//a=[1,2,3,4,5,6]

这个地方不能不call哦,apply的参数必须是数组,此处正是利用了这一点!

11,没有库时,应该做简易的封装

你可以这么写:

 var  dom1 = document.getElementById("id1");
var dom2 = document.getElementById("id2");

也可以这么写:

 function D(id){
return document.getElementById(id);
} var dom1=D("id1");
var dom2=D("id2");

12,善于使用正则:

你可以这么写:

 if(document.readyState==="loaded" || document.readyState==="complete"){}

也可以这么写:

 if (/loaded|complete/.test(document.readyState)){}

13,利用js内部的自我转换

你要将number和string转换,可以这么做:

 //number转化成string
var num=123;
var str=num.toString(); //"123" //string转化成number
var str="123";
var num = parseInt(str,10); //

也可以这么写:

 //number转化成string
var num=123;
var str=num+""; //"123" //string转化成number
var str="123";
var num = str-""; //

14,使用原型进行批量复制:

你可以这么写:

 function f(x){
x!=null && this.x=x;
};
var a = [];
for(var i = 0; i<100; i++){
a[i]=new f(10); //把实例分别存入数组
};

也可以这么写:

function f(x){
x!=null && this.x=x;
};
var a = [];
function temp = {};
temp.prototype=new f(10);
for(var i = 0; i<100; i++){
a[i]=new temp(); //把实例分别存入数组
};

假如你想修改数组的值,只需要修改类f的原型即可。

开心一刻:

让你的javascript代码高大上的更多相关文章

  1. 高级Javascript代码

    Javascript是一门很吊的语言,我可能学了假的JavaScript,哈哈,大家还有什么推荐的,补充送那啥邀请码. 本文秉承着:你看不懂是你SB,我写的代码就要牛逼. 1.单行写一个评级组件 &q ...

  2. javascript代码 调试方法

    你的代码可能包含语法错误,逻辑错误,如果没有调试工具,这些错误比较难于发现. 通常,如果 JavaScript 出现错误,是不会有提示信息,这样你就无法找到代码错误的位置. 在程序代码中寻找错误叫做代 ...

  3. 7个高性能JavaScript代码高亮插件

    本文由码农网 – 小峰原创,转载请看清文末的转载要求,欢迎参与我们的付费投稿计划! 对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉.一款优秀的JavaScript代码高亮插件,将会帮助你渲染 ...

  4. JavaScript代码段整理笔记系列(二)

    上篇介绍了15个常用代码段,本篇将把剩余的15个补齐,希望对大家有所帮助!!! 16.检测Shift.Alt.Ctrl键: event.shiftKey; //检测Shift event.altKey ...

  5. JavaScript代码段整理笔记系列(一)

    30段JavaScript代码——上篇 1.如何区分IE及非IE浏览器: if(!+[1,]){ //IE 11 不支持 alert("这是 IE 浏览器"): }else{ al ...

  6. 如何让你的JavaScript代码更加语义化

    语义化这个词在 HTML 中用的比较多,即根据内容的结构化选择合适的标签.其作用不容小觑: 赋予标签含义,让代码结构更加清晰,虽然我们可以在标签上添加 class 来标识,但这种通过属性来表示本体的形 ...

  7. 推荐15个最好用的 JavaScript 代码压缩工具

    JavaScript 代码压缩是指去除源代码里的所有不必要的字符,而不改变其功能的过程.这些不必要的字符通常包括空格字符,换行字符,注释以及块分隔符等用来增加可读性的代码,但并不需要它来执行. 在这篇 ...

  8. 新书《编写可测试的JavaScript代码 》出版,感谢支持

    本书介绍 JavaScript专业开发人员必须具备的一个技能是能够编写可测试的代码.不管是创建新应用程序,还是重写遗留代码,本书都将向你展示如何为客户端和服务器编写和维护可测试的JavaScript代 ...

  9. FineUI(专业版)实现百变通知框(无JavaScript代码)!

    博客园已经越来越不公正了,居然说我这篇文章没有实质的内容!! 我其实真的想问哪些通篇几十个字,没任何代码和技术分享,嚷嚷着送书的文章的就能雄霸博客园首页几天,我这篇文章偏偏就为管理员所容不下. 其实我 ...

随机推荐

  1. golang采坑记 一(http与json)

    http服务端在把json串写入http.ResponseWriter对象的时候我们常用的方式如下: //方法一: func ...(w http.ResponseWriter, r *http.Re ...

  2. mysql注入介绍

    0. SQL注入常用的尝试语句: or 1=1--+ 'or 1=1--+ "or 1=1--+ )or 1=1--+ ')or 1=1--+ ") or 1=1--+ " ...

  3. windows下memcached安装以及php_memcache.dll扩展

    http://kimi.it/258.html http://kimi.it/259.html https://www.cnblogs.com/elenaPeng/p/6877530.html htt ...

  4. java网络编程TCP传输—流操作—服务端反馈与客户端接收

    在读取完流后,服务端会向客户端返回一些数据,告诉客户端,已经写完了. 在这里和”流操作—拿到源后的写入动作“差不多,客户端同样以byte与Buffered两种缓冲读取作为例子,同时,.也是希望大家给补 ...

  5. OpenCV-Python cv2.imdecode()和cv2.imencode() 图片解码和编码

    cv2.imdecode()函数从指定的内存缓存中读取数据,并把数据转换(解码)成图像格式;主要用于从网络传输数据中恢复出图像. cv2.imencode()函数是将图片格式转换(编码)成流数据,赋值 ...

  6. Django 碎片集合

    命令行创建Django项目 熟记建立django命令:django-admin startproject xx   (start   project) 目录介绍 manage.py 文件是用来管理文件 ...

  7. (八)java运算符

    算数运算符 + - * / % ++ -- class Ysf { public static void main(String[] args) { System.out.println(5/2);/ ...

  8. phpcms v9 tags调用方法

    {loop $keywords $keyword} <a href="{APP_PATH}index.php?m=content&c=tag&catid={$catid ...

  9. ethtool常见命令使用方法

    查看网卡信息:ethtool DEVNAME Settings for eth6: Supported ports: [ FIBRE ] #可以看出网卡类型:光口或电口 Supported link ...

  10. Qt图形视图体系结构示例解析(视图、拖拽、动画)

    本博的示例来自与QT Example:C:\Qt\Qt5.9.3\Examples\Qt-5.9.3\widgets\graphicsview\dragdroprobot 将通过分析示例完成主要功能: ...