Javascript
关注
分享
扫一扫
文章平均质量分 68
xiayuanfeng
这个作者很懒，什么都没留下…
展开
-
Javascript 基本数据类型，数组，循环以及条件-变量
在深入javascript面向对象特性之前，让我们温习下基础知识。这一章能带你学会如下知识点：Javascript的基本类型，比如字符串和数字类型。数组基本的运算符，如+,-,delete,typeof控制语句，比如循环和条件。变量变量用来存储数据。当编写程序的时候，可以非常方便的使用变量去代替实际的数据。比如，当你在程序中过多的使用3.1415926的时候，你可以...2009-10-12 21:39:30 · 135 阅读 · 0 评论 -
Javascript 继承 (一)
关于继承前言到这里如果看完函数-》对象-》Prototype，已经能应用Javascript了。但是想用面向对象的思想来编程，还差一点，那就是继承。 Prototype Chaining让我们用默认的方法来实现继承。前面的教程我们知道了每个函数都有prototype属性，当函数被new操作符调用，一个对象就被创建了并且这个对象关联到了prototype对象。是怎样关联的？其实是通过_p...2008-12-31 15:32:43 · 93 阅读 · 0 评论 -
Javascript 继承 (二)
仅仅继承Prototype添加可以重用的方法和属性到prototype是非常有效率的。如果都这么做的话，为什么不仅仅继承prototype呢。也就是说我们继承prototype比继承new出来的对象要好的多。毕竟这个new的对象包含的代码并不是我们想复用的。这样继承的优点如下，不用仅仅为了继承而创建一个对象。缩短了查找方法的时间。更新后的集成代码如下：function Shape(){}...2009-01-05 23:04:26 · 93 阅读 · 0 评论 -
Javascript 继承 (三)
从子对象中访问父对象。经典的面向对象语言都有语法可以在子类中访问父类，其实就是可以直接调用父类的引用。有的时候，我们在子类写一个方法，需要用到父类的方法时候，这个特性就格外有用了。在许多应用中，子类创建一个和父类相同的方法，并且在这个方法中调用父类的方法。在Javascript中并没有这个这种语法。但是很容易就能完成这个功能，让我们看如下的代码。function Shape(){}Shape...2009-01-06 00:33:31 · 71 阅读 · 0 评论 -
Javascript 继承 (四)
封装继承通过上面的学习，我们把继承封装，这样就可复用了。代码如下function extend(Child, Parent) { var F = function(){}; F.prototype = Parent.prototype; Child.prototype = new F(); Child.prototype.constructor = Child; ...2009-01-12 23:04:22 · 119 阅读 · 0 评论 -
Javascript 继承 (五)
要注意复制引用。很烦的是，在复制引用的时候，有的时候并不是期望的结果。让我们创建两个构造函数，给prototype添加属性var A = function(){},B=function(){};A.prototype.stuff=[1,2,3];//[1,2,3]A.prototype.name='a';//a 让我们用B继承A，extend2(B, A); 用extend2的方...2009-01-13 17:59:16 · 74 阅读 · 0 评论 -
Javascript 继承 (六)
深度拷贝上一节所说到的extendCopy再深一层的对象属性是不能复制的，下面我们就学习另一个拷贝方法。function deepCopy(p, c) { var c = c || {}; for (var i in p) { if (typeof p[i] === 'object') { c[i] = (p[i].constructor === Array)...2009-01-19 16:36:13 · 79 阅读 · 0 评论 -
Javascript 继承 (七)
混合使用原型继承和复制属性当使用继承时，更多的是想在现有的功能中去扩展。意思就是创建一个对象并继承已经存在的对象，然后添加额外的属性和方法。可以结合上几讲的内容用prototype方式继承去复制一个存在的对象。复制另一个对象的所有属性。 function objectPlus(o, stuff) { var n; function F() {} F.prototype =...2009-02-05 15:21:18 · 80 阅读 · 0 评论 -
Javascript 在浏览器环境中 (一) 目录
前言大家都知道Javascript程序本身不能自己运行。需要一个环境。我们一般的讨论javascript都是基于ECMAScript。这一部分主要专注于浏览器了。这部分教程重点如下：BOM（Browser Object Model）DOM（Document Object Model） 监听浏览器的事件XMLHttpRequest对象...2009-02-05 15:35:13 · 154 阅读 · 0 评论 -
Javascript 在浏览器环境中 (二) BOM
BOMBOM是Browser Object Model的缩写。它是你能访问到的浏览器和计算机屏幕的对象集合。可以通过全局对象window和window.screen访问到。 重新认识window我们已经知道了，在javascript中，每个运行环境都会有一个全局对象。在浏览器的环境中，这个全局对象就是window。所有的全局变量都是window对象的属性。window.test=1;...2009-02-05 17:25:27 · 113 阅读 · 0 评论 -
Javascript 在浏览器环境中 (三) DOM节点的访问
DOMDOM就是Document object Model的缩写。文档对象模型是把XML或HTML以树节点为表现形式的文档。用DOM方法和属性，你可以访问，修改，删除页面上任意一个元素，也是可以添加一个元素。DOM是独立于语言的API，可以被任意语言所实现，当然也包括了Javascript看看下面的一个文本。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTM...2009-02-09 14:47:21 · 260 阅读 · 0 评论 -
Javascript 在浏览器环境中 (四) DOM节点的创建,修改与删除
修改节点上面一篇我们学习了DOM节点的访问，下面来看看DOM节点的修改。先获取要改变的节点。var my = document.getElementById('closer');非常容易更改这个元素的属性。我们可以更改innerHTML.my.innerHTML = 'final';//final因为innerHTML可以写入html，所以我们来修改html。my.innerHT...2009-02-12 13:55:33 · 371 阅读 · 0 评论 -
Javascript 在浏览器环境中 (五) HTML DOM
已经知道了 DOM 适用于 XML和HTML文档。前几部分已经介绍XML文档的节点的添加，修改，删除。这部分我们关注的是HTML的DOM。像document.body就是个HTML的DOM对象。这个就返回了body元素。我们也可以用以前的方法获取body元素。document.getElementsByTagName('body')[0] 访问HTML DOM的方法不像是DOM，以下的方...2009-02-12 13:56:06 · 138 阅读 · 0 评论 -
Javascript 在浏览器环境中 (六) 事件
事件事件的例子很多了。如用户输入，点击按钮等等。可以把一个javascript函数赋给一个事件(这个可以叫做事件监听器或者事件处理器)，当事件发生了，就会执行这个函数。 基于内置的HTML属性添加一个时间最快的方法就是，直接添加到html属性中，代码如下<div onclick="alert('aaa!')">click</div>当用户点击这个div的时候，a...2009-02-17 14:17:08 · 111 阅读 · 0 评论 -
Javascript Prototype （二）
穷举属性(Enumerating Properties)要列出对象所有的属性可以用for.in循环来做var o = {p1: 1, p2: 2};for (var i in o) { console.log(i + '=' + o[i]);} 结果为：p1=1,p2=2 但是有以下几点需要注意并不能把对象的所有属性列出来。像constructor属性就没有。可以列出的属性我...2008-12-30 16:59:45 · 81 阅读 · 0 评论 -
Javascript Prototype （一）
关于prototype 属性函数（functions）在javascript中本身就是对象，它有方法和属性。关于函数的属性，prototype是比较重要的一个。function foo(a,b){ return a*b;}typeof foo.prototype;//object 可以为prototype添加属性，foo.prototype={}这个属性对foo函数没有任何...2008-12-30 14:22:32 · 103 阅读 · 0 评论 -
Javascript 基本数据类型，数组，循环以及条件 - 运算符
运算符运算符对一个或两个值（也可能是变量），进行一个运算并且返回一个值。让我们看看一个使用运算符的例子，主要是为了明白运算符的概念。 >>> 1 + 23 上面的代码有四点要说明 +是个运算符运算符是个加法运算输入的值为1和2（输入值也可以叫做操作数）结果是3在运算中你可以把1，2直接替换为变量。在运算中也...2009-10-12 21:41:31 · 97 阅读 · 0 评论 -
Javascript 函数
在Javascript中，函数是很重要的概念。特别是用面向对象思维来写Javascript代码的时候，尤其需要一样诡异的函数写法。关于本教程参考一书为：Javascript面向对象编程本教程主要有两大部分组成：第一部分：函数基础定义一个函数传递参数Javascript预定义的函数变量的作用域函数的概念其实就是一个数据(data)第二部分：函数的高级应...2008-12-25 11:27:49 · 79 阅读 · 0 评论 -
Javascript 函数 (一) 函数的定义
什么是函数(Function)function sum(a,b){ return a+b;}其实通俗的说就是一个有名称的代码段，方便重用。要注意的是：1.Javascript 的函数语法，因为Javascript本身就是区分大小写的，所以function不能写作Function或FUNCTION.2.sum是函数的名称，这个并不是必须的，等以后我们会说到。3.return...2008-12-25 11:28:21 · 122 阅读 · 0 评论 -
Javascript 函数 (二) 函数做为数据类型(Functions are data)
Functions are data这一篇是函数里比较重要的概念，那就是函数是一个数据。看个例子function f(){return 1;}var f=function(){return 1;}这两个函数定义都是相同的。typeof f; f的值为"function"，所以说Javascript 的 函数是个数据类型。它有比较两个重要的特点1.它包含了代码2.能被执行看个例子...2008-12-25 14:48:08 · 77 阅读 · 0 评论 -
Javascript 函数 (三) 回调函数(Callback Functions)
回调函数(Callback Functions)因为函数和其他数据一样可以被赋值，删除，拷贝等，所以也可以把函数作为参数传入到另一个函数中。实例一function invoke_and_add(a,b){ return a()+b();}function one(){ return 1;}function two(){ return 2;}invoke_and_...2008-12-25 15:10:03 · 405 阅读 · 0 评论 -
Javascript 函数 (四) 自调用函数(Self-invoking Functions)
自调用函数(Self-invoking Functions)自调用函数也是匿名函数的一种表现形式，这个函数在定义之后，直接调用。如下( function(){ alert('haha'); })()看起来还挺怪异，不过确实很简单。自调用函数很方便使用，可以不用定义更多的全局变量。还有个好处，就是这个函数不能被执行两遍。真是非常适合做初始化的工作。许多著名的javascript库...2008-12-25 22:12:37 · 368 阅读 · 0 评论 -
Javascript 函数 (五) 内部函数(Inner Functions)
内部函数(Inner Functions)把函数作为一个值来思考一下，既然一个值可以定义在函数中，把函数做为数据放在函数中也未尝不可。如下：function a(param){ function b(theinput){ return theinput *2; } return 'The result is '+b(param);} 也可以这么写var a = functi...2008-12-25 23:46:17 · 576 阅读 · 0 评论 -
Javascript 函数 (六) 返回值为函数的函数
返回值为函数的函数(Functions that Return Functions)在前几篇文章已经介绍了函数要有返回值，即使没有写return，函数也会返回一个undefine。接下来看看返回值为函数的情况function a(){ alert('a'); return function(){ alert('b'); };} 在这个例子中，a函数执行了alert('a'),以...2008-12-26 12:09:01 · 1459 阅读 · 0 评论 -
Javascript 函数 (七) 闭包
闭包(Closures)闭包属于比较难的一部分，在学习闭包之前，先来学习以下Javascript的作用域(Scope)作用域链(Scope Chain)函数内部定义的变量，在函数外不能访问，或者变量定义在代码段中（如if,for中）,在代码段之外也不可访问。var a =1;function f(){ var b=1; return a;}f();//a=1b;//b 没有定义...2008-12-26 15:07:52 · 119 阅读 · 0 评论 -
Javascript 对象 (一)
本篇需要Javascript函数基础。详细教程:http://xiayuanfeng.iteye.com/admin/blogs/301304对象从数组到对象var myarr = ['red','blue','yellow','purple'];myarr;// ["red","blue","yellow","purple"]myarr[0];//"red"myarr[3];//...2008-12-28 23:59:54 · 95 阅读 · 0 评论 -
Javascript 对象 (二)
访问对象的属性有两种方式访问对象的属性。用数组的形式如：animal['name']用点的方式访问：animal.name第一种访问方法适合任意情况。但是如果属性是无效的命名的话，如上一节所说的属性命名'1name'或者'my name'这种情况用点的方式访问就是错误的。这一点要注意。 下面具体看一个对象访问的例子var book = { name:'Javascript...2008-12-29 01:04:51 · 90 阅读 · 0 评论 -
Javascript 对象 (三)
Thisvar hero = { name : 'Rafaelo', sayName : function(){ return this.name; }}hero.sayName();//Rafaelo this的意思就是这个对象的意思,关于this的复杂问题以后在讨论。 构造函数(Constructor Functions)另一种创建对象的方式是用...2008-12-29 15:33:59 · 72 阅读 · 0 评论 -
Javascript 对象 (四)
函数返回对象可以用构造函数来创建个对象，也可以通过普通函数返回对象来创建对象function factory(name){ return { name:name };}用这个方法创建对象var o = factory('one');o.name让我们接下来看看比较少见的构造函数返回对象的例子function C(){ this.a = 1; return...2008-12-29 16:20:44 · 66 阅读 · 0 评论 -
Javascript 在浏览器环境中 (七) XMLHttpRequest
XMLHttpRequestXMLHttpRequest是一个函数，用来创建一个http请求。最初XHR是IE通过ActiveX对象实现的。以后各个浏览器都开始支持了。现在流行的AJAX就是通过XMLHttpRequest对象来实现的。总的来说ajax就是不必刷新整个页面而获取新的内容的一种方法。通过ajax我们可以做类似桌面的程序。AJAX:Asynchronous Javascript a...2009-02-17 17:19:27 · 268 阅读 · 0 评论