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的一个拖拽到指定区域内的效果
Sep 21 Javascript
用javascript为页面添加天气显示实现思路及代码
Dec 02 Javascript
鼠标选择动态改变网页背景颜色的JS代码
Dec 10 Javascript
js实现透明度渐变效果的方法
Apr 10 Javascript
Bootstrap CSS布局之表单
Dec 17 Javascript
利用Angularjs中模块ui-route管理状态的方法
Dec 27 Javascript
微信小程序 页面跳转传递值几种方法详解
Jan 12 Javascript
原生javascript实现的全屏滚动功能示例
Sep 19 Javascript
基于React+Redux的SSR实现方法
Jul 03 Javascript
Vue.js 中的 v-show 指令及用法详解
Nov 19 Javascript
浅谈vue2的$refs在vue3组合式API中的替代方法
Apr 18 Vue.js
微信小程序实现轮播图指示器
Jun 25 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
phpMyAdmin2.11.6安装配置方法
2008/08/24 PHP
php 图像函数大举例(非原创)
2009/06/20 PHP
yii框架源码分析之创建controller代码
2011/06/28 PHP
PHP内核学习教程之php opcode内核实现
2016/01/27 PHP
Dom加载让图片加载完再执行的脚本代码
2008/05/15 Javascript
基于JQuery的一句代码实现表格的简单筛选
2010/07/26 Javascript
8个超棒的学习 jQuery 的网站 推荐收藏
2011/04/02 Javascript
给页面渲染时间加速 干掉Dom Level 0 Event
2012/12/19 Javascript
JQuery页面的表格数据的增加与分页的实现
2013/12/10 Javascript
jQuery中add()方法用法实例
2015/01/08 Javascript
JavaScript获取页面中第一个锚定文本的方法
2015/04/03 Javascript
js使用setTimeout实现定时炸弹的方法
2015/04/10 Javascript
jQuery实现表格行上下移动和置顶效果
2015/06/05 Javascript
轻量级javascript 框架Backbone使用指南
2015/07/24 Javascript
jQuery+Ajax实现无刷新操作
2016/01/04 Javascript
谈谈JavaScript中浏览器兼容问题的写法小议
2016/12/17 Javascript
图片上传之FileAPI与NodeJs
2017/01/24 NodeJs
AngularJS路由实现页面跳转实例
2017/03/03 Javascript
jQuery插件HighCharts绘制简单2D柱状图效果示例【附demo源码】
2017/03/21 jQuery
js实现本地时间同步功能
2017/08/26 Javascript
Vuex 进阶之模块化组织详解
2018/01/12 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
2018/11/25 Javascript
Python中运算符"=="和"is"的详解
2016/10/08 Python
一个基于flask的web应用诞生 flask和mysql相连(4)
2017/04/11 Python
Pandas_cum累积计算和rolling滚动计算的用法详解
2019/07/04 Python
Python基于jieba, wordcloud库生成中文词云
2020/05/13 Python
HTML5计时器小例子
2013/10/15 HTML / CSS
一道写SQL的面试题和答案
2013/11/19 面试题
专业毕业生个性的自我评价
2013/10/03 职场文书
会计电算化应届生求职信
2013/11/03 职场文书
市场部专员岗位职责
2013/11/30 职场文书
信息管理员岗位职责
2013/12/01 职场文书
工程业务员岗位职责
2013/12/31 职场文书
《学会合作》教学反思
2014/04/12 职场文书
2014医学院领导班子对照检查材料思想汇报
2014/09/19 职场文书
工作态度恶劣检讨书
2015/05/06 职场文书