javascript中万恶的function实例分析


Posted in Javascript onMay 25, 2011

javascript中最有特色而又让你困惑的function算一个了
下面看一下常用操作

function doit(){ 
  ..... 
} 
  doit();

javascript中的函数我们可以把它当作方法使用
var obj=new Object(); 

obj.say=function(){ 
  ..... 

} 

obj.say();

而function实际上就是对象(即Function类型的实例)
function result(num1, num2) { 
return num1 + num2; 
}

var result = new Function("num1", "num2", "return num1+num2");
以上执行效果是一样的,同时function result还可以这样写(即函数表达式)

var result=function(num1,num2){ 
return num1+num2; 
}

这俩种写法的唯一区别是function是优先执行,而函数表达式是代码执行到才执行,另外每个函数内部都有一个类似数组的arguments对象
函数执行动态参数,即
function result(){ 
return arguments[0]+arguments[1]; 
} 
result(1,2);

arguments在动态传递参数方面经常使用
既然说function是对象,那么它应该也具体属性
function person(){ 
.... 
} 
person.name="xxxx"; 
person.say=function(){ 
alert(this.name); 
} 
person.say(); //alert("xxxx")

我们还可以把它当成类,而函数体相当于构造函数
function Person(nm){ 
this.name=nm; 
this.say=function(){ 
alert(nm); 
alert(this.name); 
} 
} 
var p1=new Person("ygm1"); 
p1.say(); //alert ygm1 ygm1 
var p2=new Person("ygm2"); 
p2.say(); //alert ygm2 ygm2

注意这里要用this.name 因为this代表的是当前对象,如果直接alert(name) 求的是window对象的属性,同时传进来的参数nm在方法say中可以直接用,其实这涉及到作用域链,每个function体就是一个作用域,子域可以访问到父域的属性,而反过来却不行(其实也是可以取到的,设计到闭包一些知识,这里不做详解..)
与其他一些OO语言相比,每个类都可以有一些静态属性或方法,而javascript通过原型来模拟以达到每个对象共享其属性
function Person(num) { 
..... 
} 
Person.prototype.name = "ygm"; 
alert(new Person().name);

但OO语言的静态方法都是由类去调用,不能实例化本身的,javascript中由于其特殊性恰好相反
注意这里alertPerson的name属性,如果函数体内没有查找到name则会到原型中去找,如果查找到则会屏蔽原型中的name直接返回其值
其实每创建一个function的同时也创建了一个原型对象,而原型对象引用自object,所以object是所有对象的基类
我们可以重写原型对象
Person.prototype=new ParentPerson();
Person的原型对象指向ParentPerson对象,而ParentPerson对象又指向自己的原型对象...,也就形成了原型链...
好了 今天就写到这里...
Javascript 相关文章推荐
jQuery.extend 函数的详细用法
Jun 27 Javascript
javascript中拼接HTML字符串的最快、最好的方法
Jun 07 Javascript
微信分享的标题、缩略图、连接及描述设置方法
Oct 14 Javascript
jQuery实现的进度条效果
Jul 15 Javascript
javascript实现仿百度图片的瀑布流加载效果
Apr 20 Javascript
js浏览器html5表单验证
Oct 17 Javascript
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
Nov 05 Javascript
bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
Jun 12 jQuery
vue实现密码显示隐藏切换功能
Feb 23 Javascript
vue中如何让子组件修改父组件数据
Jun 14 Javascript
解决vue同一slot在组件中渲染多次的问题
Sep 06 Javascript
vue element upload组件 file-list的动态绑定实现
Oct 11 Javascript
js 页面关闭前的出现提示的实现代码
May 25 #Javascript
仅IE不支持setTimeout/setInterval函数的第三个以上参数
May 25 #Javascript
IE6/7/8/9不支持exec的简写方式
May 25 #Javascript
25个优雅的jQuery Tooltip插件推荐
May 25 #Javascript
在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法
May 24 #Javascript
javascript中String类的subString()方法和slice()方法
May 24 #Javascript
js中关于String对象的replace使用详解
May 24 #Javascript
You might like
星际争霸 Starcraft 编年史
2020/03/14 星际争霸
PHP中的流(streams)浅析
2015/07/02 PHP
详解WordPress中用于合成数组的wp_parse_args()函数
2015/12/18 PHP
PHP实现数组array转换成xml的方法
2016/07/19 PHP
thinkphp5 migrate数据库迁移工具
2018/02/20 PHP
PHP JWT初识及其简单示例
2018/10/10 PHP
使用PHPWord生成word文档的方法详解
2019/06/06 PHP
laravel5环境隐藏index.php后缀(apache)的方法
2019/10/12 PHP
javascript 打印内容方法小结
2009/11/04 Javascript
js 点击按钮弹出另一页,选择值后,返回到当前页
2010/05/26 Javascript
jQuery Easyui 验证两次密码输入是否相等
2016/05/13 Javascript
微信小程序 rpx 尺寸单位详细介绍
2016/10/13 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
2017/12/16 Javascript
详解Vue中localstorage和sessionstorage的使用
2017/12/22 Javascript
vue+springboot前后端分离实现单点登录跨域问题解决方法
2018/01/30 Javascript
AngularJS下$http服务Post方法传递json参数的实例
2018/03/29 Javascript
vue新vue-cli3环境配置和模拟json数据的实例
2018/09/19 Javascript
详解关于element el-button使用$attrs的一个注意要点
2018/11/09 Javascript
使用element-ui的el-menu导航选中后刷新页面保持当前选中状态
2019/07/19 Javascript
node脚手架搭建服务器实现token验证的方法
2021/01/20 Javascript
Python中的CSV文件使用"with"语句的方式详解
2018/10/16 Python
使用python代码进行身份证号校验的实现示例
2019/11/21 Python
keras 多gpu并行运行案例
2020/06/10 Python
Matplotlib中rcParams使用方法
2021/01/05 Python
KEETSA环保床垫:更好的睡眠,更好的生活!
2016/11/24 全球购物
戴尔英国翻新电脑和电子产品:Dell UK Refurbished Computers
2019/07/30 全球购物
英国现代家具和照明购物网站:Heal’s
2019/10/30 全球购物
extern是什么意思
2016/03/10 面试题
社区优秀志愿者材料
2014/02/02 职场文书
小学数学教学反思
2014/02/02 职场文书
关于环保的建议书
2014/05/12 职场文书
设计专业毕业生求职信
2014/06/25 职场文书
员工表扬信怎么写
2015/05/05 职场文书
2016年秋季开学典礼新闻稿
2015/11/25 职场文书
师德培训心得体会2016
2016/01/09 职场文书
用Python简陋模拟n阶魔方
2021/04/17 Python