`
lighter
  • 浏览: 495515 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

javascript学习笔录(二)

阅读更多
1、预装图象
function doPreload(){
	var the_images = new Array('kwmatt.jpg','matbon.jpg','lunchMat.jpg');
	preloadImages(the_images);
}

function preloadImages(the_images_array) {
	for(loop = 0; loop < the_images_array.length; loop++){
   		var an_image = new Image();
		an_image.src = the_images_array[loop];
	}
}

doPreload()函数创建了需要预装的图象名的数组,并把数组作为参数传送到preloadImages()函数, preloadImages()函数包
含了一个循环,每次循环都创建一个新的图象对象,并把图象名设到它的src属性中。

2、创建一个Javascript对象
(1)、最常见的方法
比如,创建一个宠物
function Pet(the_pet_name, the_form_number){
	this.age = 0;
	this.hunger = Math.random() * 5;  // random number between 0 and 4.99
	this.health = Math.random() * 5 + 1 ;  // random number between 1 and 3.99
	this.happiness = Math.random() * 5;
	this.pet_name = the_pet_name;
	this.form_number = the_form_number;
	window.document.forms[the_form_number].pet_name.value = the_pet_name;
}


这个构造函数有两个参数:宠物名字和要显示其信息的表单号。要创建两个宠物,我们这么
做: 
var pet1 = new Pet("barney",0);
var pet2 = new Pet("betty",1);


(2).工厂方式
     function createobject(){
        var o=new Object();
        o.a=1;
        o.b="w";
        o.c=function(){};
        return o;
}

当然,你可以给这个函数传入参数进行定制,但是对函数的创建就重复了。
它还有个相近的版本,但是这个版本可以用new来创建
function createobject(){
        this.a=1;
        this.b="w";
        this.c=function(){};
}

(3).使用对象的prototype属性,用一个空构造函数来设置对象名,然后所有的属性和方法都直接用prototype来赋予
function o(){};
o.prototype.a=1;
o.prototype.b=function(){};

此方法也是用new来创建新对象的。
   
(4).JSON方式来创建
    var o={
    a:1,
    b:"aa"
    c:function(){}
}


3、eval()函数,这个函数可以把一个字符串当作一个JavaScript表达式一样去执行它。
通过eval()函数,可以获取难以索引的对象,代码如下:
function simpleSwap(){
	var the_image = prompt("change parrot or cheese","");
	var the_image_name = "window.document." + the_image;
	var the_image_object = eval(the_image_name);
	the_image_object.src = "ant.gif";
}


4、四种手段来设置文本框的文本的简单例子:
如果在一个表单里有一个文本框,象这样:
<form name="the_form">
<input type="text" name="the_text_box">
</form>


JS代码如下所示:
我们可以用四种手段来设置文本框的文本,代码如下:
var the_form_name = "the_form";
var the_element_name = "the_text_box";

(1)、window.document.forms[0].elements[0].value = "hello!"; 
(2)、window.document.forms[the_form_name].elements[the_element_name].value = "hello!"; 
(3)、window.document.the_form.the_text_box.value = "hello!"; 
(4)、var the_element_string = "window.document." + the_form_name + "." + the_element_name; 
     var the_element = eval(the_element_string);
     the_element_string.value = "hello!"; 


5、常看的JS错误:
引用
混淆变量名或函数名
偶然地使用了保留字
偶然给变量加上了引号,或忘了给字符串加引号...


6、优化JavaScript代码
引用
(1)、限制循环内的工作量
(2)、定制if-then-else语句,按最可能到最不可能的顺序
(3)、最小化重复执行的表达式
分享到:
评论

相关推荐

    JavaScript学习指南 高清 PDF

    JavaScript学习指南 高清 PDF,个人的学习使用,共35M。

    JavaScript完全学习手册

    资源名称:Javascript完全学习手册内容简介:本书分4篇14章,介绍Javascript的知识,全书内容包括:Javascript语法基础、流程控制、函数、内置对象编程、文档对象模型DOM与事件驱动、处理XML、...

    JavaScript学习基础学习心得

    JavaScript基础深度原理学习心得,从中可以领略到JavaScript比较有深度的知识理解 JavaScript基础深度原理学习心得,从中可以领略到JavaScript比较有深度的知识理解

    JavaScript学习指南.pdf

    JavaScript学习指南.pdf JavaScript学习指南.pdf

    JavaScript学习指南 第3版.pdf

    JavaScript学习指南第三版,学习JavaScript的同学欢迎来下载

    Javascript学习总结

    Javascript学习总结, Javascript学习总结, Javascript学习总结, Javascript学习总结 Javascript学习总结

    JavaScript 帮助 学习 文档

    JavaScript 帮助 学习 文档 对JavaScript学习很有帮助

    JavaScript学习(一)

    NULL 博文链接:https://jerryzhang.iteye.com/blog/376317

    html css JavaScript 学习留下的代码.zip

    html css JavaScript 学习留下的代码html css JavaScript 学习留下的代码 html css JavaScript 学习留下的代码html css JavaScript 学习留下的代码 html css JavaScript 学习留下的代码html css JavaScript 学习留下...

    JavaScript学习指南 源代码

    JavaScript学习指南 源代码

    个人Javascript学习笔记 精华版

    个人Javascript学习笔记 精华版 个人Javascript学习笔记 精华版 个人Javascript学习笔记 精华版

    JavaScript学习资料大全

    JavaScript学习资料大全,包括《JavaScript实例》、《JavaScript教程》、《Javascript语言教程》、《JavaScript技术讲座》、《Javascript源码大全1.0版》、《javascript教程.chm》、《JavaScript源代码集》、...

    JavaScript学习指南

    《JavaScript学习指南(第2版)》系统地介绍了JavaScript的基本语法、基本对象、调试工具与排错技术、事件处理机制、浏览器对象模型/文档对象模型(BOM/DOM)等方面的知识,并通过一个复杂的示例深入探讨了Ajax应用。...

    HTML+CSS+JavaScript学习练手.zip

    HTML+CSS+JavaScript学习练手HTML+CSS+JavaScript学习练手 HTML+CSS+JavaScript学习练手HTML+CSS+JavaScript学习练手 HTML+CSS+JavaScript学习练手HTML+CSS+JavaScript学习练手 HTML+CSS+JavaScript学习练手...

    头歌教学实践平台 Web前端开发基础 JavaScript学习手册十:正则表达式

    头歌教学实践平台 Web前端开发基础 JavaScript学习手册十:正则表达式。源码txt格式。

    html+css3+javascript 学习demo.zip

    html+css3+javascript 学习demohtml+css3+javascript 学习demo html+css3+javascript 学习demohtml+css3+javascript 学习demo html+css3+javascript 学习demohtml+css3+javascript 学习demo html+css3+javascript ...

    JavaScript学习资源

    JavaScript学习资源JavaScript学习资源JavaScript学习资源

    Javascript学习安卓版

    Javascript学习是Android客户端目前最全面的免费离线Javascript学习书籍,从Html入门到Html样式设计,再到Javascript,提高网页设计能力。主要内容包括: 1、Html基本标签 2、Html表单知识 3、Web2.0(Div+Css样式)...

    javascript学习

    javascript学习

    JavaScript学习工具.rar

    JavaScript学习工具.rarJavaScript学习工具.rarJavaScript学习工具.rarJavaScript学习工具.rarJavaScript学习工具.rarJavaScript学习工具.rar

Global site tag (gtag.js) - Google Analytics