当前位置：首页 > 资讯 > 技术文档

Javascript对象字面量的理解

时间：2020-10-29 04:43 编辑：来源：阅读：
扫一扫，手机访问

摘要：Javascript对象字面量的理解

对象字面量的输出方式以及定义好处 1.对象字面量的输出方式有两种：传统的‘。'，以及数组方式，[b]只不过用数组方式输出时，方括号里面要用引号括起来，如[/b]

var box = {
  name:'abc';
  age:28
};
alert(box['name']);

给对象定义方法， A:如果用[b]传统定义对象[/b]的方式，[b]就需要先定义方法，然后再把这个方法名赋值给对象的一个属性，如果要调用这个方法不加括号，就是返回方法代码；如果要调用这个方法该对象属性后面加上括号，就得到方法的返回值[/b][b] [/b]

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:[b]用字面量定义[/b]，[b]只需要直接在对象的这个属性上，写function就行，这个function上面没有函数名，他是个匿名函数[/b]，那怎么调用这个方法呢，用对象的这个属性名，要调用方法，同上就行如：

var box = {
  name:'abc',
  age:28,
  run:function(){
    return '123';
  }
}
alert(box.run());

2.对象字面量的定义方式，可以轻松搞定函数大量参数需要一一对应输出的情况。他的对策就是[b]给函数传入一个对象，而这个对象是用字面量的方式定义的，属性和值对应的方式可以一目了然他们的关系[/b]，因为函数只是一段代码，必须调用才能执行如：

function AA(obj){
  alert(obj.name);
  alert(obj.age);
}
var obj = {
  name: 'abc',
  age: 28
}
AA(obj);

[b]js对象字面量的demo[/b]

/**
 * @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的语法，大家可以查看：《[url=http://www.1sucai.cn/shouce/javascript/]JavaScript 参考教程[/url]》、《[url=http://shouce.jb51.net/google-js-style/]JavaScript代码风格指南[/url]》，也希望大家多多支持编程素材网。

全部评论(0)

上一篇：JavaScript中字面量与函数的基本使用知识
下一篇：JS提示：Uncaught SyntaxError:Unexpected token ) 错误的解决方法

资讯排行榜
更多>>