在编写一个js库之前需要准备许多基础知识。

本人在编写之前主要参考了visjs和百度的echarts这两个库的部分内容,这之中提取出几个要点如下:

1、如何整理代码结构,使模块与模块分开又不至于出现调用困难的现象?

  首先讲一下上面两个参考的库使用的方法,visjs是一个相对较小的开源库,目前已经更新了很多个版本,但是最具参考意义的应该是0.0.9版,因为之后的版本增删改太多,命名方式也改的很奇葩,基本看不懂,读者可以从github上下载历史版本。他的代码整理工具用的是nodejs,通过一个生成方法,将多个文件拼装到一起并做一些后期处理。我认为这是最简单但是略显简陋的一种方式,因为所有的外层对象都互相可见,随着代码量的增大,变量重名的可能性增大,出错查不到那就会很蛋疼。另外一个库echarts使用的也是nodejs,但在代码管理上还增加了一套AMD规则库,esl.js,可以对代码进行按需加载,且不容易出现变量重名的现象,而且由于模块被define函数包裹,coder可以控制哪些模块函数对外可见。

  综上,本文编写的类库也将使用esl作为模块加载器,并在需要的时候配合使用nodejs。当然如果你的库是要发布的,那么请在发布之前做好模块的拼装,不要出现过多的HTTP请求,导致页面加载缓慢。具体的使用方法:

 模块定义:

define(function () {
function Math(msg) {//定义了一个函数模块
this.Message = msg;
} Math.prototype.Add = function (a, b) {//给函数模块的原型添加了Add方法
return a + b;
}; return Math;//输出模块,只有输出模块才对外可见,无论define内部有多少个函数
});

模块使用:

var Math = require(["YouPath/jsFileName"]);//在另一个文件中向esl请求该模块

alter(Math.Add(1,2));//

2、js库开发使用哪个IDE较好

  这个得看个人习惯,以及开发的库的内容,我这次要开发的是一个动态窗口生成+动态数据加载的库,经过一段时间的搜索和磨合,最终我选择了使用WebStrom9.0+chrome这套组合。(话说webStorm是要收费的,不过你懂的,呵呵)为什么呢?主要原因是webStorm的页面漂亮,注释功能和代码整理功能强大,适合我。话说使用一套IDE最好能知道一些快捷键,这会是编码更加高效,毕竟脑子走的太快了,手根本跟不上。

js库编写的环境和准备工作的更多相关文章

  1. 【转载】写一个js库需要怎样的知识储备和技术程度?

    作者:小爝链接:https://www.zhihu.com/question/30274750/answer/118846177来源:知乎著作权归作者所有,转载请联系作者获得授权. 1,如何编写健壮的 ...

  2. js库写法

    前言: 现在javascript库特别多,其写法各式各样,总结几种我们经常见到的,作为自己知识的积累.而目前版本的 JavaScript 并未提供一种原生的.语言级别的模块化组织模式,而是将模块化的方 ...

  3. 如何写JS库,JS库写法

    前言: 现在javascript库特别多,其写法各式各样,总结几种我们经常见到的,作为自己知识的积累.而目前版本的 JavaScript 并未提供一种原生的.语言级别的模块化组织模式,而是将模块化的方 ...

  4. 循序渐进VUE+Element 前端应用开发(1)--- 开发环境的准备工作

    之前一直采用VS进行各种前端后端的开发,随着项目的需要,正逐步融合纯前端的开发模式,开始主要选型为Vue + Element 进行BS前端的开发,后续会进一步整合Vue + AntDesign的界面套 ...

  5. typescript+webpack构建一个js库

    依赖说明 入口文件 tsconfig配置 webpack配置文件 webpack入口文件配置 webpack为typescript和less文件配置各自的loader webpack的output配置 ...

  6. 仿照jquery封装一个自己的js库(二)

    本篇为完结篇.主要讲述如何造出轮子的高级特性. 一. css方法的高级操作 先看本文第一部分所讲的dQuery css方法 //css方法 dQuery.prototype.css=function( ...

  7. javascript学习(一)构建自己的JS库

    库是一个饱受争议的热门话题.一种观点认为它是一种非常棒的工具,是任何开发者都不可或缺的:另一种观点则认为在不理解库的内部工作原理的情况下对库形成依赖,会助长懒惰的风气从而导致开发者素质下降 库是一个饱 ...

  8. 主流JS库一览

    主流JS库一览 标签: prototypedojomootoolsprototypejsjqueryjavascript 2009-10-14 22:52 19936人阅读 评论(2) 收藏 举报   ...

  9. 绘制3D的js库

      有哪些值得推荐的绘制3D的js库?   4 个回答 默认排序​ 草皮子 HTML5/GAME 4 人赞同了该回答 只用过three.js,所以推荐这个.不清楚你打算用来做什么,总的来说,得看你的运 ...

随机推荐

  1. 用css3实现闪烁效果

    1. css3 @keyframes 参考 css3 @keyframes规则. 特别注意浏览器支持: Internet Explorer 10, Firefox, 和 Opera 支持 @keyfr ...

  2. 武汉科技大学ACM :1001: 华科版C语言程序设计教程(第二版)课后习题3.12

    Problem Description 输入n,输出对应的边长为n的空心正六边形. 为方便看图,样例中点 '.' 表示空格,打印图形时请打印空格而非小圆点. Input 边长n.(n<=20) ...

  3. 如何退出Activity?如何安全退出已调用多个Activity的Application?

    如何退出Activity?如何安全退出已调用多个Activity的Application? 退出Activity直接调用finish()方法  //用户点击back键就是退出一个Activity 退出 ...

  4. Memcached使用手册

    memcached简介 1.memcached是一个高性能的分布式的内存对象缓存系统,通过在内存里维护一个统一的巨大的hash表,它能够用来存储各种格式的数据,包括图像.视频.文件以及数据库检索的结果 ...

  5. Google Chrome一些小技巧

    document.body.contentEditable='true'; 可以编辑网页上的内容

  6. 数据分页SQL语句的比较

    建立表 CREATE TABLE [TestTable] ( , ) NOT NULL , ) COLLATE Chinese_PRC_CI_AS NULL , ) COLLATE Chinese_P ...

  7. new Date参数问题

    new Date支持的参数: MDN:   new Date();   new Date(value);   new Date(dateString);   new Date(year, month, ...

  8. Linux编译错误集

    1.编译驱动: FATAL: modpost: GPL-incompatible module ArmGpioDriver.ko uses GPL-only symbol 'class_destroy ...

  9. 仿QQ5.0以上新版本侧滑效果

    1.此效果使用了csdn大神孙国威的代码案例在此感谢附上参考博客地址: http://blog.csdn.net/manoel/article/details/39013095/#plain 2.sl ...

  10. SPOJ--K-query (线段树离线) 离线操作解决一些问题

    K-query Given a sequence of n numbers a1, a2, ..., an and a number of k- queries. A k-query is a tri ...