2018-09-19

JavaScript函数的几种写法

1. 常规写法:

最常规的写法

// 函数的定义

function foo(){

alert('常规写法');

// 函数的调用

foo() 


2. 匿名函数写法

给一个变量赋值为一个函数,即变量也为函数对象

// 函数的定义

var foo = function(){ 

 alert('匿名函数定义');

}

// 函数的调用

foo()

3. 将方法作为一个对象

将函数作为对象的方法写法,采用 JSON 格式(JSON 对象)

// 定义

var test = {

   foo1: function(){  },

   foo2: function(){  }

}

// 调用

test.foo1();

test.foo2();

4. 构造函数中给对象添加方法

JavaScript 中每个对象都有 prototype 属性,对对象的 prototype 属性的解释是:返回对象类型原型的引用。

// 给对象添加方法

var foo = function(){ };  // 定义函数对象

foo.prototype.test = function(){

   alert('这是在在foo函数上的原始对象上添加test方法,构造函数中用到');

}

// 调用

var myfoo = new foo(); // 创建对象

myfoo.test(); // 调用对象属性

5. 自执行函数

JavaScript 自执行函数的几种写法

// 方式1: (foo())

(

    function(){alert('hello');}()

);

/*这是jslint推荐的写法,好处是,能提醒阅读代码的人,这段代码是一个整体。

例如,在有语法高亮匹配功能的编辑器里,光标在第一个左括号后时,最后一个右括号也会高亮,看代码的人一眼就可以看到这个整体。 */

// 看到别人的插件,你会发现人家开头处加了一个";",这样就算页面js有错误,加载运行他的插件也能保证运行,如:

;(function(e){alert(e);}('hello world'));

// 即是型如: ;(foo())

// 方式2:(foo)()

(function(){alert('hello');})();

//这种做法比方法1少了一个代码整体性的好处。

// 方式3: function前面加运算符,常见的是!与void

!function(){alert('hello');}();

void function(){alert(2);}();

注:如果一个函数的参数很多,那么我们调用函数的时候并不能很好的记住他的顺序,把参数封装成对象,然后把对象里的一个个属性对应用于参数,这样子很好解决了这个问题

var foo = function(args) {

    sayHi(args.country || "Chinese",

          args.name,

          args.qq,

          args.phone,

          args.email)

}

function sayHi(country,name,qq,phone,email){

   alert("Hi, I am a "+country+", my name is "+name+";qq:"+qq+";phone:"+phone+";email:"+email);    

}

foo({name:"xiao",phone:"13888888888",email:"123456@qq.com",qq:123456});

常见问题

开发中常遇见有函数的写法不同

myfun:function(){}

myfun = function(){}

function myfun(){}

var myfun =function(){}

myfun.prototype.myfunPro = function (){}

这几种方法每一个都有不一样的作用。

1.这里写代码片 myfun:function(){} 这个是必须写在对象内部的,这是一个对象的方法,如

var a = {

  myfun:function(){}

}

写在外面会报错。

1.任何时候都不要这样写 myfun = function(){},这样写就变成了全局对象 window 的一个属性,要记得加上 var ,第四种方式是对的,如下:

var myfun = function(){}

这是一种声明函数的方式,左边是一个变量,右边是一个函数的表达式,意思就是把一个匿名的函数表达式复制给了变量 myfun,只是声明了一个变量指向了一个函数对象。这个和第三种方法 function myfun(){} 声明的方法差别不大,但还是有差别的。

这就要涉及javascript 解析的部分了,简单来说,js 在解析的过程中,会先把函数和变量提前解析。function myfun(){} 这种声明方法会把函数整个语句显示的提前到了脚本或者函数前(当前作用域),函数名和函数均会被提前(会在执行上下文代码前声明)。而 var myfun = function(){} 这种声明方法,只是提前了一个变量,并没有提前函数体。

最后一种并不是声明的函数,只是在 myfun 函数上的原始对象上加了一个 myfunPro 方法,构造函数中用到的。给你个例子:

var myfun = function(){

  this.a = "a";

}

myfun.prototype.myfunPro = function (){

  alert("0")

}

var test = new myfun();

console.log(test);

运行结果如下图:

这时候如果你在最底部加上一段代码,如下:

ar myfun = function(){

  this.a = "a";

}

myfun.prototype.myfunPro = function (){

  alert("0")

}

var test = new myfun();

console.log(test);

test.myfunPro();

这时候就会弹出一个对话框 0 了 。

JavaScript 实例和对象的区别

在 Javascript 中只有对象。 变量是对象,函数也是对象。 只要你知道你的对象是什么,按照它的方式去使用就可以了。

javascript 是弱类型,对象,实例,函数,方法通用的。不需要区别那么清楚。

关于 js 中实例和对象的解释如下:

// 比如定义persion如下:

var person = new Object();

var person = {};

JS 是基于原型的面向对象语言, 所有数据都可以当作对象处理,所以 person 是对象, 可以把它当作是 Object 的实例. 当然, 一切都是对象。第二个采用对象字面量的方式生成的 person 也是如此。然而它内部没有调用 new Object(),而是采用 JSON 的初始化方式:

将现有的引用指向 person。 实例和对象的区别,从定义上来讲: 1、实例是类的具象化产品, 2、而对象是一个具有多种属性的内容结构。实例都是对象,而对象不全是实例。 Js 里面没有类(ES6 以前)的语法,所以类的概念就通过创造一个对象来实现。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,142评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,298评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,068评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,081评论 1 291
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,099评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,071评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,990评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,832评论 0 273
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,274评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,488评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,649评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,378评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,979评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,625评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,796评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,643评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,545评论 2 352

推荐阅读更多精彩内容

  • 到底谁最需要心疼?我脑海里浮现出三位姑娘的身影。 第一位姑娘之之:30岁之前谈了几场恋爱,随心而走,...
    安喜喜阅读 216评论 0 0
  • 1.关于这个问题,我想过很多,没有确切的答案。时年已经20岁,是大姑娘了,搁古代估计早嫁作人妇,恐怕孩子也有几个了...
    珊der阅读 170评论 5 1
  • 星火 无尽的夜晚 我仰望星空 微微的星光闪烁 似乎要创造出另一个黎明 我不停地寻觅着 却终寻不到属于我的那颗孤星 ...
    孙叔义阅读 292评论 4 3
  • 文/妖怪来也 前言 有圆圆的东西在我青春的天空中飞来又飞去。是肥皂泡么?不是,它没那么脆弱。是氢气球么?也不是,它...
    妖怪来也阅读 2,993评论 74 68