`
jaesonchen
  • 浏览: 315429 次
  • 来自: ...
社区版块
存档分类
最新评论

javascript 对象和函数

 
阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>objectandfunction.html</title>
	
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type="text/javascript" src="../js/jquery-1.11.3.js"></script>
  
  <body>
  	<div id="div"></div>
	<script type="text/javascript">
	// <![CDATA[
		//如果你需要在没有硬编码的window标识符下访问全局对象,你可以在任何层级的函数作用域中做如下操作:
		var global = (function () {
			return this;
		})();
		function show(str) {
			$("#div").append($("<p></p>").text("" + str));
		}
	
		//JSON 文本转换为 JavaScript 对象
		//JSON 最常见的用法之一,是从 web 服务器上读取 JSON 数据(作为文件或作为 HttpRequest),将 JSON 数据转换为 JavaScript 对象,然后在网页中使用该数据。
		//JSON 解析器
		//由于 JSON 语法是 JavaScript 语法的子集,JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。
		//eval() 函数使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。必须把文本包围在括号中,这样才能避免语法错误:
		//var obj = eval ("(" + txt + ")");
		//eval() 函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。
		//使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON 解析器只能识别 JSON 文本,而不会编译脚本。
		var jsontxt = '{"employees":[' +
			'{"firstName":"Bill","lastName":"Gates" },' +
			'{"firstName":"George","lastName":"Bush" },' +
			'{"firstName":"Thomas","lastName":"Carter" }]}';
		var jsonobj = JSON.parse(jsontxt);
		show([jsonobj.employees[0].firstName, jsonobj.employees[0].lastName]);	//Bill,Gates
		
		//javascript 变量和函数名称是大小写敏感的
		function CaseSensitive() {}
		try {
			caseSensitive();
		} catch (error) {
			show(error);	//ReferenceError: caseSensitive is not defined
		}
		
		//函数上下文中的变量对象VO
		//形式参数和arguments对象指向相同的变量
		//未传递进来的形参和arguments[]为undefined,修改时不会互相影响
		//模拟函数重载:用 arguments 对象判断传递给函数的参数个数,即可模拟函数重载
		function foo(x, y, z) {
			// 声明的函数参数数量arguments (x, y, z)
		  	show("声明的函数参数数量:" + foo.length); 			// 3
		  	// 真正传进来的参数个数(only x, y)
		  	show("真正传进来的参数个数:" + arguments.length);	// 2
		  	// 参数的callee是函数自身
		  	show(arguments.callee === foo); // true
		  	// 参数共享
		  	show(x === arguments[0]); 		// true
		  	show(x);						// 10
		 	//参数同步
		  	arguments[0] = 20;
		  	show(x); 						// 20
		 	x = 30;
		  	show(arguments[0]); 			// 30
		  	// 不过,没有传进来的参数z,和参数的第3个索引值是不共享的
		  	z = 40;
		  	show(arguments[2]); 			// undefined
		  	arguments[2] = 50;
		  	show(z); 						// 40
		}
		foo(10, 20);
		
		//函数声明(缩写为FD)是这样一种函数:
		//1.有一个特定的名称
		//2.在源码中的位置:要么处于程序级(Program level),要么处于其它函数的主体(FunctionBody)中
		//3.在进入上下文阶段创建
		//4.影响变量对象VO
		//这种函数类型的主要特点在于它们仅仅影响变量对象(即存储在上下文的VO中的变量对象)。
		function funcDefine() {
			//  ...
		}
		
		//函数表达式(缩写为FE)是这样一种函数:
		//1.在源码中须出现在表达式的位置
		//2.有可选的名称
		//3.不会影响变量对象
		//4.在代码执行阶段创建
		//这种函数类型的主要特点在于它在源码中总是处在表达式的位置。
		var funcEx = function () {};
		//自执行函数表达式
		(function () {
			show("hello world");
		})();
		
		//当函数表达式FE有一个名称(称为命名函数表达式,缩写为NFE)时,将会出现一个重要的特点。
		//从定义中我们知道函数表达式不会影响一个上下文的变量对象VO
		//(那样意味着既不可能通过名称在函数声明之前调用它,也不可能在声明之后调用它)。
		//但是,FE在递归调用中可以通过名称调用自身。
		var nfe = function testNFE() {};
		try {
			testNFE();		//未定义
		} catch(error) {
			show(error);	//ReferenceError: testNFE is not defined
		}
		
		var varNFE = function funNFE() {
			show([arguments.callee === varNFE,
		    	arguments.callee === funNFE]);
		};
		varNFE(); 	// [true, true]
		
		//通过函数构造器Function创建的函数
		//既然这种函数对象也有自己的特色,我们将它与FD和FE区分开来。
		//其主要特点在于这种函数的[[Scope]]属性仅包含全局对象:
		var z = 10;
		function newFunc() {
			var z = 20;
			var y = 30;
			var bar = new Function('show(z); show(y);');
			try{
		  		bar(); 	
			}catch(error){ show(error); }	
		}
		newFunc();	// 10, "y" 未定义
		
		//变量对象VO:
		//任何时候,变量只能通过使用var关键字才能声明。
		//隐式声明仅仅是给全局对象创建了一个新属性(但它不是变量)。
		//关于变量,还有一个重要的知识点。变量相对于简单属性来说,变量有一个特性(attribute):{DontDelete},
		//这个特性的含义就是不能用delete操作符直接删除变量属性。
		show(x);			//function x() {}
		var x = 10;
		show(x);			//10
		function x() {}
		x = 20;
		show(x);			//20
		//var 定义的变量不能删除
		delete x;
		show(x);			//20
		//global.y简单属性可以删除
		y = 100;
		delete y;
		try {
			show(y);
		} catch (error) {
			show(error);	//ReferenceError: y is not defined
		}
		
		var foo = {x: 10};
		var bar = {
			x: 20,
			test: function () {
		    	show(this === bar); 
		    	show(this.x); 
		  	}
		};
		bar.test();		// true, 20
		 
		foo.test = bar.test;
		// 这里this指向foo
		// 尽管调用的是相同的function
		foo.test(); 	// false, 10


		//基本类型可以像对象类型一样使用,包括访问其属性、对其属性赋值(尽管实际上不起作用,但是形式上可以)。
		//之所以能这样去使用基本类型,是因为JavaScript引擎内部在处理对某个基本类型 a进行形如a.sth的操作时,
		//会在内部临时创建一个对应的包装类型(对数字类型来说就是Number类型)的临时对象,并把对基本类型的操作代理到对这个临时对象身上,
		//使得对基本类型的属性访问看起来像对象一样。但是在操作完成后,临时对象就扔掉了,下次再访问时,会重新建立临时对象,当然对之前的临时对象的修改都不会有效了。
		var aa = 10;
		aa.prop = 20;
		show(aa.prop + aa);	//NaN
		
		var bb = 'hello ';
		bb.prop = 'world';
		show(bb + bb.prop);	//helloundefined

		var cc = new Number(10);
		cc.prop = 20;
		show(cc.prop + cc);	//30
		
		var dd = function() {};
		dd.prop = 'hello ';
		show(dd.prop + dd);	//hello function () {}
	// ]]>
	</script>
  </head>
  </body>
</html>

 

分享到:
评论

相关推荐

    javascript对象和函数[文].pdf

    总的来说,理解JavaScript中的对象、函数和原型链对于编写高质量的JavaScript代码至关重要。通过深入学习和实践,开发者可以更好地掌握JavaScript的核心概念,从而编写出更高效、更灵活的代码。

    JAVASCRIPT对象与函数[文].pdf

    JavaScript的`Math`对象提供了一系列数学运算相关的函数和属性。三角函数如`Math.sin()`, `Math.cos()`, `Math.tan()`分别计算正弦、余弦和正切值;反三角函数如`Math.asin()`, `Math.acos()`, `Math.atan()`则用于...

    javascript指南和函数式编程

    而《JavaScript函数式.zip》可能是一份关于JavaScript函数式编程的资料集合,函数式编程是一种编程范式,强调使用函数和避免改变状态。其中可能涵盖以下知识点: 1. **纯函数**:理解纯函数的定义,即给定相同的...

    javascript实现根据函数名称字符串动态执行函数的方法示例

    在这里,我们定义了一个`myFunctions`对象,将`targetFunction`作为其属性,通过`test`函数和`myFunctions`对象来动态调用。 以上就是在JavaScript中实现函数动态调用的几种常见方法,每种方法都有其适用的场景。...

    教案JAVASCRIPT对象与函数.pdf

    JavaScript对象允许我们组织和存储复杂的数据结构,例如,可以创建一个表示人的对象,包含姓名、年龄和地址等属性。此外,对象还可以拥有方法,即执行特定任务的函数,使得对象具有行为。 函数在JavaScript中不仅是...

    JAVASCRIPT对象与函数.pdf

    ## JavaScript对象 JavaScript对象是一种数据结构,它可以存储键值对(key-value pairs)。对象的键通常是字符串,而值可以是任何数据类型,包括其他对象。创建对象主要有两种方式:字面量语法和构造函数。 ### ...

    Javascript函数与对象

    JavaScript支持面向对象编程(OOP)模式,通过构造函数和原型链实现类的概念。虽然ES6引入了类语法,它实际上是构造函数和原型链的语法糖,底层仍然是基于函数和原型。 ##### 构造函数和原型 构造函数用于创建新...

    JavaScript内置函数与内置对象.doc

    JavaScript内置函数与内置对象.doc

    JavaScript函数式编程.pdf

    4. 纯函数和副作用 纯函数是指在相同的输入下总是产生相同输出,并且除了返回结果外不产生任何副作用(如修改全局变量、修改参数或输出到控制台等)的函数。在JavaScript函数式编程中,推崇使用纯函数,因为纯函数...

    JavaScript中函数对象调用模式总结

    函数对象可以在变量中赋值、作为参数传递,甚至作为其他函数的返回值,这在实现高阶函数和回调函数时非常常见。 函数调用模式主要有以下几种: 1. **基础调用模式**:这是最简单的形式,如 `func()`. 这种调用方式...

    JavaScript中函数与对象的解析.pdf

    通过和构造数组对象语句的比较,可以清楚地看到 JavaScript 函数作为对象的本质,在解释器内部,当遇到这种语法时,就会自动构造一个 Function 对象,将函数作为一个内部的对象来存储和运行。 函数对象的调用 函数...

    JavaScript实用小函数(一)

    本文将主要围绕JavaScript中的函数、面向对象编程以及多态性来展开。 1. **函数**: 在JavaScript中,函数是可重复使用的代码块,可以接收参数并返回值。它们是第一类对象,这意味着函数可以作为变量赋值、作为参数...

    JavaScript Doc

    此外,JavaScript中的`this`关键字根据上下文指向不同的对象,这是理解JavaScript对象和函数行为的关键。 总的来说,"JavaScript Doc" 提供的中文文档覆盖了JavaScript语言的基础到进阶知识,无论你是初学者还是...

    QT和网页中的JavaScript函数进行相互调用的实现

    - 这里的回调函数用于处理JavaScript函数的异步返回结果,如果需要同步获取结果,可以使用`QWebEngineScript`来注册一个全局JavaScript对象,然后通过该对象调用JavaScript函数。 2. **JavaScript调用QT函数**: ...

    javascript对象参考手册

    以上只是JavaScript对象涉及的一部分知识点,JavaScript参考手册.chm文件很可能会包含这些话题的详细解释和实例。对于开发者来说,深入理解和熟练掌握这些内容是提高编程效率和写出高效、可维护代码的关键。

    javascript函数速查

    ES6引入了模块系统,通过import和export关键字,可以将函数和其他可导出的变量组织到单独的文件中,方便复用和管理。 总结,JavaScript函数是其强大和灵活的核心特性之一。理解并熟练运用上述知识点,将有助于编写...

    深入认识JavaScript中的函数

    通过将函数视为对象,我们可以更好地利用它们的特性和灵活性,从而实现更高级的编程技巧,如高阶函数和闭包。此外,掌握函数的不同定义和创建方式可以帮助我们更加灵活地处理各种编程需求,提高代码的可读性和可扩展...

    Javascript面向对象编程.

    1. **构造函数(Constructor)**:构造函数是一种特殊的函数,用于创建和初始化对象。我们可以通过`new`关键字来调用构造函数,创建一个新的对象实例。例如: ```javascript function Person(name) { this.name =...

    JavaScript对象模型

    JavaScript对象模型的核心在于理解基本数据类型、对象和函数的实现机制。了解这些基础知识对于编写高效、可靠的JavaScript代码至关重要。通过掌握内置数据类型、对象和构造器的工作原理,开发者可以更好地利用...

    JavaScript ES6函数式编程入门经典

     目前,编程语言已经将焦点从对象转移到函数。JavaScript支持函数式编程,并允许开发者编写精心设计的代码。  主要内容  ●掌握函数式编程的概念  ●清楚函数在JavaScript中的地位  ●理解真实的函数式类库...

Global site tag (gtag.js) - Google Analytics