一点拙劣的小分享,欢迎批评和补充

我们经常在Js中为我们的各类组件,构造Json格式的假数据。我们看如下代码:

var jsonResult = [
{ 'name': 'ws', 'age': '' },
{ 'name': 'td', 'age': '' } //我们把jsonResult[x]当作对象,其中的自然为属性
];
window.onload = function () {
alert(jsonResult[].name);
}

那么对象的方法如下:

var jsonResult = [
{ 'name': 'ws', 'age': '','speakFunc':function () { alert('hi,my name is ws'); } },
{ 'name': 'td', 'age': '' ,'speakFunc':function () { alert('hi my name is '+jsonResult[].name); }} //我们把jsonResult[x]当作独立个体对象
];
window.onload = function () {
jsonResult[].speakFunc();
jsonResult[].speakFunc();
}

下面给出可读性,复用性更佳的方法,包括闭包。

 var myUpStageClass = function () {
var instance = {
firstFunc: function () { //方法名可以不用引号
alert('第一个方法输出');
},
'secondFunc': function (param) {
alert(param);
}
}
return instance; //返回闭包的对象
}
var appObj = myUpStageClass(); //接受闭包的对象,是不是像实例化
window.onload = function () {
appObj.firstFunc();
appObj.secondFunc('第二个方法输出');
}

建议把我们所需要的,复用性高的JS,作为我们项目最顶层的js封装好,并且在闭包外的全局上接受闭包对象,提供给下层调用。

Js模型和封装的更多相关文章

  1. JS类的封装及实现代码

    js并不是一种面向对向的语言, 没有提供对类的支持, 因此我们不能像在传统的语言里那样 用class来定义类, 但我们可以利用js的闭包封装机制来实现js类, 我们来封装一个简的Shape类. 1. ...

  2. 【转】第7篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:全自动注册与反射方法分析

    作者: 牛A与牛C之间 时间: 2013-12-12 分类: 技术文章 | 2条评论 | 编辑文章 主页 » 技术文章 » 第7篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  3. 【转】第6篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:自动注册JS脚本+自动反射方法分析

    作者: 牛A与牛C之间 时间: 2013-11-21 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第6篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  4. 【转】第5篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:自动注册JS脚本+委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-19 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第5篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  5. 【转】第4篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:委托回调方法分析

    作者: 牛A与牛C之间 时间: 2013-11-18 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第4篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  6. 【转】3篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:官方原生方法分析

    作者: 牛A与牛C之间 时间: 2013-11-17 分类: 技术文章 | 暂无评论 | 编辑文章 主页 » 技术文章 » 第3篇:Xilium CefGlue 关于 CLR Object 与 JS ...

  7. 原生JS面向对象思想封装轮播图组件

    原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能 ...

  8. js返回顶部封装 简洁

    js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...

  9. Ajax工作原理和原生JS的ajax封装

    前言: 之所以用ajax作为博客的开篇,是因为无论从ajax的出现还是从它的作用上来说,ajax对于前端无疑是意义重大的.甚至可以说,是ajax带来了前端这个行业.当然,历史并不能说明当下,曾经的辉煌 ...

随机推荐

  1. Node.js刷新session过期时间

    在Node.js中,我们通常使用express-session这个包来使用和管理session,保存服务端和客户端浏览器之间的会话状态.那如何才能实现当用户刷新当前页面或者点击页面上的按钮时重新刷新s ...

  2. WINFrom Excal 数据导入数据库

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  3. How to install java and eclipse on linux

    First of all, download from the website of java. I download 'jdk-8u102-linux-i586.tar.gz' unzip it t ...

  4. [Spring框架]Spring AOP基础入门总结一.

    前言:前面已经有两篇文章讲了Spring IOC/DI 以及 使用xml和注解两种方法开发的案例, 下面就来梳理一下Spring的另一核心AOP. 一, 什么是AOP 在软件业,AOP为Aspect ...

  5. XML学习笔记2——DTD

    在上一篇笔记中,将文档类型分类时,曾经根据文档是否使用并遵守了DTD或Schema来区分为格式良好的XML和有效的XML,那么什么是DTD和Schema呢?DTD和Schema都是用来规范XML文档的 ...

  6. Netty学习五:Buffers

    1. Netty中的缓冲 在Netty中并没有使用Java自带的ByteBuffer,而是自己实现提供了一个缓存区来用于标识一个字节序列,并帮助用户操作原始字节或者自定义的POJO. Java NIO ...

  7. ASP.NET MVC在线人数统计

    在Global.asax.cs文件中代码: protected void Application_Start() { Application[; AreaRegistration.RegisterAl ...

  8. 深入理解javascript函数系列第三篇——属性和方法

    × 目录 [1]属性 [2]方法 前面的话 函数是javascript中的特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本 ...

  9. 【目录】C#搭建足球赛事资料库与预测平台与彩票数据分析目录

    本博客所有文章分类的总目录链接:本博客博文总目录-实时更新 1.彩票数据分析与预测 6.智彩足球技术研究团队成员介绍 5.关于组建“智彩足球技术研究团队”的说明 4.为什么选择玩足球彩票以及玩彩票的心 ...

  10. 本机搭建zookeeper集群

    3个 clientPort分别设置为2181,2182,2083 server.1=127.0.0.1:2888:3888 server.2=127.0.0.2:2889:3889 server.3= ...