- 浏览: 124332 次
- 性别:
- 来自: 杭州
文章分类
最新评论
-
AlexBlume:
...
js中“使用”el表达式 -
xiaoyuer9953:
这两天正需要这个,很好!
json-lib-2.4-jdk15.jar 组装json字符串 -
liuyue513:
...
MyEclipse下debug调试 -
Fs_sky:
谢了,太厉害了!
Object... values的用法 -
ooo456mmm:
goood
MyEclipse下debug调试
一、通过闭包,执行匿名函数,返回一个对象
二、直接调用函数,返回一个对象
三、定义对象的“类”:原型,然后使用new操作符来批量的构筑新的对象
对new操作符进行讲解
由于带返回值的构造函数会产生奇怪的结果,因此一般最好不要在构造函数中return sth;(空return可以)
这里有说明:http://stackoverflow.com/questions/1978049/what-values-can-a-constructor-return-to-avoid-returning-this
参考:http://abruzzi.iteye.com/博客中的“javascript内核系列”
//例1 var Test = function(){ var a = 1; //在这里定义的变量,比如a、b、c、d,在整个Test下都可以访问到 var b = 10; var c; function hhh(){ a = 2; b = 20; //对于a、b、c等变量的处理... } return{ a:a,//只能获取a刚定义时的值1,而不能获取程序在运行中实时a的值,不要使用这种写法 getB:function(){ return b;//可以获取程序在运行中b实时的值20;(正确的写法) } } }();//()是执行函数的运算符(此处是执行一个匿名函数,然后返回一个对象) Test是一个对象,可以为对象添加属性:Test.d = 30; 此时,在外界就可以通过Test.d获取值。 //例2 var person = function(){ var name = "default";//变量作用域为函数内部,外部无法访问 return { getName : function(){ return name; }, setName : function(newName){ name = newName; } } }(); alert(person.name); //直接访问,结果为undefined alert(person.getName()); //default person.setName("gerry"); alert(person.getName()); //gerry
二、直接调用函数,返回一个对象
//例1 function Point(left, top){ this.left = left;//注意:此处的this是指向window对象的,this===window为true!先把值存储在window对象的一个属性中,再取出来 this.top = top; //handle the left and top... return {x: this.left, y:this.top}; } 直接动态的构建一个新的匿名对象返回即可: var pos = Point(3, 4); //pos.x = 3; pos.y = 4; //例2 function Person(){ var name = "default"; return { getName : function(){ return name; }, setName : function(newName){ name = newName; } } }; var john = Person(); alert(john.getName()); //打印default john.setName("john"); alert(john.getName()); //打印john alert(john.constructor) //john只是普通的对象,输出function Object(){[native code]} var jack = Person(); alert(jack.getName()); //打印default jack.setName("jack"); alert(jack.getName()); //打印jack 由此代码可知,john和jack都可以称为是Person这个类的实例,因为这两个实例对name这个成员的访问是独立的,互不影响
三、定义对象的“类”:原型,然后使用new操作符来批量的构筑新的对象
//定义一个"类",Address function Address(street, xno){ this.street = street || 'Shanghai Road'; this.xno = xno || 135; this.toString = function(){ return "street : " + this.street + ", No : " + this.xno; } } //定义另一个"类",Person function Person (name, age, addr) { this.name = name || 'unknown'; this.age = age; this.addr = addr || new Address(null, null); this.getName = function(){return this.name;} this.getAge = function(){return this.age;} this.getAddr = function(){return this.addr.toString();} } //通过new操作符来创建两个对象,注意,这两个对象是相互独立的 var jack = new Person('jack', 26, new Address('Qing Hai Road', 123)); var gerry = new Person('gerry', 25); //查看结果 alert(jack.getName()); //打印jack alert(jack.getAge()); //打印26 alert(jack.getAddr()); //打印street : Qing Hai Road, No : 123 alert(gerry.getName()); //打印gerry alert(gerry.getAge()); //打印25 alert(gerry.getAddr()); //打印street : Shanghai Road, No : 135
对new操作符进行讲解
我们来看一个例子: function Shape(type){ this .type = type || "rect" ; this .calc = function (){ return "calc, " + this .type; } } var triangle = new Shape("triangle"); alert(triangle.calc()); //打印 calc, triangle alert(triangle.constructor==Shape);//true alert(triangle.prototype); //undefined var circle = new Shape("circle"); alert(circle.calc()); //打印 calc, circle 在javascript中,通过new操作符来作用与一个函数,实质上会发生这样的动作: 首先,创建一个空对象,然后用函数的apply方法,将这个空对象传入作为apply的第一个参数,及上下文参数。这样函数内部的this将会被这个空的对象所替代: var triangle = new Shape("triangle"); //上一句做了以下两行代码的工作: var triangle = {}; Shape.apply(triangle, ["triangle"]); 当我们使用new操作符时,javascript会: 1、生成一个空对象{} 2、执行构造函数(实际上就是普通函数),将函数中的this用刚生成的空对象代替,相当于给刚生成的空对象添加属性及值,完成成员设置等初始化工作。即:生成的对象被new后面的方法(函数)的this关键字引用!然后在方法中通过操作this,就给这个新创建的对象相应的赋予了属性.然后返回这个经过处理的对象. 3、初始化对象(实际上现在已经有了属性,是构造函数赋予的)的constructor属性,让他的值为构造函数(函数也是对象)。所以创建对象的时候没有初始化prototype,而是初始化了constructor,指向构造函数。 这样上面的例子就很清楚:先创建一个空对象,然后调用Shape方法对其进行赋值,返回该对象,最后再初始化对象的constructor属性,这样我们就得到了一个triangle对象. 对象建立之后,对象上的任何访问和操作都只与对象自身及其原型链上的那串对象有关,与构造函数再扯不上关系了。换句话说,构造函数只是在创建对象时起到介绍原型对象和初始化对象两个作用。 例如: var p = new Person(); 此时,p会含有一个constructor属性,指向它的构造函数Person p.constructor==Person p.constructor.prototype.age //p.constructor.prototype即是 构造函数的prototype属性对应的prototype对象
由于带返回值的构造函数会产生奇怪的结果,因此一般最好不要在构造函数中return sth;(空return可以)
这里有说明:http://stackoverflow.com/questions/1978049/what-values-can-a-constructor-return-to-avoid-returning-this
参考:http://abruzzi.iteye.com/博客中的“javascript内核系列”
发表评论
-
My97日历控件 常用范例
2012-04-24 15:17 1153官方文档: http://www.mysuc.com/test ... -
js事件
2012-03-31 15:52 2256先说下js事件中几个重要的概念:事件对象、目标元素(事件源)、 ... -
frames["frameName"]用法bug?
2012-03-13 16:02 1182闲话少说,直接上代码 ... -
hasOwnProperty实现剔除数组中重复项
2012-03-02 16:41 2410hasOwnProperty是用来判断一个对象是否有你给出名称 ... -
js数组排序
2012-03-02 16:22 1412js的数组中有一个sort()方法,默认是按照ASCII字符顺 ... -
函数的参数arguments、当前上下文this、call apply
2010-09-16 13:52 1196函数的参数arguments js中 ... -
html中js代码的加载顺序
2010-09-02 12:31 3421搜索:非阻塞JavaScript 对于一个html页面,he ... -
js变量作用域
2010-08-19 08:41 1137JavaScript的函数是在局部 ... -
javascript中数据类型
2010-08-01 17:16 1871var str = "Hello, world&qu ... -
JavaScript条件表达式的布尔判断
2010-07-31 15:57 7710在JavaScript中,对于单独 ... -
setTimeout和setInterval的使用
2010-07-17 14:40 890window对象有两个主要的定时方法,分别是setTimeou ... -
更改地址栏前小图标、按下回车键事件、关闭窗口
2010-07-16 19:04 2506<!-- 地址栏前添加自 ... -
javascript中数组、对象
2010-06-11 15:34 1346javascript数组操作大全: ... -
正则表达式
2010-06-11 10:10 880var patten1 = /^\d+(\.\d{1,6})? ... -
不使用第三个变量完成两个整数的交换
2010-04-20 09:32 814public class Person { ... -
js点滴
2010-02-02 11:39 968onchange 事件会在域的内容改变时发生。支持该事件的HT ... -
javascript操作cookie 以及 html国际化
2010-02-02 11:36 1766下面是cookie操作的工具类: var CookieUtil ... -
js获得本周,本月,本季度的开始日期和结束日期 & 给定日期,获得是当年的第几周
2010-01-24 13:14 1315js获得本周,本月,本季度的开始日期和结束日期 <scr ... -
javaScript DOM方法与属性摘要
2009-12-18 18:56 755createDocumentFragment() 创建一个文 ...
相关推荐
建造者模式的封装性比较好,创建对象和构建过程解耦; 建造者模式很容易扩展,当我们需要扩展的时候,通过一个新的建造者就可以实现; 模式作用: 分步创建一个复杂的对象 解耦封装过程和具体创建组件 无需...
Node.js是基于Chrome JavaScript运行时建立的一个平台,实际上它是对Google Chrome V8引擎进行了封装,它主要用于创建快速的、可扩展的网络应用。Node.js采用事件驱动和非阻塞I/O模型,使其变得轻微和高效,非常适合...
Telegram bot的引导程序,具有可直接部署的示例bot和JS封装的API方法。 您可以直接使用Telegram API中可用的所有方法,并发送任何受支持的媒体(我们将formData序列化以供您通过HTTP发送)。 请参阅该项目的完整。...
第9章 构建对象 143 9.1 组合关系 143 9.2 分阶段构建 144 9.3 不同类型的组合 146 9.3.1 聚集 146 9.3.2 关联 146 9.3.3 结合使用关联和聚集 148 9.4 避免依赖性 148 9.5 基数 149 9.5.1 多个对象关联 151...
基于three.js构建的3D库。 Scorpion使得仅使用一行代码即可轻松设置场景,相机和对象。 例如,整个场景仅使用4行代码创建。 使用vanilla three.js,这将花费超过20行代码: 有关有用的信息和文档,请确保检查Wiki...
它基于面向对象编程 ,所以这就是我使用在这个 repo 中构建书籍列表的原因,它们就像创建对象的模板一样,由函数在每个函数中动态添加功能启动。本项目中的功能用户可以在图书列表中按字母顺序搜索,图书总价将自动...
7.5 JavaScript的内置对象 7.5.1 Math对象 7.5.2 Date对象--创建一个简单的日历 7.5.3 Error对象 7.5.4 其他内置对象 7.5.5 特殊的对象--全局对象与调用对象 7.6 总结 第8章 集合 ...
这个库提供了各种特性,如摄影机、光影、材质等对象,用于构建三维场景。Three.js通过封装WebGL的API,简化了3D图形编程的复杂性,使得即使没有丰富经验的开发者也能轻松使用。 二、three.js的用途 three.js可以...
学习使用Node.js在JavaScript中构建可扩展的服务器应用程序 以三种编程语言生成实例:Python,JavaScript和C# 结合使用访问修饰符,前缀,属性,字段,属性和局部变量来封装和隐藏数据 掌握DOM操作,跨浏览器策略...
JavaScript 是近年来非常受瞩目的一门编程语言,它既支持面向对象编程,也支持函数式编程。本书专门介绍JavaScript函数式编程的特性。 全书共9章,分别介绍了JavaScript函数式编程、一等函数与Applicative编程、变量...
然后我们还会通过 less 或者 sass 来把CSS文件也拆成一个个小的模块来写,甚至我们在CSS代码中感受到了 封装,继承,多态 等面向对象的特性。 然而,在 webpack 出来之前,我们所谓的模块化根本不能算作模块化。为...
multer-aliyun-oss 阿里云对象存储OSS上传图片 前台前端 技术栈:Vue.js Vue.cli Vue脚手架,Vue的构建工具 SCSS 工具类样式对css进行开发 router 路由管理器,对路由进行管理 CategoryCard BookCard 自封装分类与...
该插件允许将Views定义为一个类,从而提供了一个强大的面向对象的工厂界面,可以使用可配置对象动态构建应用程序的UI。 该插件的主要功能包括: 面向对象的设计:每个UI元素都作为一个对象进行定义和操作,通过将...
Config是一个js文件,默认情况下会导出Javascript对象,它指定了许多其他配置。 默认路径为<project>/config/kaon.config.js 。 但是您可以将其放入项目的任何地方。 不需要配置文件,Kaon将使用默认配置,如下所示...
Encapsule Project Object Namespace Manager (onm) 库是一个数据模型驱动的 JavaScript 数据对象/JSON 工厂和内存子系统通信总线,用于基于模型在 JavaScript 中构建复杂的数据驱动 Node.js/HTML 5 客户端应用程序-...
QML是一种声明性语言,结合JavaScript,用于快速创建流畅、动态的用户界面。它与Qt Quick框架紧密集成,特别适合开发现代化、触屏友好的应用。 Qt Quick Controls和Qt Quick Dialogs提供了一系列预定义的QML组件,...
Motion是一个框架,用于在Amber应用程序中使用可重用,可测试和封装的纯Crystal来构建React性,实时的前端UI组件。 为简便起见,我们将它们称为MotionComponents。 运动是一个面向对象的视图层 与您现有的前端和平...
利用window对象提供的以上方法,我们做一下简单的封装,能很好地解决以上两点问题 插件已构建上传npm,地址:https://www.npmjs.com/package/@saryz/portal-bridge 可以下载源码维护自己的微前端架构桥梁,源码为该...
JavaScript将函数式编程带入了主流,并提供了一种无需类和原型即可进行面向对象编程的新方法。 以功能风格进行编程意味着使用诸如一等函数,闭包,高阶函数,部分应用程序,currying,不变性或纯函数之类的概念。 ...