0

0

brook javascript框架介绍_js面向对象

php中文网

php中文网

发布时间:2016-05-16 18:01:05

|

1353人浏览过

|

来源于php中文网

原创

brook引用了UNIX下的pipe概念,轻松把所有的处理都串联起来以共同完成任务。前一个处理的输出作为后一个处理的输入来完成参数的传递。通过brook你可以以MVC的方式来写你的javascript程序。
http://hirokidaichi.github.com/brook/ brook 本站下载
brook框架使用namespace库用于模块的组织。
这里再次用例子说明一下namespace的使用方法:

SCA介绍及应用实例 中文WORD版
SCA介绍及应用实例 中文WORD版

本文档主要讲述的是SCA介绍及应用实例;SCA(Service Component Architecture)是针对SOA提出的一套服务体系构建框架协议,内部既融合了IOC的思想,同时又把面向对象的复用由代码复用上升到了业务模块组件复用,同时将服务接口,实现,部署,调用完全分离,通过配置的形式灵活的组装,绑定。希望本文档会给有需要的朋友带来帮助;感兴趣的朋友可以过来看看

下载
复制代码 代码如下:

// 定义一个sample命名空间
Namespace('sample')
// 使用brook
.use('brook *')
.use('brook.util *')
.define( function (ns) {
var foo = function() {
alert('this is sample.foo');
};
// 定义对外公开的函数
// 外部模块只要use了sample之后,就可以通过ns.sample.foo()来调用
ns.provide({
foo : foo
});
});
// 使用的例子
Namespace.use('sample').apply(function(ns) {
ns.sample.foo();
});


要想理解brook框架,需要理解brook的几个核心概念。
promise
简单来说,promise就是封装过的函数,它就是负责把值传给下一个promise。就好比接力赛时候,把接力棒(value)传给下一个成员(promise)。这样就可以可以让非同步的处理能够按照类似同步处理的顺序来编程。
复制代码 代码如下:

var p = ns.promise(function(next, value){
// 在这里对value进行处理
// value是之前的promise传递进来的
// 把工作移交给下一个promise
next("new_value");
});

那我们来看看promise能做什么。比如有这样的要求
:等一秒
:输出moge
:等两秒
:输出muga

不用promise的时候:
复制代码 代码如下:

(function() {
var firstInterval = setInterval(function() {
console.log("moge");
clearInterval(firstInterval);
var secondInterval = setInterval(function() {
console.log("muga");
clearInterval(secondInterval);
}, 2000);
}, 1000);
})();

这样的代码处理顺序不好理解。如果改用promise的话:
复制代码 代码如下:

Namespace("sample")
.use("brook *")
.use("brook.util *")
.define(function(ns) {
var p1 = ns.promise(function(next, value) {
console.log("moge");
next("muga");
});
var p2 = ns.promise(function(next, value) {
console.log(value);
next();
});
ns.provide({
execute: function() {
ns.wait(1000).bind(p1).bind(ns.wait(2000)).bind(p2).run();
}
});
});
Namespace.use("sample").apply(function(ns) {
ns.sample.execute();
});

其中bind函数可以接受多个参数,也可以写成这样:
ns.wait(1000).bind(p1, ns.wait(1000), p2).run();
promise的使用方法:
1:等待几秒可以使用brook.util下的wait方法
2:promise之间“棒的交接”是通过bind方法实现的,也就是UNIX下的PIPE功能。
3:最后需要执行run()方法
channel
channel顾名思义就是频道,管道的意思。在brook里它表示promise的集合。可以把多个promise存放到一个channel里,然后一起执行。
复制代码 代码如下:

var p3 = ns.promise(function(next, value) {
console.log(value + "!");
});
var p4 = ns.promise(function(next, value) {
console.log(value + "!!");
});
ns.provide({
execute: function() {
var channel = ns.channel("testChannel");
channel.observe(p3);
channel.observe(p4);
ns.sendChannel("testChannel").run("hello");
}
});

channel的使用方法:
1:observer:把promise追加到channel中
2:sendChannel:确定channel
3:最后通过run来执行channel里所有promise
model
model是对channel进行包装而成的。在model里可以定义带有名字的channel,这些channel都是一个个的method。
这个组件可以明确MVC中的M和V,即模块和视图。它可以写出这样的处理,model的method执行之后,它的结果传到一个或者多个view(promise)。这就是观察者模式。
复制代码 代码如下:

var requestFilter = ns.promise(function(v){
v["viewer_id"] = viewer.getID();
retrun v;
});
var create = ns.promise(function(n,v){
// get data
n(response);
});
var delete = ns.promise(function(n,v){
// get data
n(response);
});
var view1 = ns.promise(function(n,v){
// render html
n(v);
});
var view2 = ns.promise(function(n,v){
// render html
n(v);
});
var model = ns.createModel();
model.addMethod('create', ns.mapper(requestFilter).bind(create));
model.addMethod('delete', ns.mapper(requestFilter).bind(delete));
ns.from(model.method('create')).bind(view1).run();
ns.from(model.method('create')).bind(view2).run();
ns.promise().bind(model.notify('create').run({"body": "test"}));
//向view1和view2传递参数{"body": "test"}

model的使用方法:
:ns.createModel():生成model
:model.addMethod():定义method名和相应的处理promise
:ns.from():定义model的某个method执行完之后的处理
:model.notify():执行model的method
widget
widget负责把html和命名空间的模块关联起来。看一个简单的例子。
首先定义一个sample.widget的namespace。
复制代码 代码如下:

// sample-widget.js
Namespace("sample.widget")
.use("brook.widget *")
.define(function(ns) {
ns.provide({
registerElement: function(element) {
element.innerHTML = "Hello World!";
}
});
});

下面就是关于sample.widget的html页面。
复制代码 代码如下:



widget sample





widget


hoge

foo

bar





这段代码会把data-widget-namespace指定为sample.widget的div内容全部置换成hello world!
run()和subscribe()的区别
promise执行的时候需要使用run()方法。一个promise链处理完之后需要执行回调函数的时候不使用run,使用subscribe。
复制代码 代码如下:

ns.promise().bind(function(next, value) {
next(value);
}).subscribe(function(value) {
console.log(value, "world!");
}, "hello");
//hello world!
ns.promise().bind(function(next, value) {
console.log(value);
next("no next");
}).run("hello");
//hello

brook.util
这个模块里面定义很多有用的方法。
mapper:定义装饰处理
复制代码 代码如下:

var input = ns.promise(function(next, value) {
next("this is input");
});
var mapper = ns.mapper(function(value) {
return value + "!";
});
var output = ns.promise(function(next, value) {
console.log(value);
next(value);
});
//执行
input.bind(mapper).bind(output).run();
//this is input!

filter:过滤器
复制代码 代码如下:

var input = ns.promise(function(next, value) {
next(2);
});
var evenFilter = ns.filter(function(value) {
return (value % 2) === 0;
});
var output = ns.promise(function(next, value) {
console.log(value + " is even");
next(value);
});
//执行
input.bind(evenFilter).bind(output).run();
//2 is even

scatter:分散器,value里面的值依次调用下一个promise
复制代码 代码如下:

var output = ns.promise(function(next, value) {
console.log(value);
next(value);
});
//执行
ns.scatter().bind(output).run([1, 2, 3, 4, 5, 6]);
//1
//2
//3
//4
//5
//6

takeBy:从value里面一次取n个调用下一个promise
复制代码 代码如下:

var output = ns.promise(function(next, value) {
console.log(value);
next(value);
});
//実行
ns.scatter().bind(ns.takeBy(2)).bind(output).run([1, 2, 3, 4, 5, 6]);
//[1, 2]
//[3, 4]
//[5, 6]

wait:等待n毫秒
cond:有条件执行promise,第一个参数是过滤器,第二个参数是promise。第一个参数为true的时候执行第二个参数的promise。
复制代码 代码如下:

var output = ns.promise(function(next, value) {
console.log(value);
next(value);
});
var isEven = function(num) {
return (num % 2 === 0);
};
var done = ns.promise(function(next, value) {
console.log("done");
});
//実行
ns.cond(isEven, output).bind(done).run(2);
//2
//done
ns.cond(isEven, output).bind(done).run(3);
//done

match:根据value的值来决定执行哪一个promise。
复制代码 代码如下:

var dispatchTable = {
"__default__": ns.promise(function(next, value) {
console.log("default");
}),
"hello": ns.promise(function(next, value) {
console.log("hello");
}),
"world": ns.promise(function(next, value) {
console.log("world");
})
};
ns.match(dispatchTable).run("hello");
ns.match(dispatchTable).run("world");
ns.match(dispatchTable).run("hoge");

from:为promise链传递初始参数,也可以用run来传递。
复制代码 代码如下:

ns.from("hello").bind(ns.debug()).run();
//debug: hello

最后还可以通过github首页的例子来体会,brook是怎么实现MVC模式的。
java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

8

2026.01.30

c++ 字符串格式化
c++ 字符串格式化

本专题整合了c++字符串格式化用法、输出技巧、实践等等内容,阅读专题下面的文章了解更多详细内容。

8

2026.01.30

java 字符串格式化
java 字符串格式化

本专题整合了java如何进行字符串格式化相关教程、使用解析、方法详解等等内容。阅读专题下面的文章了解更多详细教程。

6

2026.01.30

python 字符串格式化
python 字符串格式化

本专题整合了python字符串格式化教程、实践、方法、进阶等等相关内容,阅读专题下面的文章了解更多详细操作。

1

2026.01.30

java入门学习合集
java入门学习合集

本专题整合了java入门学习指南、初学者项目实战、入门到精通等等内容,阅读专题下面的文章了解更多详细学习方法。

20

2026.01.29

java配置环境变量教程合集
java配置环境变量教程合集

本专题整合了java配置环境变量设置、步骤、安装jdk、避免冲突等等相关内容,阅读专题下面的文章了解更多详细操作。

17

2026.01.29

java成品学习网站推荐大全
java成品学习网站推荐大全

本专题整合了java成品网站、在线成品网站源码、源码入口等等相关内容,阅读专题下面的文章了解更多详细推荐内容。

18

2026.01.29

Java字符串处理使用教程合集
Java字符串处理使用教程合集

本专题整合了Java字符串截取、处理、使用、实战等等教程内容,阅读专题下面的文章了解详细操作教程。

3

2026.01.29

Java空对象相关教程合集
Java空对象相关教程合集

本专题整合了Java空对象相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号