【写一个自己的js库】 1.搭个架子先

最近在看<javascript dom 高级程序设计>,想着跟着里面的代码敲一遍吧,也算是做一下学习笔记吧,所以这不是重新发明轮子,只是个学习的过程. 1.先确定自己的命名空间,并且加入几个常用的js方法.命名空间很重要啊,保证了自己库里的变量不污染全局空间,不和其他的库的变量名起冲突.命名空间的惯例就是把代码都放在自执行函数(function(){})()里了,然后暴露个方法给window对象了.所以0.1版本的代码就长下面这样了.(这里暂时没有用继承) (function(){ //命名空…

【写一个自己的js库】 2.实现自己的调试日志

还是本着学习的目的,实现一个自己的调试日志,界面很简单,就是将调试信息显示在页面的正中央,用一个ul包裹,每条信息就是一个li. 1.新建一个myLogger.js文件,将需要的方法声明一下.其中var声明的是私有成员,可见范围只在构造函数中,每个实例都会保存一套他们的副本.this声明的是特权方法,new的时候会把它绑定到实例上,实例可以直接调用它.在prototype上声明的就是公有方法了,每个实例都可以访问它.最后将一个实例赋值给Lily这个库,Lily就有自己的日志插件了. functi…

【写一个自己的js库】 5.添加修改样式的方法

1.根据id或class或tag修改样式,样式名是-连接格式的. function setStyleById(elem, styles){ if(!(elem = $(elem)) return false; for(prop in styles){ if(!styles.hasOwnProperty(prop)) continue; if(elem.style.setProperty){ elem.style.setProperty(prop, styles[prop]); }else{ el…

【写一个自己的js库】 3.添加几个处理字符串的方法

1.生成重复的字符串 if(!String.repeat){ String.prototype.repeat = function (count){ return new Array(count + 1).join(this); } } 2.去除开头和结尾的空字符 if(!String.trim){ String.prototype.trim = function (){ return this.replace(/^\s+|\s+$/g, ''); } } 3.将"-"格式的字符串变成…

【写一个自己的js库】 4.完善跨浏览器事件操作

1.阻止冒泡. function stopPropagation(event){ event = event || getEvent(event); if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble = true; } } Lily['event'] = stopPropagation; 2.阻止事件默认动作. function preventDefault(event){ event =…

仿照jquery封装一个自己的js库（二）

本篇为完结篇.主要讲述如何造出轮子的高级特性. 一. css方法的高级操作先看本文第一部分所讲的dQuery css方法 //css方法 dQuery.prototype.css=function(attr,value){ if(arguments.length==2){//当参数个数为2时,使用设置css的方法 var i=0; for(i=0;i<this.elements.length;i++){ this.elements[i].style[attr]=value; } }else{/…

仿照jquery封装一个自己的js库（一）

所谓造轮子的好处就是复习知识点,加深对原版jquery的理解. 本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括面向对象,jquery,绑定,脚本化css等. 一. jquery的美元符意味什么? 先思考alert(typeof $)的结果中的$,它是一个对象,也是一个函数. 所以美元符字面上是jQuery,其实就是一个jq对象,里面可以接受函数,字符串(#xxx,.xxx,xxx...),还有一种是对象(比如thi…

仿照jquery封装一个自己的js库

所谓造轮子的好处就是复习知识点,加深对原版jquery的理解.本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括面向对象,jquery,绑定,脚本化css等. 一. jquery的美元符意味什么? 先思考alert(typeof $)的结果中的$,它是一个对象,也是一个函数.所以美元符字面上是jQuery,其实就是一个jq对象,里面可以接受函数,字符串(#xxx,.xxx,xxx...),还有一种是对象(比如this)…

自己动手写一个iOS 网络请求库的三部曲[转]

代码示例:https://github.com/johnlui/Swift-On-iOS/blob/master/BuildYourHTTPRequestLibrary 开源项目:Pitaya,适合大文件上传的 HTTP 请求库:https://github.com/johnlui/Pitaya 本系列文章中,我们将尝试使用 NSURLSession 技术构建一个自己的网络请求库. NSURLSession 简介 NSURLSession 是 iOS7 引入的新网络请求接口,在 WWDC2013…

如何写一个自定义的js文件

自定义一个Utils.js文件,在其中写js代码即可.如: (function(w){ function Utils(){} Utils.prototype.getChilds = function(_selector){}; Utils.prototype.getNextSibling = function(_selector){}; Utils.prototype.getPrevSibling = function(_selector){}; Utils.prototype.validate…

如何写一个自己的组件库，打成NPM包，并上传到NPM远程

1.首先使用vue create my_project 构建一个自己的Vue项目 2.vue.config.js和package.json配置如下,做了些修改 const path = require('path') module.exports = { publicPath: '/', outputDir: 'dist', devServer: { port: 9981, open: true, overlay: { warnings: fals…

isMobile 一个简单的JS库，用来检测移动设备

点这里 github地址:https://github.com/kaimallea/isMobile Example Usage I include the minified version of the script, inline, and at the top of the <head>. Cellular connections tend to suck, so it would be wasteful overhead to open another connection, just…

[WPF][Rubyer] 写一个自己的 UI 库 (二) - Icon

前言制作 WPF 的图标包,主要介绍从 iconfont 下载的图标包导入到 WPF 使用: 1. 添加文件 Ruyber 下添加自定义控件(WPF) Icon.cs.类 IconType.cs.类 IconDatas.cs Rubyer.Themes 下添加资源字典(WPF) Icon.xaml 2.下载图标 iconfont 查找自己喜欢的图标包,浏览器 F12 => Console => 输入下列代码回车,添加所有图标到购物车 var span = document.querySe…

近期写js库中遇到的一个判别的问题

最近在写一个自己的js库,正写到数组包,在里面定义了一个排序,只对纯数字数据进行排序的方法,但是在测试的时候发现一个很诡异的问题,那就是传入一个对象的时候,它没有返回erroemsg而是返回了对象,上代码: array.sort=function(a){//only for num try{ if(!a.some(function(x){return(typeof("string"))})){ var max=a.length-1; for(var j=0;j<max;j++){…

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

作者:小爝链接:https://www.zhihu.com/question/30274750/answer/118846177来源:知乎著作权归作者所有,转载请联系作者获得授权. 1,如何编写健壮的javascript代码,鲁棒性,简单总结几条我觉得是常识的事:1.1 一个javascript库最好的实现方式是占用最少的命名空间,比如window对象上或者global对象上只占用一个引用.1.2 健壮的js程序对输入都会有完善的类型检查和异常处理,边界值的判断.1.3 对js的几种继承方式要足…

从 0 到 1 到完美，写一个 js 库、node 库、前端组件库

之前讲了很多关于项目工程化.前端架构.前端构建等方面的技术,这次说说怎么写一个完美的第三方库. 1. 选择合适的规范来写代码 js 模块化的发展大致有这样一个过程 iife => commonjs/amd => es6,而在这几个规范中: iife: js 原生支持,但一般不会直接使用这种规范写代码 amd: requirejs 定义的加载规范,但随着构建工具的出现,便一般不会用这种规范写代码 commonjs: node 的模块加载规范,一般会用这种规范写 node 程序 es6: ECMA…

前端与编译原理——用JS写一个JS解释器

说起编译原理,印象往往只停留在本科时那些枯燥的课程和晦涩的概念.作为前端开发者,编译原理似乎离我们很远,对它的理解很可能仅仅局限于"抽象语法树(AST)".但这仅仅是个开头而已.编译原理的使用,甚至能让我们利用JS直接写一个能运行JS代码的解释器. 项目地址:https://github.com/jrainlau/c... 在线体验:https://codepen.io/jrainlau/p... 一.为什么要用JS写JS的解释器接触过小程序开发的同学应该知道,小程序运行的环境禁止n…

用javascript写一个emoji表情插件

概述以我们写的这个emoji插件为例,网上已经有一些相关的插件了,但你总感觉有些部分的需求不能被满足(如:可以自行添加新的表情包而不用去改源代码等等) 详细代码下载:http://www.demodashi.com/demo/10345.html 很久没有写文章了,说实话本人现在受困于五月病已经快变成一条死咸鱼了(T_T),本次就当写一个简单的js插件教程了.本项目的代码相对比较简单,至于里面有些变量命名的问题就请你们不要吐槽了Σ(ﾟдﾟlll)(好的,我承认我英语就小学水平好吧.除了hel…

当新手使用JS库遇到问题怎么办

见标题,知其意.在做网站时候,其实我们会用很多JS库,网络上流行的和公司自己封装的,这些东西都很好用,但是或多或少的有些bug或者有一些缺陷,即使真的很完善,但也可能达不到自己特定的一些需求.所以遇到问题,是很正常的.但是为什么要说是新手遇到问题呢?这就是因为,有些问题,工作几年的攻城狮,轻而易举的就解决了,所以对于他们这些根本不是问题,或者对于他们这些就是私人定制而已. 其实我也是这样走过来的,如果叫我自己完全封装一个非常强悍的JS库,我肯定是没有办法做的,不是因为技术,而是经验不够,因为考虑…

轻量级的绘制图表js库--Morris.js

Morris.js 是一个轻量级的 JS 库,使用 jQuery 和 Raphaël 来生成各种时序图. 虽说现在移动手机网络已经到了4G,但是在移动web客户端开发过中,为了达到良好的体验效果,需要考虑很多的因素,比如板式,网速等等,最近有个任务需要在移动端显示<span>标签的内容,所有找js类的开源库,最终选择Morris.js ,一个是小,另外是支持移动包括iso和android,项目地址:点击打开链接,相比其他的开源库,这个上手还是比较简单的,可以看看官方的例子,但是有一些需要注意的…

怎样写一个webpack loader

div{display:table-cell;vertical-align:middle}#crayon-theme-info .content *{float:left}#crayon-theme-info .field{font-weight:bold}#crayon-theme-info .field,#crayon-theme-info .value{margin-left:5px}#crayon-theme-info .description.value{font-style:ital…

构建自己的js库

一.背景 web前端开发人员经常会用到一些现成的js库(框架).框架的使用增加了代码的模块化和可复用性,最主要的是屏蔽了浏览器之间差异性的实现,使得代码更加简洁,框架使用者只需要将注意力放在业务的实现上而不必为底层繁琐的实现感到头疼. 目前主流的js框架有很多,各有侧重,我们通常只会用到其中一小部分子功能.如果为了局部功能而引入一个庞大的框架,显然有点大材小用而且会增加浏览器的加载负担,浪费网络带宽,影响用户体验.因此,很多时候定义我们自己的js库非常的有必要,我们只需要根据项目需求构建出个性化…

分享：计算机图形学期末作业！！利用WebGL的第三方库three.js写一个简单的网页版“我的世界小游戏”

这几天一直在忙着期末考试,所以一直没有更新我的博客,今天刚把我的期末作业完成了,心情澎湃,所以晚上不管怎么样,我也要写一篇博客纪念一下我上课都没有听,还是通过强大的度娘完成了我的作业的经历.(当然作业不是百度来的,我只是百度了一些示例代码的意思,怎么用!算了,越解释万一越黑呢!哈哈O(∩_∩)O哈哈~) ----------------------------------------------------------------分界线------------------------------…