12行javascript代码绘制一个八卦图_javascript技巧_脚本之家

一句话说明:用有限的代码构建一个1024*1024的颜色矩阵,秀出你的编程&艺术之美

复制代码 代码如下: function setPage{
if(!opt.pageDivId || opt.allPageNum < opt.curpageNum ||
opt.allPageNum < opt.showPageNum){return false}; var allPageNum =
opt.allPageNum; //总的页数 var showPageNum = opt.showPageNum;
//显示的页数 var curpageNum = opt.curpageNum; // 当前的页数 var
pageDIvBox = document.getElementById; //左边或右边显示页码的个数 var
lrNum = Math.floor; if{ var oA = document.createElement; oA.href=’#1′;
oA.innerHTML = ‘首页’ pageDIvBox.appendChild; } if{ var oA =
document.createElement; oA.href=’#’+; oA.innerHTML = ‘上一页’
pageDIvBox.appendChild; } if(curpageNum下面对关键的几个地方做个总结:
1.点击的当前页码需要在显示的页码中居中; 无论是显示 3页 5页 7页 9页……
等等 当前页要居中,可以推出一个公式 用显的页码个数除以2
再取整,就可以得到左右需要显的页码个数。这个对后面的分页判断很有用 var
lrNum = Math.floor; 2.获取页码 this.getAttribute
用它可以得到相对路径;this.href 用它只能得到绝对路径DEMO在线演示

第一段代码就是强调一下这个用法,我在我的项目中使用了一个switch,后来我发现这样的代码好丑,于是我就写成||&&形式的,
后来测试性能的时候,发现性能竟然上了一个数量级,可见这种写法在某些情况下可以增加性能,但是我并不确定是何种情况才能提高性能,因为我测试在通常情况下switch和||&&的性能是差不多的.
原来的代码: 复制代码 代码如下:
switch(this.now_char=this.str.charAt{ case “/”: if continue;else
this.str2+=this.now_char; break; case “\””: case “\'”: if
continue;else this.str2+=this.now_char; break; case “\n”: if
continue;else this.str2+=this.now_char; break; case “{“: case “}”: if
continue;else this.str2+=this.now_char; break; case “:”:if
continue;else this.str2+=this.now_char;break; default: if continue;else
this.str2+=this.now_char; break; } 改写后的代码,功能当然是一样的 view
sourceprint?1 (this.now_char==”/”&&||(this.str2+=this.now_char)))||
((this.now_char==”\””||this.now_char==”\'”)&&||(this.str2+=this.now_char)))||
(this.now_char==”\n”&&||(this.str2+=this.now_char)))||
((this.now_char==”{“||this.now_char==”}”)&&||(this.str2+=this.now_char)))||
||(this.str2+=this.now_char))
我嚼的第二种写法更简洁点,||&&还有很多用处,可以看那篇文章的介绍
第二段代码是利用了一个特性: (ele=document.createElement
;//这个表达式会返回一个dom元素,赋值的同时会把值返回给外边的括号
于是出来下面这段代码 : 复制代码 代码如下:
var mixin=function{ for{ target[i]=options[i] } } var ele=null;
mixin(ele=document.createElement,{ id:”aa”, className:”bb”,
innerHTML:”sss” }) document.body.appendChild//aa debug//bb debug//sss
这段代码是因为我实在厌烦了建立一个dom元素的时候的一大堆语句: 复制代码 代码如下: var
ele=document.createElement ele.; ele.className=”aa” ele.innerHTML=”sss”
等等等等,好烦啊. 于是出来了上面的代码. 用上面的原理还可以这样写代码
(ele=document.createElement.className=”aa”;
感觉是不是节省了一点空间呢,上面这句话节省了一个变量名,呵呵.

起源于 stackexchange 上的一个问题,
这里稍微做了一下扩展,支持更多编程语言,并放宽了代码长度的限制。规则

目标:通过实现 模版 中的一个函数 get_color_at ,在一个 1024*1024
的画布上画出尽可能 “有意思” 的图案。

参数:int x, int y ,取值均为 0 – 1023,对应画布上坐标点,左上角为起始点

返回:int r, int g, int b, int alpha, 对应颜色的 RGBA 分量,均为 0 –
255。

注意:各语言中 alpha 分量定义可能不同,由 模版 统一转换为: 0 –
255,值越大越透明。

要求:只能编辑 模版 中 get_color_at 函数体内 // {{code start}} – //
{{code end}} 间的代码;代码总字符数不能超过 1024 个,且有较好的可读性。

if(typeof f_c=="undefined"){ f_c=function{ return Math.sqrt+Math.pow<=r; };}var x0=x-512,y0=y-512;r=g=b=128;if r=g=b=?255:0;if&&x0<=0) r=g=b=255;if&&x0>0) r=g=b=0;if r=g=b=0;if r=g=b=255;

以上所述就是本文的全部内容了,希望大家能够喜欢。

相关文章