ECMAScript 创建自己的js类库

ECMAScript中最有意思,最强大的地方在于函数。最进在完善自己的js类库的时候发现我们经常在用函数,但真的很少有人懂得ECMAScript函数功能。
1:什么是函数?
  ECMAScript函数其实就是对象,每个函数都是Function类型的实例而且有属性和方法,由于函数是对象,函数名其实就是指向函数对象的指针,不会与某个函数绑定。
2:创建函数的方法


代码如下:

(1):function Person(name)
   {
    return name;
   }
(2):var Person=function(name)
  {
  return name;
  }
(3):var Person=new function(“name”,”return name”);(不推荐使用,ECMAScript会解析两次所以不推荐使用)

3:函数声明和函数表达式的不同
  ECMAScript对函数声明和函数表达式的解析并非一视同仁,解析器会先读取函数声明,并使其在任何代码前都可用。
  例:


代码如下:

assert(false);
function assert(value, msg) {
if (!value) {
alert (msg || (value + " does not equal true"));
}
}

 
函数表达式为执行到这一行才解析器才会解析


代码如下:

如:assert(false);
var assert= function (value, msg) {
if (!value) {
alert (msg || (value + " does not equal true"));
}
}

 
4:理解this属性
this 属性是我们经常用的属性,其行为与Java,C#,PHP大致类似。


代码如下:

如:window.name='用未来思考现在';
window.name = "用未思考现在;
showName();
function showName() {
alert(this.name);
}

 
5:创建自己的类库插件
简单的介绍了下函数,对于理解函数这些内容远远不够,例如构造函数模式,原形模式,原形链等等都是要花很多时间去理解。
创建类


代码如下:

var Class = function () {
var extclass = function () {
//接收属性传过来的参数
this.init.apply(this, arguments);
}
//给类添加自定义属性
extclass.prototype.init = function () { };
//给prototypr定义别名?
extclass.fn = extclass.prototype;
//定义类的别名?
extclass.fn.parent = extclass;
//给类添加属性
extclass.extend = function (obj) {
var extended = obj.extended;
for (var i in obj) {
extclass.fn[i] = obj[i];
}
if (extended) extended(extclass);
};
//给实例添加属性
extclass.include = function (obj) {
var included = obj.included;
for (var i in obj) {
extclass.fn[i] = obj[i];
}
if (included) included(extclass);
}
return extclass;
}

类库大致的框架构建完成,这样我们创建类可以调用extended方法,创建实例可以调用include方法。下一章节会在此基础上扩展更多功能,基于原型给“类”添加继承。

时间: 2012-11-19

ECMAScript6块级作用域及新变量声明(let)

很多语言中都有块级作用域,但JS没有,它使用var声明变量,以function来划分作用域,大括号"{}" 却限定不了var的作用域.用var声明的变量具有变量提升(declaration hoisting)的效果. ES6里增加了一个let,可以在{}, if, for里声明.用法同var,但作用域限定在块级,let声明的变量不存在变量提升. 示例1: 块级作用域 if function getVal(boo) { if (boo) { var val = 'red' // ...

正则表达式字面量在ECMAScript5中的变化

在<JavaScript语言精粹>的第72页有这样一段: 用正则表达式字面量创建的RegExp对象来共享同一个单实例: 复制代码 代码如下: function make_a_matcher( ) { return /a/gi; } var x = make_a_matcher( ); var y = make_a_matcher( ); // 注意:x 和 y 是同一个对象! x.lastIndex = 10; document.writeln(y.lastIndex); // 10当你在浏览

在NodeJS中启用ECMAScript 6小结(windos以及Linux)

在NodeJS中启用ES6 (harmony) 版本: 开始吧, Linux下启用 来源: http://h3manth.com/new/blog/2013/es6-on-nodejs/ Node version : v0.11.6 先来看一看版本 harm ;) : $ node --v8-options | grep harm --harmony_typeof (enable harmony semantics for typeof) --harmony_scoping (enable ha

JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性

接下来应该是BOM和HTML5了,但是鉴于ECMAScript5相对于ECMAScript3的新变化比较多,而且这些变化也非常的有意思,因此在这篇文章中再将我认为的有意思的变化(并非全部变化)集中整理一下,但这里只是列举,不具体展开. 一.语法变化 1.关键字和保留字 在ES3中,使用关键字做标识符会导致"Identifier Expected "错误,而使用保留字做标识符可能会也可能不会导致相同的错误,具体取决于特定的引擎.在ES5中,关键字和保留字虽然不能作为标识符 使用,但可以作

ECMAScript6的新特性箭头函数(Arrow Function)详细介绍

箭头函数是ECMAScript 6最受关注的更新内容之一.它引入了一种用「箭头」(=>)来定义函数的新语法,它-它碉堡了~.箭头函数与传统的JavaScript函数主要区别在于以下几点:1.对 this 的关联.函数内置 this 的值,取决于箭头函数在哪儿定义,而非箭头函数执行的上下文环境.2.new 不可用.箭头函数不能使用 new 关键字来实例化对象,不然会报错.3.this 不可变.函数内置 this 不可变,在函数体内整个执行环境中为常量.4.没有arguments对象.更不能通过ar

ECMAScript6变量的解构赋值实例详解

数组的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring) var [a, b, c] = [1, 2, 3]; 这种写法属于"模式匹配",只要等号两边的模式相同,左边的变量就会被赋予对应的值. 下面是一些使用嵌套数组进行解构的例子 let [foo, [[bar], baz]] = [1, [[2], 3]]; foo // 1 bar // 2 baz // 3 let [ , , third] = ["foo

ES6解构赋值实例详解

本文实例讲述了ES6解构赋值.分享给大家供大家参考,具体如下: 基本用法 let [x, y, ...z] = ['a'] //"a", undefined, [] 1.等号右边如果不是数组,将会报错(不是可遍历结构) 2.解构赋值 var, let, const命令声明均适用 3.set结构也可解构赋值(具有Iterator接口,可采用数组形式结构赋值) set解构:任何类型的单个值的集合 let [x, y, z] = new Set(["a", "b

ES6的解构赋值实例详解

1 什么是解构赋值 解构赋值允许你使用类似数组或对象字面量的语法将数组和对象的属性赋给各种变量.这种赋值语法极度简洁,同时还比传统的属性访问方法更为清晰.解构会仅提取出一个大对象中的部分成员来单独使用. 如下是传统的: var y=data[0] var m=data[1] var d=data[2] 但在ES6中可以简写为: var [y,m,d]=date; 2 数组与对象的解构 数组解构赋值语法的一般形式为:  [ variable1, variable2, ..., variableN

python 实现tar文件压缩解压的实例详解

python 实现tar文件压缩解压的实例详解 压缩文件: import tarfile import os def tar(fname): t = tarfile.open(fname + ".tar.gz", "w:gz") for root, dir, files in os.walk(fname): print root, dir, files for file in files: fullpath = os.path.join(root, file) t.

ZIP4j 压缩与解压的实例详解

ZIP4j 压缩与解压的实例详解 使用的jar包:zip4j_1.3.2.jar 基本功能: 针对ZIP压缩文件创建.添加.分卷.更新和移除文件 (读写有密码保护的Zip文件) (支持AES 128/256算法加密) (支持标准Zip算法加密) (支持zip64格式) (支持Store(仅打包,默认不压缩,不过可以手动设置大小)和Deflate压缩方法 (针对分块zip文件创建和抽出文件) (支持编码) (进度监控) 压缩方式(3种): static final int COMP_STORE =

ES6新特性四:变量的解构赋值实例

本文实例讲述了ES6新特性之变量的解构赋值.分享给大家供大家参考,具体如下: 1. 数组的解构赋值 //① 可以从数组中提取值,按照对应位置,对变量赋值 var [a, b] = [1, 2]; //a = 1;b = 2 //② 下面是一些使用嵌套数组进行解构 var [d, [[c], f]] = [1, [[2], 3]]; var [,,third] = ["foo", "bar", "baz"];//third = "baz&

JavaScript对象引用与赋值实例详解

本文实例讲述了JavaScript对象引用与赋值.分享给大家供大家参考,具体如下: <script type="text/javascript"> //例子一: 引用 var myArrayRef = new Array(0,1,2); //创建数组对象 var mySeconArrayRef = myArrayRef; // 对象复制. myArrayRef[0] = 100; // 修改元素值 alert(mySeconArrayRef[0]); /** * 输出 10

jQuery对html元素的取值与赋值实例详解

本文实例讲述了jQuery对html元素的取值与赋值方法.分享给大家供大家参考,具体如下: Jquery给基本控件的取值.赋值 TEXTBOX: var str = $('#txt').val(); $('#txt').val("Set Lbl Value"); //文本框,文本区域: $("#text_id").attr("value",'');//清空内容 $("#text_id").attr("value&qu

ES6中let、const的区别及变量的解构赋值操作方法实例分析

本文实例讲述了ES6中let.const的区别及变量的解构赋值操作方法.分享给大家供大家参考,具体如下: 声明:本文内容依照阮一峰老师ECMAScript 6 入门一书所总结. let和const 相同点 都存在块级作用域 都不存在变量声明提升 都会造成"暂时性死区" 在一个作用域下不可重复声明 不同点 const一旦声明必须立即赋值 const声明的变量指向的内存地址不得改动. 变量解构赋值 数组的解构赋值 解构成功 let [a, b, c] = [1, 2, 3]; 解构不成功

详解ES6 export default 和 import语句中的解构赋值

解构赋值 有如下 config 对象 const config = { host: 'localhost', port: 80 } 要获取其中的 host 属性 let { host } = config 拆分成模块 以上两段代码,放到同一个文件当中不会有什么问题,但在一个项目中,config 对象多处会用到,现在把 config 对象放到 config.js 文件当中. // config.js export default { host: 'localhost', port: 80 } 在