| 标题 | Javascript对象字面量的理解 |
| 内容 | 这篇文章主要介绍对Javascript对象字面量的理解,通俗易懂,需要的朋友可以参考下。 对象字面量的输出方式以及定义好处 1.对象字面量的输出方式有两种：传统的‘。'，以及数组方式，只不过用数组方式输出时，方括号里面要用引号括起来，如 var box = { name:'abc'; age:28 }; alert(box['name']); 给对象定义方法 A:如果用传统定义对象的方式，就需要先定义方法，然后再把这个方法名赋值给对象的一个属性，如果要调用这个方法不加括号，就是返回方法代码；如果要调用这个方法该对象属性后面加上括号，就得到方法的返回值 function objrun(){ return '123'; } var box = new Object(); box.name='abc'; box.age = 28; box.run = objrun; alert(box.run()); //结果为123 // alert(box.run); //结果为function objrun(){ return '123'; } //如果box.run = objrun(); //alert(box.run); //结果为123，如果带上圆括号，就报错啦 B:用字面量定义，只需要直接在对象的这个属性上，写function就行，这个function上面没有函数名，他是个匿名函数，那怎么调用这个方法呢，用对象的这个属性名，要调用方法，同上就行 如： var box = { name:'abc', age:28, run:function(){ return '123'; } } alert(box.run()); 2.对象字面量的定义方式，可以轻松搞定函数大量参数需要一一对应输出的情况。他的对策就是给函数传入一个对象，而这个对象是用字面量的方式定义的，属性和值对应的方式可以一目了然他们的关系，因为函数只是一段代码，必须调用才能执行 如： function AA(obj){ alert(obj.name); alert(obj.age); } var obj = { name: 'abc', age: 28 } AA(obj); js对象字面量的demo /** * @author zhanghua */ var literal = { add: function(){ alert("add"); }, del: function(){ alert("delete"); }, update: function(){ alert("update"); }, name: "zhangsan", callLiteral: function(){ // 对于当前字面量对象的调用，要加this关键字 this.add(); } }; html文件： <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Literal--字面量</title> <script type="text/javascript" src="jslib/literal.js"></script> </head> <body> <input type="button" value="add" onclick="javascript:literal.add()"/> <input type="button" value="delete" onclick="javascript:literal.del()"/> <input type="button" value="update" onclick="literal.update()"/> <input type="button" value="name" onclick="javascript:alert(literal.name)"/> <input type="button" value="name" onclick='javascript:alert(literal["name"])'"/> <input type="button" value="caller" onclick='javascript:literal.callLiteral()'"/> </body> </html> 以上就是本文的全部内容 |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。