js 多种变量定义(对象直接量,数组直接量和函数直接量)


Posted in Javascript onMay 24, 2010

对象直接量创建一个对象:

var obj = {x:[1,2],y:23};

代码跟下面是一样的。
var obj=new Object(); 
obj.x=new Array(1,2); 
obj.y=23;

测试:
for(var i in obj) alert(obj[i]);

函数直接量:它是一个表达式而不是语句。

(function(){})()

如下例:
(function(){ 
document.write("some script code"); 
})() var a=(function(s){return s})("abc"); 
alert(a); 
var b=function(s){return s}; 
alert(b("abc"));

这个如何解释呢
大家应该记得这种写法
var a=function (){}
那么怎么运行a呢,那么就是a()
同样的道理,我们不通过a这个变量来存那么是如何写法,就是
function(){}()
但是你会发现这样是错的
因为解析引擎解析的时候,解析的时候发现}判断到了函数结束了
并没有把那个函数作为块来运行
那么加上()是强制把function那块作为块

一、什么是匿名函数
在Javascript定义一个函数一般有如下三种方式:

函数关键字(function)语句:
function fnMethodName(x){alert(x);}函数字面量(Function Literals):
var fnMethodName = function(x){alert(x);}Function()构造函数:
var fnMethodName = new Function('x','alert(x);')上面三种方法定义了同一个方法函数fnMethodName,第1种就是最常用的方法,后两种都是把一个函数复制给变量fnMethodName,而这个函数是没有名字的,即匿名函数。实际上,相当多的语言都有匿名函数。

二、函数字面量和Function()构造函数的区别
虽然函数字面量是一个匿名函数,但语法允许为其指定任意一个函数名,当写递归函数时可以调用它自己,使用Function()构造函数则不行。
var f = function fact(x) {
if (x < = 1) return 1;
else return x*fact(x-1);
};
Function()构造函数允许运行时Javascript代码动态的创建和编译。在这个方式上它类似全局函数eval()。

Function()构造函数每次执行时都解析函数主体,并创建一个新的函数对象。所以当在一个循环或者频繁执行的函数中调用Function()构造函数的效率是非常低的。相反,函数字面量却不是每次遇到都重新编译的。

用Function()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

var y = "global"; 
function constructFunction() { 
var y = "local"; 
return new Function("return y"); // 无法获取局部变量} 
alert(constructFunction()()); // 输出 "global" 函数直接量:

只要是表达式语法,脚本宿主就认为 function 是一个直接量函数,如果什么都不加,光以 function 开头的话则认为是一个函数声明,把 function 写进一个表达式内部,比如四则运算,宿主也会将其当作是一个直接量,如下:
var a = 10 + function(){ 
return 5; 
}();

夸张一点,如下:
(function(){ 
alert(1); 
} ) ( ); 
( function(){ 
alert(2); 
} ( ) ); 
void function(){ 
alert(3); 
}() 
0, function(){ 
alert(4); 
}(); 
-function(){ 
alert(5); 
}(); 
+function(){ 
alert(6); 
}(); 
!function(){ 
alert(7); 
}(); 
~function(){ 
alert(8); 
}(); 
typeof function(){ 
alert(9); 
}();

js中定义函数的方式有多种,函数直接量就是其中一种。如var fun = function(){},这里function如果不赋值给fun那么它就是一个匿名函数。

好,看看匿名函数的如何被调用。

1、执行后得到返回值的函数调用

//方式一,调用函数,得到返回值。强制运算符使函数调用执行 
(function(x,y){ 
alert(x+y); 
return x+y; 
}(3,4)); //方式二,调用函数,得到返回值。强制函数直接量执行再返回一个引用,引用在去调用执行 
(function(x,y){ 
alert(x+y); 
return x+y; 
})(3,4);

2、执行后忽略返回值
//方式三,调用函数,忽略返回值 
void function(x) { 
x = x-1; 
alert(x); 
}(9);

嗯,最后看看错误的调用方式
//错误的调用方式 
function(x,y){ 
alert(x+y); 
return x+y; 
}(3,4);

Javascript 相关文章推荐
使用CSS样式position:fixed水平滚动的方法
Feb 19 Javascript
jquery序列化表单去除指定元素示例代码
Apr 10 Javascript
node.js中的console用法总结
Dec 15 Javascript
Dojo获取下拉框的文本和值实例代码
May 27 Javascript
Bootstrap导航条学习使用(一)
Feb 08 Javascript
es6+angular1.X+webpack 实现按路由功能打包项目的示例
Aug 16 Javascript
JavaScript+CSS相册特效实例代码
Sep 07 Javascript
基于JSONP原理解析(推荐)
Dec 04 Javascript
详解angularjs 学习之 scope作用域
Jan 15 Javascript
dts文件中删除一个node或属性的操作方法
Aug 05 Javascript
浅谈vue 单文件探索
Sep 05 Javascript
js实现图片上传即时显示效果
Sep 30 Javascript
js 设置选中行的样式的实现代码
May 24 #Javascript
基于jquery的direction图片渐变动画效果
May 24 #Javascript
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
May 24 #Javascript
jquery 模拟类搜索框自动完成搜索提示功能(改进)
May 24 #Javascript
mysql输出数据赋给js变量报unterminated string literal错误原因
May 22 #Javascript
让mayfish支持mysqli数据库驱动的实现方法
May 22 #Javascript
JavaScript 笔记二 Array和Date对象方法
May 22 #Javascript
You might like
BBS(php &amp; mysql)完整版(三)
2006/10/09 PHP
php设置页面超时时间解决方法
2015/09/22 PHP
php读取torrent种子文件内容的方法(测试可用)
2016/05/03 PHP
Yii2实现自定义独立验证器的方法
2017/05/05 PHP
PHP PDOStatement::getAttribute讲解
2019/02/01 PHP
jquery 插件 web2.0分格的分页脚本,可用于ajax无刷新分页
2008/12/25 Javascript
javascript 必知必会之closure
2009/09/21 Javascript
优化javascript的执行速度
2010/01/23 Javascript
jQuery EasyUI 开源插件套装 完全替代ExtJS
2010/03/24 Javascript
NodeJS url验证(url-valid)的使用方法
2013/11/18 NodeJs
window.location的重写及判断location是否被重写
2014/09/04 Javascript
AngularJS页面访问时出现页面闪烁问题的解决
2016/03/06 Javascript
JS 动态加载js文件和css文件 同步/异步的两种简单方式
2016/09/23 Javascript
详解Nodejs之npm&amp;package.json
2017/06/15 NodeJs
详解jQuery中的isPlainObject()使用方法
2018/02/27 jQuery
微信小程序实时聊天WebSocket
2018/07/05 Javascript
vue devtools的安装与使用教程
2018/08/08 Javascript
vue2.0 路由模式mode=&quot;history&quot;的作用
2018/10/18 Javascript
JS使用new操作符创建对象的方法分析
2019/05/30 Javascript
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
2019/08/16 Javascript
Layui选项卡制作历史浏览记录的方法
2019/09/28 Javascript
vue用elementui写form表单时,在label里添加空格操作
2020/08/13 Javascript
[04:32]DOTA2著名解说配音敌法师 现场专访海涛怒切假腿
2013/12/20 DOTA
浅谈Django REST Framework限速
2017/12/12 Python
运用PyTorch动手搭建一个共享单车预测器
2019/08/06 Python
Python2与Python3的区别点整理
2019/12/12 Python
Python环境管理virtualenv&amp;virtualenvwrapper的配置详解
2020/07/01 Python
巧克力领导品牌瑞士莲美国官网:Lindt Chocolate美国
2016/08/25 全球购物
StubHub希腊:购买体育赛事、音乐会和剧院门票
2019/08/03 全球购物
数据库什么时候应该被重组
2012/11/02 面试题
市场部专员岗位职责
2013/11/30 职场文书
幼儿教师个人总结
2015/02/05 职场文书
幼师大班个人总结
2015/02/13 职场文书
一百条裙子读书笔记
2015/07/01 职场文书
五年级作文之学校的四季
2019/12/05 职场文书
MySQL查询日期时间
2022/05/15 MySQL