1 数组基本属性
//数组直接量形式创建数组
var arr=[];//空数组
var arr1=[1,2,3,4,5,6];
var arr2=[1,2.3,true,false,null,undefined,[1,2,3],{x:1,y:2}];
var x=1;
var arr3=[x,x*3,x+2,x+3];
console.log(arr3);
var arr4=[1,,3];//[1,undefined,3]
// alert(arr4);
console.log(arr4.length);
var arr5=[,,];
console.log(arr5.length);
//通过构造函数Array()创建数组
var a=new Array();//[]
var a=new Array(5);
console.log(a.length);
var a=new
Array(1,2,'king',false,2.3,null);//[1,2,'king',false,2.3,null] console.log(a);
var arr=[1,2,3,4];
console.log(arr[0]);//1
console.log(arr[3]);//4
arr[0]='king';
console.log(arr);
arr[5]='hello maizi';
console.log(arr);
var x=2;
console.log(arr[x]);
arr[arr[x]]=333;
console.log(arr);
var obj={};
obj[0]='a';
obj[1]='b';
console.log(obj);
// console.log(obj.length);
var arr=[];
arr[0]='a';
arr[1]='b';
arr[-123]='c';
arr[2.3]='d';
arr[null]='e';
arr[false]='f';
arr[undefined]='g';
arr['name']='h';
console.log(arr);
console.log(arr.length);
var arr=new Array(10);
arr=[];
arr[100]='abc';
console.log(arr.length);
var arr=[1,2,3,4,5,6,7,8];
arr.length=3;
console.log(arr);
arr.length=0;
console.log(arr);
arr.length=5;
console.log(arr);
var arr=[1,2,3];
Object.defineProperty(arr,'length',{
writable:false
});
console.log(arr.length);
arr.length=10;
console.log(arr.length);
2 数组定义
var arr=[];
arr[0]='a';
arr[1]='b';
arr.push('c');
arr.push('d','e','f',12,34);
console.log(arr);
var res=arr.pop();
console.log(res);
console.log(arr);
arr.unshift(1,2,3,4,5);
console.log(arr);
res=arr.shift();
console.log(res);
console.log(arr);
var arr=['a','b','c','d'];
delete arr[0];
console.log(arr);
console.log(arr.length);
3 运算符
var arr=['a','b','c','d','e'];
for(var i=0,len=arr.length;i console.log(arr[i]); } var arr1=[]; arr1[12]='x'; arr1[23]='y'; arr1[55]='z'; for(var i in arr1){ console.log(arr1[i]); } for(var i in arr1){ if(arr.hasOwnProperty(i)){ console.log(arr1[i]); } } var arr2=[1,2,3,4,5,6]; arr2.forEach(function(x){ console.log(x); }); function Test(element,index,array){ console.log('要处理的数组为:'+array); console.log('索引:'+index+"--值为:"+element); } arr2.forEach(Test); 4 数组中常用的方法
//数组中常用方法
var arr=['a','b','c','d'];
var res=arr.join();
res=arr.join(',');
res=arr.join('');
console.log(res);
res=arr.reverse();
console.log(res);
var arr=['a','b','c','A','B','C'];
arr.sort();
console.log(arr);
var arr=[1,2,11,20,3,15];
arr.sort();
console.log(arr);
arr.sort(function(a,b){
return a-b;
});
arr.sort(function(a,b){
return b-a;
});
console.log(arr);
var users=[
{name:'king',age:12},
{name:'queen',age:32},
{name:'zhangsan',age:54},
{name:'rose',age:66},
];
users.sort(function(a,b){
if(https://www.doczj.com/doc/c512627457.html,>https://www.doczj.com/doc/c512627457.html,)return 1;
if(https://www.doczj.com/doc/c512627457.html, return 0; }); // console.log(users); for(var i in users){ console.log(users[i]['name']); } var arr=[1,2,3]; res=arr.concat(4,5,6); res=arr.concat([4,5,6]); res=arr.concat([4,5,6],[7,8,9]); res=arr.concat([11,[12,[33]]]); console.log(res); var arr=['a','b','c','d','e','f','g','h']; res=arr.slice(0,3); res=arr.slice(2,-3); res=arr.slice(4); res=arr.slice(-5,-2); console.log(res); var arr=['a','b','c','d','e','f','g','h']; res=arr.splice(0,1);//['a']; res=arr.splice(5); res=arr.splice(0,2,'!','?','%'); console.log(res); console.log(arr); var arr=[1,2,3,4,5,6]; res=arr.map(function(x){ return x*x; }); console.log(res); var arr=['a!','b!','c','d!','e']; res=arr.map(Trans); function Trans(x){ return x.replace(/!/g,'?').toUpperCase(); } console.log(res); var arr=[1,3,4,5,5,623,4,345,4367,null,undefined,false,true,'']; res=arr.filter(function(x){ return x<=10; }); res=arr.filter(function(x){ return x%2==0; }); res=arr.filter(function(x){ return x!==undefined && x!=null; }); console.log(res); var arr=[1,2,3,4,5]; res=arr.reduce(function(a,b){ return a+b; }); res=arr.reduce(function(a,b){ return a+b; },10); console.log(res); var age=[12,34,55,66,28,19]; res=age.every(function(x){ return x>=18; }); res=age.some(function(x){ return x>=19; }); console.log(res); var arr=['a','b','c','d','e','a','bv','a']; res=arr.indexOf('a');//0 res=arr.indexOf('A');//-1 res=arr.indexOf('a',2); res=https://www.doczj.com/doc/c512627457.html,stIndexOf('a'); console.log(res); console.log(Array.isArray(arr)); console.log(Array.isArray([])); console.log(Array.isArray({})); var arr=['a','b','c','d','e','a','bv','a']; console.log(arr.toString()); console.log(arr.join()); 5 数组遍历
function foreach(a,f,t){
try{
a.forEach(f,t);
}catch(e){
if(e===foreach.break){
return ;
}else{
throw e;
}
}
}
foreach.break=new Error('stop Iteration');
var arr=['a','b','c','d'];
alert(foreach(arr,foreach.break));
6 两个函数传递给目标函数
function sum(a,b){
return a()+b();
}
function test1(){
return 1;
}
function test2(){
return 2;
}
//将两个函数传递给目标函数
// alert(sum(test1,test2));
//也可以胜利test1和test2函数,使用匿名函数的形式
//alert(sum(function(){return 1;},function(){return 2;}));
//我们将函数A传递给函数B,由函数B来执行A时,A就成了一个回调函数callback //functions;如果此时A还是一个匿名函数,我们就称它为匿名回调函数。
7 setup
// (function(name){
// alert('hello '+name+'!');
// })('king');
// function a(param){
// function b(theinput){
// return theinput*2;
// }
// return 'the result is'+b(param);
// }
// alert(b(2));
//function a(){
// alert('A!');
// return function(){
// alert('B');
// };
//}
//a()();
//var newFunc=a();
//newFunc();
//function a(){
// alert("aaaa");
// return a=function(){
// alert('BBBB');
// };
//}
//a=a();
//a();
//var a=(function(){
// function someSetup(){
// var setup='done';
// }
// function actualWork(){
// alert('worky-king');
// }
// someSetup();
// return actualWork;
//})();
//function a(){
// alert('A');
// a=function(){
// alert('B');
// };
//}
//a();
//a();
var a=function(){
function someSetup(){
var setup='done';
}
function actualWord(){
alert('workwork');
}
someSetup();
return actualWord;
}();
a();
8 closures
/*
1.闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,
因此可以把闭包简单理解成“定义在一个函数内部的函数”。
所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
2.闭包的用途:
一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。function f1(){
var n=999;
nAdd=function(){n+=1}
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
nAdd();
result(); // 1000
在这段代码中,result实际上就是闭包f2函数。
它一共运行了两次,第一次的值是999,第二次的值是1000。
这证明了,函数f1中的局部变量n一直保存在内存中,并没有在f1调用后被自动清除。
为什么会这样呢?
原因就在于f1是f2的父函数,而f2被赋给了一个全局变量,这导致f2始终在内存中,
而f2的存在依赖于f1,因此f1也始终在内存中,不会在调用结束后,
被垃圾回收机制(garbage collection)回收。
这段代码中另一个值得注意的地方,就是“nAdd=function(){n+=1}”这一行,
首先在nAdd前面没有使用var关键字,因此 nAdd是一个全局变量,而不是局部变量。
其次,nAdd的值是一个匿名函数(anonymous function),
而这个匿名函数本身也是一个闭包,所以nAdd相当于是一个setter,
可以在函数外部对函数内部的局部变量进行操作。
--------------------------------------------------------------------------------------------------------
五、使用闭包的注意点
1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,
否则会造成网页的性能问题,在IE中可能导致内存泄露。
解决方法是,在退出函数之前,将不使用的局部变量全部删除。
2)闭包会在父函数外部,改变父函数内部变量的值。
所以,如果你把父函数当作对象(object)使用,
把闭包当作它的公用方法(Public Method),
把内部变量当作它的私有属性(private value),这时一定要小心,不要随便
改变父函数内部变量的值。
*/
// var a=1;
// function test(){
// var b=2;
// return a;
// }
// alert(test());
// alert(b);
// var a=1;
// function test(){
// var b=2;
// function test1(){
// var c=3;
// alert(b);
// alert(a);
// }
// test1();
// }
// alert(test());
// function f1(){
// var a=1;
// return f2();
// }
// function f2(){
// return a;
// }
// alert(f1());
// var a=5;
// alert(f1());
// a=213;
// alert(f1());
// delete a;
// alert(f1());
// function f(){
// var b='b';
// return function(){ // return b;
// }
// }
//// alert(b);
// var n=f();
// alert(n());
//var n;
//function f(){
// var b='b';
// n=function(){
// return b;
// };
//}
//alert(f());
//alert(n());
//function f(arg){
// var n=function(){
// return arg;
// };
// arg++;
// return n;
//}
//var m=f(123);
//alert(m());
//function f(){
// var a=[];
// var i;
// for(i=0;i<3;i++){
// a[i]=function(){
// return i;
// }
// }
// return a;
//}
//var test=f();
//alert(test[0]());
//alert(test[1]());
//alert(test[2]());
//function f(){
// var a=[];
// var i;
// for(i=0;i<3;i++){
// a[i]=(function(x){
// return function(){
// return x;
// }
// })(i);
// }
// return a;
//}
//var test=f();
//alert(test[0]());
//alert(test[1]());
//alert(test[2]());
function setup(x){
var i=0;
return function(){
return x[i++];
};
}
var next=setup(['a','b','c']);
alert(next());
alert(next());
alert(next());
9 formValidator
function check(form){
var
username=document.getElementById("username").value;
if(!/^[0-9a-zA-Z_]+$/.test(username)){
alert('用户名不符合规范');
return false;
}
var
password=document.getElementById("password").value;
if(/^[\s\n\r\t]*$/.test(password)){
alert('密码不能为空');
return false;
}
var email=document.getElementById("email").value;
if(!/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-
]+)+$/.test(email)){
alert('非法邮箱');
return false;
}
}
Js中的Parent对象 文章分类:Web前端 该变更永远指分割窗口最高层次的浏览器窗口。如果计划从分割窗口的最高层次开始执行命令,就可以用top变量。 parent: 该变量指的是包含当前分割窗口的父窗口。如果在一个窗口内有分割窗口,而在其中一个分割窗口中又包含着分割窗口,则第2层的分割窗口可以用parent变量引用包含它的父分割窗口。 opener: 指用WINDOW.OPEN等方式创建的新窗口对应的原窗口。 附:Window对象、Parent对象、Frame对象、Document对象和Form对象的阶层关系:Windows对象→Parent对象→Frame对象→Document对象→Form对象, 如下:parent.frame1.document.forms[0].elements[0].value; 问题:在一个页面嵌入框架
windows对象 每个HTML文档的顶层对象. 属性 frames[] 子桢数组.每个子桢数组按源文档中定义的顺序存放. feames.length 子桢个数. self 当前窗口. parent 父窗口(当前窗口是中一个子窗口). top 顶层窗口(是所有可见窗口的父窗口). status 浏览器状态窗口上的消息. defaultStatus 当status无效时,出现在浏览器状态窗口上的缺省消息. name 内部名,为由window.open()方法打开的窗口定义的名字. wind ows方法 alert("message") 显示含有给定消息的"JavaScript Alert"对话框. confirm("message") 显示含有给定消息的"Confirm"对话框(有一个OK按钮和一个Cancel按钮).如果用户单击OK返回true,否则返回false. prompt("message") 显示一个"prompt"对话框,要求用户根据显示消息给予相应输入. open("URL","name") 打开一个新窗口,给予一个指定的名字. close() 关闭当前窗口. setInterval() 定时 clearInterval() 清楚定时器 document对象 含有当前文档信息的对象. 属性 title 当前文档标题,如果未定义,则包含"Untitled". location 文档的全URL. lastModified 含有文档最后修改日期. bgColor 背景色(#xxxxxx) fgColor 前景文本颜色. linkColor 超链接颜色. vlinkColor 访问过的超链颜色. alinkColor 激活链颜色(鼠标按住未放时). forms[] 文档中form对象的数组,按定义次序存储. forms.length 文档中的form对象数目.
1.Date 属性(1):constructor 所建立对象的函数参考 prototype 能够为对象加入的属性和方法 方法(43):getDay() 返回一周中的第几天(0-6) getYear() 返回年份.2000年以前为2位,2000(包含)以后为4位 getFullYear() 返回完整的4位年份数 getMonth() 返回月份数(0-11) getDate() 返回日(1-31) getHours() 返回小时数(0-23) getMinutes() 返回分钟(0-59) getSeconds() 返回秒数(0-59) getMilliseconds() 返回毫秒(0-999) getUTCDay() 依据国际时间来得到现在是星期几(0-6) getUTCFullYear() 依据国际时间来得到完整的年份 getUTCMonth() 依据国际时间来得到月份(0-11) getUTCDate() 依据国际时间来得到日(1-31) getUTCHours() 依据国际时间来得到小时(0-23) getUTCMinutes() 依据国际时间来返回分钟(0-59) getUTCSeconds() 依据国际时间来返回秒(0-59) getUTCMilliseconds()依据国际时间来返回毫秒(0-999) getTime() 返回从1970年1月1号0:0:0到现在一共花去的毫秒数 getTimezoneoffset() 返回时区偏差值,即格林威治平均时间(GMT)与运行脚本的计算机
所处时区设置之间相差的分钟数) parse(dateString) 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数 setYear(yearInt) 设置年份.2位数或4位数 setFullYear(yearInt)设置年份.4位数 setMonth(monthInt) 设置月份(0-11) setDate(dateInt) 设置日(1-31) setHours(hourInt) 设置小时数(0-23) setMinutes(minInt) 设置分钟数(0-59) setSeconds(secInt) 设置秒数(0-59) setMilliseconds(milliInt) 设置毫秒(0-999) setUTCFullYear(yearInt) 依据国际时间来设置年份 setUTCMonth(monthInt) 依据国际时间来设置月(0-11) setUTCDate(dateInt) 依据国际时间来设置日(1-31) setUTCHours(hourInt) 依据国际时间来设置小时 setUTCMinutes(minInt) 依据国际时间来设置分钟 setUTCSeconds(secInt) 依据国际时间来设置秒 setUTCMilliseconds(milliInt)依据国际时间来设置毫秒 setTime(timeInt)设置从1970年1月1日开始的时间.毫秒数 toGMTString()根据格林威治时间将Date对象的日期(一个数值)转变成一个GMT时间字符串,如:Weds,15 June l997 14:02:02 GMT toUTCString()根据通用时间将一个Date对象的日期转换为一个字符串 toLocaleString()把Date对象的日期(一个数值)转变成一个字符串,使用所在计算机上配置使用的特定日期格式 toSource()显示对象的源代码
JavaScript面向对象简介 JavaScript 的核心是支持面向对象的,同时它也提供了强大灵活的OOP 语言能力。本文从对面向对象编程的介绍开始,带您探索JavaScript 的对象模型,最后描述 JavaScript 当中面向对象编程的一些概念。 复习JavaScript 如果您对JavaScript 的概念(如变量、类型、方法和作用域等)缺乏自信,您可以在重新介绍JavaScript这篇文章里学习这些概念。您也可以查阅这篇JavaScript 1.5 核心指南。 面向对象编程 面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式。它使用先前建立的范例,包括模块化,多态和封装几种技术。今天,许多流行的编程语言(如Java,JavaScript,C#,C+ +,Python,PHP,Ruby 和Objective-C)都支持面向对象编程(OOP)。 面向对象编程可以看作是使用一系列对象相互协作的软件设计,相对于传统观念,一个程序只是一些函数的集合,或简单的计算机指令列表。在OOP中,每个对象能够接收邮件,处理数据和发送消息给其他对象。每个对象都可以被看作是一个独立的小机器有不同的作用和责任。 面向对象程序设计的目的是促进更好的编程灵活性和可维护性,并在大型软件工程中广为流行。凭借其十分注重的模块化,面向对象的代码开发更简单,往后维护更容易理解,使其自身能更直接的分析,编码,理解复杂的情况和过程,比非模块化编程方法省事。1
术语 Namespace 命名空间 允许开发人员在一个专用的名称下捆绑所有功能代码的容器。 Class 类 定义对象的特征。 Object 对象 类的一个实例。 Property 属性 对象的特征,比如颜色。 Method 方法 对象的能力,比如行走。 Constructor 构造函数 实例化时调用的函数。 Inheritance 继承 一个类可以继承另一个类的特征。 Encapsulation 封装 类定义了对象的特征,方法只定义了方法如何执行。 Abstraction 抽象 结合复杂的继承,方法,属性,一个对象能够模拟现实的模型。 Polymorphism 多态 多意为‘许多’,态意为‘形态’。不同类可以定义相同的方法或属性。更多关于面向对象编程的描述,请参照维基百科的面向对象编程。 原型编程
1.JS中的event 对象详解 标签:firefox文档ienullscroll浏览器 2012-09-24 15:38 368人阅读评论(0) 收藏举报 分类: javascript(9) Event属性和方法: 1. type:事件的类型,如onlick中的click; 2. srcElement/target:事件源,就是发生事件的元素; 3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中 0代表左键,1代表中间键,2代表右键) 4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的左上角的位置;(在DOM标准中,这两个属性值都不考虑文档的滚动情况,也就是说,无论文档滚动到哪里,只要事件发生在窗口左上角,clientX和clientY都是 0,所以在IE中,要想得到事件发生的坐标相对于文档开头的位置,要加上 document.body.scrollLeft和 document.body.scrollTop) 5. offsetX,offsetY/layerX,layerY:事件发生的时候,鼠标相对于源元素左上角的位置; 6. x,y/pageX,pageY:检索相对于父要素鼠标水平坐标的整数; 7. altKey,ctrlKey,shiftKey等:返回一个布尔值; 8. keyCode:返回keydown何keyup事件发生的时候按键的代码,以及keypress 事件的Unicode字符;(firefox2不支持 event.keycode,可以用 event.which替代 ) 9. fromElement,toElement:前者是指代mouseover事件中鼠标移动过的文档元素,后者指代mouseout事件中鼠标移动到的文档元素; 10. cancelBubble:一个布尔属性,把它设置为true的时候,将停止事件进一步起泡到包容层次的元素;(e.cancelBubble = true; 相当于 e.stopPropagation();) 11. returnValue:一个布尔属性,设置为false的时候可以组织浏览器执行默认的事件动作;(e.returnValue = false; 相当于 e.preventDefault();) 12. attachEvent(),detachEvent()/addEventListener(),removeEventListener:为制定
js中的json对象 默认分类2010-07-16 17:13:32 阅读730 评论0 字号:大中小订阅 使用JSON进行数据传输 一、选择的意义 在异步应用程序中发送和接收信息时,可以选择以纯文本和XML 作为数据格式。为了更好的使用ajax,我们将学习一种有用的数据格式JavaScript Object Notation(JSON),以及如何使用它更轻松地在应用程序中移动数据和对象。JSON是一种简单的数据交换格式,在某些方面,它的作用与XML非常类似,但比XML更为简单,JSON的语法简化了数据交换的难度,而且提供了一种伪对象的方式。 Java的对象< - >JavaScript对象(json数据格式) 二、JSON 基础 简单地说,JSON 可以将JavaScript 对象中表示的一组数据转换为字符串(伪对象),然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从Web 客户端传递给服务器端程序。这个字符串看起来有点儿古怪(稍后会看到几个示例),但是JavaScript 很容易解释它,而且JSON 可以表示比名称/值对更复杂的结构。例如,可以表示数组和复杂的对象,而不仅仅是键和值的简单列表。 关于JSON对象 1、使用JavaScript语法创建对象 //定义一个函数,作为构造函数 fucntion person(name,sex) { https://www.doczj.com/doc/c512627457.html,=name; this.sex=sex; } //创建一个实例 var p=new Person(‘张三’,’男’); //输出Person实例 alert(https://www.doczj.com/doc/c512627457.html,); 注意:通过该方式创建的对象是一般的脚本对象 2、从JavaScript1.2开始创建对象有了一种更快捷的语法(Json的语法),如下: var obj={name:"张三","sex":'男'}; alert(obj.sex); 关于数组 1、早期的JavaScript数组 var arr=new Array(); arr[0]=’a’; arr[1]=’bbc’ 我们也可以通过如下方式创建数组 var arr=new Array(‘a’,’bbc’); 2、使用JSON语法,则可以通过如下方式创建数组 var arr=[‘a’,’bbc’]; 简单JSON 示例 按照最简单的形式,可以用下面这样的JSON 表示名称/值对:
JavaScript常用对象参考 分类:WEB2008-08-2116:09160人阅读评论(0)收藏举报 JavaScript常用对象参考 Math document body selection window screen location history Date String Event Math对象 E返回欧拉常数e的值 LN1010的自然对数的值 LN22的自然对数的值 LOG2E基数为2的e的对数的值 LOG10E基数为10的e的对数的值 PI圆周率pai的值:3.14159265358979 SQRT1_2返回0.5的平方根 SQRT2返回2的平方根 abs(number)计算number的绝对值 cos(number)计算余弦值 acos(number)计算反余弦值 sin(number)计算正弦值 asin(number)计算反正弦值 tan(number)计算正切值 atan(number)计算反正切值 atan2(x,y)根据指定的坐标返回一个弧度值 ceil(number)返回大于或等于number的整数 floor(number)返回小于或等于number的整数 exp(value)计算以e为基数的value次方的值 log(value)是exp(value)的反方法 max(num1,num2,…)返回两个或多个参数中的最大值 min(num1,num2,…)返回两个或多个参数中的最小值 pow(m,n)计算m的n次方 random()生成0到1的随机数[0,1).生成n到m之间的随机数n+(m-n)*Math.random() round(number)取整(四舍五入) sqrt(number)开平方运算 document write() writeln() open()"打开文档以收集write或writeln方法的输 出:document.open([sURL][,sName][,sFeatures][bReplace]) sName:_blank,_media,_parent,_search,_self,_top sURL:可选项,字符串表达式,用于指定打开文档或窗口的URL地址sFeatures:可选项,字符串表达式,用于指定打开窗口的属性sReplace:true or false;" sFeatures:fullscreen,height,width,left,top,location,resizable,scrollbars,status,toolbar close()关闭输出流 createElement(tag)根据指定标记创建一个HTML标签getElementById(id)获得指定id的HTML元素removeChild(e)移除一个指定的子元素e replaceChild(new,e ) 用new元素替换子元素e appendChild(e)增加一个子元素e(最后) insertBefore(new,e ) 在子元素e前面插入一个new元素
◆js的面向对象的三大特征 1.封装性 所谓封装,就是把我们抽象出的属性和对属性的操作写到类的定义中,称为封装. js 中实现封装主要有两种封装( 公开,私有) class Person(name,sal){ https://www.doczj.com/doc/c512627457.html,=name; //公开 var sal=sal;//私有 this.showInfo=function(){ //公开 window.alert(https://www.doczj.com/doc/c512627457.html,+””+sal); } showInfo2(){ //把函数私有化. window.alert(“你好”+https://www.doczj.com/doc/c512627457.html,+””+sal) } } ◆通过构造函数添加成员方法和通过原型法添加成员方法的区别 1.通过原型法分配的函数是所有对象共享的. 2.通过原型法分配的属性是独立.(如果你不修改属性,他们是共享) 3.建议,如果我们希望所有的对象使用同一一个函数,最好使用原型法添加函 数,这样比较节省内存. function Dog(){ this.shout=function(){ } } //原型法 Dog.prototype.shout=function (){ window.alert("小狗尖叫"+https://www.doczj.com/doc/c512627457.html,); } //通过原型也可以给每个对象,分配属性 Dog.prototype.color="red";
var dog1=new Dog("aa"); var dog2=new Dog("bb"); if(dog1.shout==dog2.shout){ window.alert("dog1.shout==dog2.shout"); } dog1.color="黑色"; window.alert(dog1.color+" "+dog2.color); 4.请大家看一个题: function Person(){ } // 创建对象 var p1=new Person(); // p1.say(); [错误] // 这时用原型法分配 Person.prototype.say=function(){ window.alert("ok"); } p1.say(); 结论是类.prototype.函数=function (){}; 称为后置绑定. js面相对象的继承 看一段代码->问题是什么? ①对象冒充 代码如下:
[web编程]document对象详解 document 文挡对象- JavaScript脚本语言描述 --------------------------------------------------------------------- 注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写否则会提示你一个错误信息"引用的元素为空或者不是对象" --------------------------------------------------------------------- 对象属性 document.title //设置文档标题等价于HTML的
javascript面向对象基础 1.使用[]调用对象的属性和方法 functionUser() { this.age=21; this.sex="男?"; } varuser=newUser(); alert(user["age"]); 2.动态添加,修改,删除对象的属性和方法//定义类varuser=newObject(); //添加属性和方法 https://www.doczj.com/doc/c512627457.html,="cary"; user.age=21; user.show=function(){ alert(https://www.doczj.com/doc/c512627457.html,+"年?龄?为?:?"+this.age);} //执行方法 user.show(); //修改属性和方法 https://www.doczj.com/doc/c512627457.html,="James"; user.show=function() { alert(https://www.doczj.com/doc/c512627457.html,+"你?好?"); } //执行方法 user.show(); //删除属性和方法 https://www.doczj.com/doc/c512627457.html,="undefined"; user.show="undefined" //执行方法 user.show(); 3.使用大括号{}语法创建无类型对象varobj={}; varuser= { name:"cary", age:21,
show:function(){ alert(https://www.doczj.com/doc/c512627457.html,+"年?龄?为?:?"+this.age); } } user.show(); varobj={};等价于 varobj=newObject(); 4.Prototype原型对象 每个函数function也是一个对象,对应的类类型为“Function”,每个函数对象都有一个子对象prototype,表示函数的原型,所以当我们new一个类的对象的时候prototype对象的成员都会被实例化为对象的成员。例如: functionclass1() {} class1.prototype.show=function(){ alert("prototyemember"); } varobj=newclass1(); obj.show(); 5.Function函数对象详解 5.1Function和Date,Array,String等一样都属于JavaScript的内部对象,这些对象的构造器是由JavaScript本身所定义的。上面说过函数对象对应的类型是Function,这个和数组的对象是Array一个道理。所以也可以像newArray()一样newFunction()来创建一个函数对象,而函数对象除了使用这种方式还可以使用function关键字来创建。我们之所以不经常使用newFunction()的方式来创建函数是因为一个函数一般会有很多语句,如果我们将这些都传到newFunction()的参数中会显得可读性比较差。varfunctionName=newFunction(p1,p2,...,pn,body)其中p1到pn为参数,body为函数体。 5.2有名函数和无名函数 有名函数:functionfuncName(){}无名函数:varfuncName=function(){}他们之间的唯一区别:就是对于有名函数他可以出现在调用之后再定义,而对于无名函数,他必须是在调用之前就已经定义好。 5.3我们可以利用Function的prototype对象来扩展函数对象,如: Function.prototype.show=function(){ alert("扩展方法"); }
JavaScript面向对象(一看就懂) 1、对象描述 如果有个人,他叫周杰伦,性别是男,他还有一个变化的年龄,我们该怎么用面向对象的方式来表述呢? 第一、我们先给他起一个对象名叫zjl。 第二、我们给这个对象两个属性,一个属性叫name,它的值为"周杰伦",另一个属性叫gender,它的值为"male"。 第三、我们给这个对象一个方法,叫setAge,它可以给zjl这个对象设置年龄,它有一个形参age,用于接收代表实际年龄的实参。 2、第一种创建对象的方法 让我们先来看一下创建对象的第一种方法,格式为如下所示。注意属性和属性值之间要有英文的冒号,各个属性以及函数之间要用英文的逗号隔开,对象末尾的属性值或函数后没有逗号。 注意这里面的this关键字,代表zjl这个对象,this.curage=age也就是把形参的值赋给zjl这个对象的curage属性,你当然也可以用同样的方法给属性name和gender赋值,赋值后name和gender的初始值就会被覆盖掉。现在想一想如果curage不加前面this.呢?还记得我们前面讲过的全局变量吗?没错,这样curage就不是对象zjl的属性,而是一个全局变量了,那如果我们写成var curage呢,这是它只是setAge函数里面的一个局部变量,也不再是对象zjl的属性了。加了this关键字的方法和属性叫做公有方法和属性,不管在对象内部还是外部都可以访问。所以当我们在对象内部要引用公有方法和属性时,一定记得要加his 关键字。 /*var对象名={ 属性名1:属性值, 属性名2:属性值, ...... 函数名1:function(形参......) {函数体1}, 函数名2:function(形参......) {函数体2}, ...... };*/ var zjl={ name:"周杰伦", gender:"male", setAge:function(age){ this.curage=age; } }; 3、第二种创建对象的方法 第二种创建对象的格式为: var对象名=new Object(); 对象名.属性名1=属性值1; ......
JS 各种引擎介绍 https://www.doczj.com/doc/c512627457.html,/project/tag/296/javascript-engine 不同浏览器有不同的JS引擎: WebKit , Safari浏览器->SquirrelFish Extreme, Firefox àTraceMonkey引擎 Google Chrome àV8引擎,(C++) Opera -> Carakan Mozilla ->SpiderMonkey(C语言) Mozilla à Rhino( Java) Mozilla ->JaegerMonkey SEE (Simple ECMAScript Engine) C语言开发的轻量级的ECMAScript (JavaScript) 解析器和实时运行环境 (1)javascript 解析引擎V8(C++) https://www.doczj.com/doc/c512627457.html,/p/v8 V8 是Google 发布的开源JavaScript 引擎,采用C++ 编写,在Google 的Chrome浏览器中被使用。V8 引擎可以独立运行,也可以用来嵌入到C++ 应用程序中执行。\ (2)javascript 脚本引擎 SpiderMonkey (c语言) https://www.doczj.com/doc/c512627457.html,/p/spidermonkey SpiderMonkey是Mozilla项目的一部分,是一个用C语言实现的JavaScript脚本引擎,另外还有一个叫做Rhino的Java版本。 为了在SpiderMonkey中运行JavaScript代码,应用程序必须有三个要素:JSRuntime,JSContext 和全局对象。 运行时环境 JSRuntime,为其中的JavaScript变量、对象、脚本和应用程序中使用的上下文分配空间。每个JSContext 和脚本中的每个对象都生活在一个JSRuntime中。他们不能转移到其他运行时上或在与其它运行时共享。
1.Date 属性(1): constructor 所建立对象的函数参考 prototype 能够为对象加入的属性和方法 方法(43): getDay() 返回一周中的第几天(0-6) getYear() 返回年份.2000年以前为2位,2000(包含)以后为4位 getFullYear() 返回完整的4位年份数 getMonth() 返回月份数(0-11) getDate() 返回日(1-31) getHours() 返回小时数(0-23) getMinutes() 返回分钟(0-59) getSeconds() 返回秒数(0-59) getMilliseconds() 返回毫秒(0-999) getUTCDay() 依据国际时间来得到现在是星期几(0-6) getUTCFullYear() 依据国际时间来得到完整的年份 getUTCMonth() 依据国际时间来得到月份(0-11) getUTCDate() 依据国际时间来得到日(1-31) getUTCHours() 依据国际时间来得到小时(0-23) getUTCMinutes() 依据国际时间来返回分钟(0-59) getUTCSeconds() 依据国际时间来返回秒(0-59) getUTCMilliseconds()依据国际时间来返回毫秒(0-999) getTime() 返回从1970年1月1号0:0:0到现在一共花去的毫秒数getTimezoneoffset() 返回时区偏差值,即格林威治平均时间(GMT)与运行脚本的计算机所处时区设置之间相差的分钟数) parse(dateString) 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数setYear(yearInt) 设置年份.2位数或4位数 setFullYear(yearInt)设置年份.4位数 setMonth(monthInt) 设置月份(0-11) setDate(dateInt) 设置日(1-31) setHours(hourInt) 设置小时数(0-23) setMinutes(minInt) 设置分钟数(0-59) setSeconds(secInt) 设置秒数(0-59) setMilliseconds(milliInt) 设置毫秒(0-999) setUTCFullYear(yearInt) 依据国际时间来设置年份 setUTCMonth(monthInt) 依据国际时间来设置月(0-11) setUTCDate(dateInt) 依据国际时间来设置日(1-31) setUTCHours(hourInt) 依据国际时间来设置小时 setUTCMinutes(minInt) 依据国际时间来设置分钟 setUTCSeconds(secInt) 依据国际时间来设置秒 setUTCMilliseconds(milliInt)依据国际时间来设置毫秒 setTime(timeInt) 设置从1970年1月1日开始的时间.毫秒数 toGMTString() 根据格林威治时间将Date对象的日期(一个数值)转变成一个GMT时间字
●Date ●属性(1): ●constructor 所建立对象的函数参考 ●prototype 能够为对象加入的属性和方法 ●方法(43): ●getDay() 返回一周中的第几天(0-6) ●getYear() 返回年份.2000年以前为2位,2000(包含)以后为4位 ●getFullYear() 返回完整的4位年份数 ●getMonth() 返回月份数(0-11) ●getDate() 返回日(1-31) ●getHours() 返回小时数(0-23) ●getMinutes() 返回分钟(0-59) ●getSeconds() 返回秒数(0-59) ●getMilliseconds() 返回毫秒(0-999) ●getUTCDay() 依据国际时间来得到现在是星期几(0-6) ●getUTCFullYear() 依据国际时间来得到完整的年份 ●getUTCMonth() 依据国际时间来得到月份(0-11) ●getUTCDate() 依据国际时间来得到日(1-31) ●getUTCHours() 依据国际时间来得到小时(0-23) ●getUTCMinutes() 依据国际时间来返回分钟(0-59) ●getUTCSeconds() 依据国际时间来返回秒(0-59) ●getUTCMilliseconds()依据国际时间来返回毫秒(0-999) ●getTime() 返回从1970年1月1号0:0:0到现在一共花去的毫秒数 ●getTimezoneoffset() 返回时区偏差值,即格林威治平均时间(GMT)与运行脚本的计算机所处时区设置之间相差的 分钟数) ●parse(dateString) 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数 ●setYear(yearInt) 设置年份.2位数或4位数 ●setFullYear(yearInt)设置年份.4位数 ●setMonth(monthInt) 设置月份(0-11) ●setDate(dateInt) 设置日(1-31) ●setHours(hourInt) 设置小时数(0-23) ●setMinutes(minInt) 设置分钟数(0-59) ●setSeconds(secInt) 设置秒数(0-59) ●setMilliseconds(milliInt) 设置毫秒(0-999) ●setUTCFullYear(yearInt) 依据国际时间来设置年份 ●setUTCMonth(monthInt) 依据国际时间来设置月(0-11) ●setUTCDate(dateInt) 依据国际时间来设置日(1-31) ●setUTCHours(hourInt) 依据国际时间来设置小时 ●setUTCMinutes(minInt) 依据国际时间来设置分钟 ●setUTCSeconds(secInt) 依据国际时间来设置秒 ●setUTCMilliseconds(milliInt)依据国际时间来设置毫秒 ●setTime(timeInt) 设置从1970年1月1日开始的时间.毫秒数 ●toGMTString() 根据格林威治时间将Date对象的日期(一个数值)转变成一个GMT时间字符串,如:Weds,15 June l997 14:02:02 GMT ●toUTCString() 根据通用时间将一个Date对象的日期转换为一个字符串 ●toLocaleString() 把Date对象的日期(一个数值)转变成一个字符串,使用所在计算机上配置使用的特定日期格 式 ●toSource() 显示对象的源代码
JSNI详解 在使用GWT后,我们将用JAVA来编码,可能我们之前已经写了一些javascript类库,现在转用GWT是不是意味着这些都无法使用,需要重新实现一遍呢 其实不需要,因为GWT给我们提供了嵌入javascript的技术,叫做JSNI(JavaScript Native Interface,JavaScript 本地接口)。 JSNI可以实现以下功能 1.从JavaScript中直接执行Java方法 2.从JavaScript中调用Java代码,或从Java代码中调用JavaScript代码 3.在Java和Javascript之间抛异常 4。在JavaScript中读写Java域属性 JSNI的写法如下: Java代码 public native void method()/*-{ //此处写javascript代码 $wnd.alert('run in JSNI'); }-*/; 方法体以/*-{开头以}-*/结尾,最后要加分号。 在这个方法体里面就可以写javascript代码了,上面的例子就会执行alert语句。 在alert前面我们加了$wnd,是因为我们的js代码会加载到一个iframe里面,直接使用alert会调用iframe里面的window对象,因此gwt给我们提供了$wnd用来指向主页面的window对象。 跟这个类似的还有document对象,在jsni中我们用$doc来指向主页面的document对象。 在JAVA代码中调用这个method()方法,就可以与javascript互动了 下面如何在javascript中调用JAVA的方法 Java代码 package com.single.test.client; import com.google.gwt.core.client.EntryPoint; public class Test implements EntryPoint{ private String name="field"; public void onModuleLoad(){ invokeJavaMethod(); } /** *静态JAVA方法 *@param s */ public static void staticLog(String s){ System.out.println("run in static method and input="+s); } /** *非静态JAVA方法 *@param s */ public void log(String s){ System.out.println("run in non-static method and input="+s); } /** *javascript调用JAVA方法示例 */
Javascript中的对象、函数和继承 前一段时间在看Extjs的源代码,起初打算从他的Widget开始看起,因为想借鉴一下并应用到自己的代码中,但是看了一段时间发现很难阅读进去,主要因为对他的整体如何组织对象和事件的方式不是很清楚。所以还是耐下性子从最基础的开始看起,什么是Extjs的基础,可以说是他的Ext.extend函数,因为之后的各个wdiget的扩展都用它来实现的。但是起初发现他的内容并不是那么容易就可以看明白的,有的时候觉得自己看明白了,但是再多问自己一个为什么,可能又答不上来了。 这个时候正好碰到一本很不错的讲JS原理书,周爱民的《Javascript语言精粹与编程实践》,如获至宝,赶紧买来阅读。在阅读的过程中又在我面前蹭蹭蹭,出现了几本很不错的js书籍,在这里也向大家推荐一下,一本是有Y ahoo的js大牛Douglas Crockeord(后文称之为老道)所著,由淘宝UED的小马和秦歌翻译的《Javascript语言精粹》,一本是《Javascript 设计模式》。最早我读的这两本书都是英文版的,所以还被第二本书中的一些观点给误导了,但是幸好看到第二本书的译者很负责任,在批注中都已经修正过来了。最后一本,其实不是书,而是《ECMAScript Language Specification》,俗称ECMA-262,有两个值得看的版本,一个是第三版,一个是第五版;现在的大部分js实现都是基于第三版的规范,但是在有些问题上,第五版描述的更加清晰一些。 废话少说,进入正题。 1、Javascript中的对象 JavaScript可以说是一个基于对象的编程语言,为什么说是基于对象而不是面向对象,因为JavaScript自身只实现了封装,而没有实现继承和多态。既然他是基于对象的,那么我们就来说说js中的对象。有人说js中所有的都是对象,这句话不完全正确。正确的一方是他强调了对象在js中的重要性,对象在js中无处不在,包括可以构造对象的函数本身也是对象。但是另一方面,js中也有一些简单的数据类型,包括数字、字符串和布尔值、null值和undefined值,而这些不是对象。那为什么这些类型的值不是对象呢,毕竟他们也有方法。那让我们来看一下,JavaScript中对于对象的定义,有两种定义。 (1)JavaScript中的对象是可变的键控集合(keyed collections)(此定义来自老道的那本书的第三章) (2)JavaScript中的对象是无序(unordered)的属性集合,这些属性可以含有简单的数据类型、对象、函数;保存在一个对象属性中的函数也被称为这个对象的方法。(来自ECMA-262 的4.3.3)(注:这里所说的属性是可以在js脚本中创建和访问的(我们称之为显性属性),不包括系统为对象自动分配的内部属性) 那为什么那个简单的数据类型不是对象呢,主要是因为这些数据类型的值中拥有的方法是不可变的,而一个对象的属性是应当可以被改变的。 2、对象中的原型链[[proto]] JavaScript中的每个对象创建的时候系统都会自动为其分配一个原型属性[[proto]],用来连接到他的原型对象。在JavaScript中就是通过每个对象中的[[proto]]来实现对象的继承关系的。但是对象的[[proto]]属性在JavaScript是不能访问和修改的,他是作为一个内部的属性存在的,而且是在对象被创建的同时由系统自动设定的。 当访问一个对象的某一属性,如果这个属性在此对象中不存在,就在他的[[proto]]所指