Javascript对象字面量的理解
更新时间：2016年06月22日 11:26:48 作者：沫鱼
这篇文章主要介绍对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>
以上就是本文的全部内容，了解更多JavaScript的语法，大家可以查看：《JavaScript 参考教程》、《JavaScript代码风格指南》，也希望大家多多支持脚本之家。
相关文章
下面小编就为大家带来一篇老生常谈js数据类型。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
本篇文章，小编将和大家一起深入了解javascript中的prototype与继承，有需要的朋友可以参考一下2013-04-04
一般我们在开发过程中通过window.open打开新窗口，但现在浏览器与杀毒都防止了这个函数弹出页面，一般我们将页面设置信任才可以使用，不过我们在后台开发过程中仍然通过这个方法打开页面，这里简单介绍下使用方法与常用参数2013-06-06
javascript中的对象和数组的应用技巧...2007-01-01
这篇文章主要介绍了javascript判断回文数详解及实现代码的相关资料,需要的朋友可以参考下2017-02-02
js代码运行不出来的情况在项目中经常发生，究竟是什么原因呢？在本文整理了一些常见的情况，感兴趣的各位朋友可以参考下2013-10-10
我们下面来看一篇关于JavaScript中借用方法的一个详细介绍，注意：本文假设你已经掌握使用 call()、apply()和bind()的相关知识和它们之间的区别，希望这篇文章能够让各位了解到JavaScript中的借用方法吧。2016-08-08
这篇文章主要介绍了javascript打开word文档的方法,需要的朋友可以参考下2014-04-04
在Javascript学习笔记5 类和对象中，我简单地提到了利用JSON去构造一个对象。2010-01-01
这篇文章主要介绍了JavaScript中的选择器，下面和小编一起了看看吧2019-05-05
最新评论