javascript 函数与对象
javascript中的函数是非常重要的概念,也是比较难于理解的一个知识点! 下面就来聊聊函数;
JS基于对象:什么是基于对象呢?简单的说所有代码都是"对象";
比如函数:
function person(){
}
person();//1 调用函数;
比如变量: var x=5;
x=6 // 2 重新为x赋值;
上面的函数和变量都是对象;所有的函数都是Function类的对象,x是Number类的对象。相当于 var x=new Number(5);
注意: function person(){}没有指明是哪个对象的方法,那么默认就是window对象的方法,变量没有指明是谁的变量,那么同样是window对象的属性; 1,2处其实就是window.person() window.x=6;是一样的,只是省略了window罢了。
函数的创建:3种方式;
(1) function person(参数){函数体} 这是一种比较常见的方式;
(2) var person=function(){}; 匿名函数---- 在今后的代码段中基本上使用这种方式;
(3) var person=new Function("参数","参数"......"函数体"); 这方式基本上不用,函数体多的时候可读性极差!
局部函数:函数里面的函数;
var person=function(){
var name="";
var getName=function () { //这个就是局部函数!
return name;
}
};
new person().getName();//1
getName();//2
注意:1正确的调用方式,2是错误的---在函数体之外的地方不可以直接调用局部函数;
函数的4个属性:函数,方法,对象,类;
在很多人看来函数和方法是一回事,是的,都有点点不同;看完下面就知道。
先写一个函数:function person(){ retun 0;}
(1)作为函数:就这样看,我们知道他就是一个实现 return 0的函数;就是这么简单;
(2)作为对象:不用多说,所有的函数都是Function的对象。这就是函数作为对象;
(3)作为类:function就是一个类 上面的函数就是一个名叫”person“的类,当然也可以new对象;下面会重点讨论。
(4)作为方法:就是以属性的形式定义在类里面,称为方法---和函数有点点区别! 其实独立的函数是对象window的方法;具体有什么不同,也说不清楚!
函数作为类时:属性有类属性和对象属性之分(和Java中的static是差不多的)
function person(name,sex)
{
this.name=name; this.sex=sex; //这2个是对象属性,不同的对象属性是不一样的。
person.nation="cn";// 这个是类属性,所有的对象共有;不能使用 对象.nation 的方式调用!
this.getName=function(){ return this.name;} //对象属性
}
从上面可以看出this后面的是对象属性,类名后面的是类属性;
调用函数的3种方式;
第一种:对象.函数名; 这种最常使用,也是最简单的一种;
第二种:函数名.call(对象,参数列表)==对象.函数名; 几乎上是一样的;
第三种:函数名.apply(对象,数组);
下面来演示第二种:
<script type="text/javascript">
var each=function (array,fn)
{
for(x=0;x<array.length;x++)
{
fn.call(null,x,array[x]);
//fn(x,array[x]);这样也是可以的;
}
}
each([4,20,3],function(x,a){
document.write("第"+x+"个元素值为:"+a+"<br/>");
});
函数的独立性:很有意思的特性;
每个函数都是有自己的归属(对象或者是类),怎么说他有独立性呢?看下面代码:
function person(name,sex)
{
this.name=name; this.sex=sex;
person.nation="cn";
this.getName=function(){ return this.name;} //这是属于person类的函数,在这里习惯称为方法;
}
var p=new person(("andy","man"));//创建一个对象
p.getName(); //这样是可以的,对象.方法 this此时是指p对象;
p.name="ANDY1995";
p.getName.call(window); //这样居然也是可以的,输出的是ANDY,this代表的是window对象;
看来上面的代码,我们知道,getName()函数不仅仅是属于person类的,也是属于其他类或者对象的。所以getName()函数确实是有独立性;一句话总结这个独立性就是:所有的函数都可以通过对象来调用;那么再看
一个有趣的例子,前面写过,直接复制过来:
var person=function(){
var name="";
var getName=function () {
return name;
}
};
new person().getName();//1
既然函数具独立性,那分析一下1;在这里 new person().getName()与window.new person().getName()是不一样的,就是前者的前面不会默认的加上window字样;前一种this是person对象,或者是window对象;
函数的参数问题:看代码;
function person(name,sex)
{
this.name=name; this.sex=sex;
var getNum=function()
{
return arguements.length;
}
}
new person().getNum();//没有输入参数;运算结果是0;
new person("ok").getNum();// 输入一个参数; 结果是1;
看上面的代码,都是可以的,在我们没有输入参数是默认输入undefined;值得注意的是每一个对象(注意不是类)都有一个arguements属性值----用来记录构造函数中输入参数,可以看出它是一个数组;
参数类型处理:
var dealPerson= function( p) //参数P是一个person对象;
{ return p.getName();
}
注意:假如我们传入的参数不是person对象,而是一个数值;那么数值是没有getName()方法的,会导致程序强制结束;本来我们是想要拿到name的,结果发生错误,我们应该怎么处理呢? ------那就是加上类型判断
var dealPerson= function( p) //在这里P是一个person对象;
{ if(type p person ) return p.getName();
else return "wrong";
{
以上函数的有关讨论,下面讨论类与对象;
对象的创建方法:3种;
(1) new
(2) 通过object创建对象;
var ob=new Object();//创建了一个空对象;
ob.name="ad";//为对象创建一个属性name
ob.setName()=function(){}//为对象创建方法;
(3) 通过 {}代码块创建对象----json(Javascript Object Notation) 注意书写方法;
var p={
name:"huan",
sex:"man"
} ;
重中之重---prototype属性实现类的"伪继承";
先看看这个代码:
var person=function(name,sex)
{this.name=name; this.sex=sex;//属性
this.getName=function()//方法;
{return this.name;
}
}
这个程序有什么问题呢? 有二个
(1) 因为函数作为类时,这个函数也就是他的构造器---那么new一个对象就会调用一次函数,导致function重复
定义,假如有十个对象, 那么实际上就有十个getName()方法; 即使使用动态加载也是一样的问题;
(2) 假如有局部变量的存在,那么可能会导致"闭包问题"----局部变量的作用域范围变大;
针对上面的问题:可以使用prototype属性来解决;将上面的代码改为:
var person=function(name,sex)
{this.name=name; this.sex=sex;//属性
}
person.prototype.getName=function()//方法;
{return this.name;
}
这种书写方式就可以避免问题的发生;
prototype功能比较强大,它可以为类添加属性和方法,这里说的类可以是自定义的也可以是js内置类(Object ,String
,Array, Number ect);这种方式类似于Java中的继承,但是有区别:Java中继承之后父类和子类是共存的,JS中只是添加属性,方法;
javascript 函数与对象的更多相关文章
- 2015第37周五javascript函数arguments对象巧用一
Javascript函数的一个巧妙利用:假定action中有一个JSONObject类型的对象data,其值有可能为空,则前台JSP页面的JS代码中想直接通过EL表达式,即${data}的形式访问对象 ...
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- JavaScript函数与对象
函数 函数的定义 JavaScript中的函数和Python中的非常类似,只是定义方式有点区别. // 普通函数定义 function f1() { console.log("Hello w ...
- 【JS小技巧】JavaScript 函数用作对象的隐藏问题(F.ui.name)
用户反馈 @消失的键盘 在论坛反馈了一个问题,在 AppBoxMvc 中的 Title 模型中,如果将 Name 属性改名为小写的 name 属性,就会报错: 因为这是一个 ASP.NET MVC 的 ...
- JavaScript 函数与对象的 简单区别
直接上例子 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...
- 第二章JavaScript 函数和对象
1 JavaScript 函数 1.1 声明函数的方式 function 关键字 匿名函数方式(表达式方式) Function 构造函数方式 1.2 参数问题 形参和实参数量问题 可选形参(参数默认值 ...
- JavaScript函数、对象和数组
一.JavaScript函数 1.定义函数:函数的通用语法如下 function function_name([parameter [, ...]]) { statements; } 由关键字func ...
- JavaScript 函数和对象
在javascirpt 世界中,所有的函数都是对象,并且还可以被用来创建对象. function make_person(firstname, lastname, age) { person = {} ...
- JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象
一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...
随机推荐
- Mysql 主从热备份
工作原理 首先锁定并备份主服务器数据库,从服务器导入备份的数据库,实现两个数据库的初态一样.然后把主服务器上执行过的sql语句都记录到二进制日志 Binarylog 中,从服务器会来读取这个log, ...
- (转)String、StringBuffer与StringBuilder之间区别
原文地址: http://www.cnblogs.com/A_ming/archive/2010/04/13/1711395.html 关于这三个类在字符串处理中的位置不言而喻,那么他们到底有什么优缺 ...
- Oracle约束(Constraint)详解
概述 约束是数据库用来确保数据满足业务规则的手段,不过在真正的企业开发中,除了主键约束这类具有强需求的约束,像外键约束,检查约束更多时候仅仅出现在数据库设计阶段,真实环境却很少应用,更多是放到程序逻辑 ...
- 浅谈Tuple之C#4.0新特性那些事儿你还记得多少?
来源:微信公众号CodeL 今天给大家分享的内容基于前几天收到的一条留言信息,留言内容是这样的: 看了这位网友的留言相信有不少刚接触开发的童鞋们也会有同样的困惑,除了用新建类作为桥梁之外还有什么好的办 ...
- hibernate inverse属性的作用
hibernate配置文件中有这么一个属性inverse,它是用来指定关联的控制方的.inverse属性默认是false,若为false,则关联由自己控制,若为true,则关联由对方控制.见例子: 一 ...
- Jenkins学习三:介绍一些Jenkins的常用功能
Jenkins其实就是一个工具,这个工具的作用就是调用各种其他的工具来达成你的目的. 1.备份.迁移.恢复jenkins 首先找到JENKINS_HOME,因为Jenkins的所有的数据都是以文件的形 ...
- Jquery 操作CheckBox ,RadioButtonList,DropDownList
Jquery版本2.1.4 CheckBox 1.获取值: $("#chb").prop("checked"); RadioButtonList 1.获取值: ...
- 关于java中final关键字与线程安全性
在Java5中,final关键字是非常重要而事实上却经常被忽视其作为同步的作用.本质上讲,final能够做出如下保证:当你创建一个对象时,使用final关键字能够使得另一个线程不会访问到处于" ...
- [LeetCode] Implement Trie (Prefix Tree)
Implement a trie with insert, search, and startsWith methods. Note:You may assume that all inputs ar ...
- vNext之旅(2):net451、dotnet5.4、dnx451、dnxcore50都是什么鬼
继上次"vNext之旅(1):从概念和基础开始"之后再次学习vNext重新遇到了弄不懂的事情,花了一些时间学习,今天来分享一下,为后人节省些时间. 起因 在用vNext造轮子--框 ...