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:"[email protected]",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 以前）的语法，所以类的概念就通过创造一个对象来实现。