首页风格
门户
博客

GBin1博客视图 - 最近发布的文章-demo

web开发中需要注意的一些编码习惯

web开发中需要注意的一些编码习惯

有过一定工作经验的朋友们,肯定对于项目开发中的coding标准非常熟悉,不同的团队或者项目,都有不太一样的编码习惯和指导文档。但是对于不同 的编码习惯,大家肯定都希望使用大体上统一的风格,简单来说会使得开发效率更高,阅读速度更快,在这篇文章中,我们将分享一些个人觉得比较有效的编码习惯 和最佳实践,如果你觉得有更多其它的经验,请和我们分享。

以下内容主要使用PHP做为例子,如果使用其它编程语言,编码基本类似,大家可以自己在项目中具体应用。

缩进问题 - Tab或者空格

最简单的问题,大家对于缩进使用的是tab或者space呢?

这个问题没有太多的必要去讨论,因为没有谁拥有完全正确的答案,但是最重要的一点,就是不要混用空格和tab,如果大家使用一些JS的校验工具,比如,jshint的话,你最常看到的问题就是

Mixed Tab and Space

个人推荐使用tab,因为不同的编辑器对于tab的解析也不太一样,如果你需要使用tab的话,可以考虑使用4个空格来代替。

类名称定义

为了在定义中避免重复,尽量使得定义包含一些前缀,并且使首字母大写,这样易于阅读,如下:

class…

标签: web开发, 编码设计, php, js, javascript

阅读更多

Angular指令示例

Angular指令示例

过去几个月中,我一直在研究Angular框架。我觉得最好用的就是它的"指令"概念,并且我很想把这个功能学好。"指令"可以为你的标记提供语义意义和功能性。有几种方法能实现指令,angular网站上的文档还在不断更新,现在我来与大家分享我是如何使用它的。

目标:创建一个可重用的甜甜圈图表和图例

首先,我们要思考如何把数据输入到图表。我创建了一个快捷模块,它包含一个"生产线",里面有"产品"。这个计划是能够使用单一控制器和视图看到同一个产品的甜甜圈图表和图例,以及完整的生产线。

每个产品都有一个原始货品成本、运输成本、标记数量。单例模式是指生产线能够获得所有产品的聚合数据,用于查看全部种类货品的总体成本。然后我创建了一个服务应用程序来与这个模块进行互动。

由于本教程专注于指令,所以我不会详细介绍其他部分,不过你还可以在 我的github上找到全部源代码。

创建甜甜圈图表指令

我们要做的第一件事情是创建图表指令,如下所示:

myAngularApp.directive('chartDonut',…

标签: angular, 指令提示, 指令示例, jquery, js

阅读更多

一个强大的超棒轻量级javascript图形类库 - Bonsai

一个强大的超棒轻量级javascript图形类库 - Bonsai

今天介绍一款超棒的javascript图形类库 - Bonsai,免费的开源图形javascript类库,可以方便的帮助你创建图形和动画。

这个类库使用SVG作为输出方式来生成图形和动画效果,拥有非常完整的图形处理API,可以使得你更加方便的处理图形效果。

主要特性

  • 设计上分开了选择和运行器
  • 可以使用iFrame, Worker和Node来运行
  • 支持路径
  • 支持不同的资源(视频,图片,字体和小电影)
  • 基于Keyframe和时间的动画 (拥有easing功能)
  • 变形路线(Path morphing)
  • 更多

如何使用

绘制一个100x200的矩形:

var r = new Rect(0, 0, 100, 200).addTo(stage);

填充颜色:

r.fill('blue'); 

重新填充并且加深:

r.fill(color('green').darker()); 

最后生成动画效果:

r.animate('400ms', {

标签: javascript, js, 图形类库, 动画类库, Bonsai

阅读更多

使用javascript生成PDF的类库 - jsPDF

使用javascript生成PDF的类库 - jsPDF

在线演示

曾经生成PDF都是服务器端代码的专利,在今天的这篇文章中,我们将介绍一个javascript类库 - jsPDF,使用它能够帮助你使用前端脚本生成PDF文件,是不是很棒,试试吧!

jsPDF支持不同类型的PDF文件格式,包括:文本,数字,图形,图片,同时你可以自由的编辑标题或者其它类型元素。

支持互动的内容制作,例如,你可以输入文字或者数字,然后jsPDF帮助生成最后的PDF内容。

支持现代浏览器,如果是老式浏览器的话,可以很好的使用flash来实现兼容。不过貌似支持Firefox不是很好,如果要查看演示,使用Chrome吧!

标签: javascript, js, 创建pdf, pdf, js创建pdf

阅读更多

一个帮助你针对不同标签自动填入内容的轻量级javascript类库 - fixiejs

一个帮助你针对不同标签自动填入内容的轻量级javascript类库 - fixiejs

在线演示  本地下载

如果大家开发或者设计网站的时候,都可能需要添加一些占位或者虚拟内容(即ipsum),以前我们相关文章介绍过。

在今天这篇文章中,我们将介绍另外一个非常实用的虚拟内容生成器 - fixiejs,这个js类库最大的特点在于能够针对不同的HTML标签生成对应的内容。你不需要做任何其它事情。能够有效的帮助你节约开发设计时间。通过解析你的HTML标签,fixie可以自动添加正确的内容到合适的位置,包括,header,p,link和images等等。这样你可以专注于设计本身。并且能够直接看到设计效果。

如何使用?

加入类库,不需要jQuery:

<script type="text/javascript" src="https://raw.github.com/ryhan/fixie/master/fixie_min.js"></script>…

标签: javascript, js, fixiejs, js自动填充内容

阅读更多

分享11款性能提升必备的超级javascript压缩工具

日期:2012/01/10  来源:GBin1.com

分享11款性能提升必备的超级javascript压缩工具

AJAX在web和网站开发中越来越多的被应用,目前已经变成了所有网站使用的标准技术之一。更多的使用AJAX同时也意味着javascript文件会变得越来越大并且越来越复杂。如何使得javascript文件体积变小并且有效减少带宽占是我们需要急于解决的问题。事实上浏览器并不在乎javascript是否有空格和注释,因此我们大可以直接去掉这些,今天我们将介绍11款非常不错的JS压缩器。希望大家喜欢!

1. JsMini

在线javascript和jQuery压缩工具。免费并且使用简单,压缩速度快。

分享11款性能提升必备的超级javascript压缩工具 gbin1.com

2. ExtDoc - JavaScript Comments Processor

ExtJS类库拥有指定的javascript文档样式 - ExtDoc解析js的源代码并且创建基于模板的输出。支持自定义的标签和完整模板输出。

分享11款性能提升必备的超级javascript压缩工具 gbin1.com

3. JsDoc Toolkit

一个javascript开发的应用,通过javascript的源代码注释自动产生模板格式化,多页面的HTML(或者XML,JSON,或者其它基于文本)文档

分享11款性能提升必备的超级javascript压缩工具 gbin1.com

标签: javascript, js, javascript压缩, javascript减肥, js压缩工具, javascript压缩工具, jquery压缩工具, js压缩器, js减肥工具, css压缩

阅读更多

分享10个帮助你编写更加简洁javascript代码的小技巧

日期:2011/12/13  来源:GBin1.com

分享10个帮助你编写更加简洁javascript代码的小技巧 GBin1.com

如果你是javascript开发人员的话,这篇文章绝对是你应该阅读的。这篇文章中我们将介绍各种技巧帮助你编写更加简洁的javascript代码。

同时在这篇文章中,我们将列出正常版本及其简略版本。希望大家能够喜欢!

1. if true ... else语句的简略写法

这段代码非常不错的简洁方式来书写if true, else

复杂写法:

var big;
if (x > 10) {
    big = true;
}
else {
    big = false;
}

简洁写法:

var big = (x > 10) ? true : false;

如果你使用javascript的弱类型特性的话,你可以得到更加精细的代码。例如,你可以将代码缩写成如下:

var big = (x > 10);

//further nested example
x…

标签: javascript, js, javascript编写技巧, js编写技巧, js代码缩写, js代码缩略, js代码技巧, javascript代码缩略技巧, javascript代码简洁技巧

阅读更多

喜欢我们的文章请您与朋友分享:

?ü?à

今日推荐