一、函数定义

1、函数声明

function add(i,j){
return i+j;
}

特点:1、函数声明定义函数会被前置。要知道在js代码执行时,会有一个预解析,预解析时会把变量声明、函数声明提前。2、函数声明重复定义时会以最后一次定义来执行,即后面会覆盖前面的函数声明。

2、函数表达式

var add = function(i,j){
return i+j;
}

3、函数实例化

var add = new Function("i","j","return (i+j)");
很少使用,不推荐

特点:1、函数实例化定义函数只能访问本地作用域和全局作用域

二、函数调用及区别

1、函数调用模式:add();

2、方法调用模式: object.add();

3、构造函数调用模式: new Function(...);

4、apply(call)调用模式:apply(call)是构造函数原型上的方法.其实现的就是函数借用的功能

例子:

function Point(x,y){
this.x = x;
this.y = y;
}
//定义一个point构造函数
point.prototype.move(x.y){
this.x + = x;
this.y + = y;
}
var p = new Point(0,0);
//实例化一个p点
p.move(2,2);
var circle = (x:1, y:1, r:1);
//定义一个全局circle对象,但是circle没有move方法,所以可以用apply或者call来借用p有的move方法。
p.move.apply(circle, [2,1]);

5、各种函数调用模式的区别-this

js执行时,js引擎会在函数的本地作用域上添加this、arguments这两个临时变量。不同调用模式的区别就表现在this的指向上。

  • 函数调用模式下,this指向为全局对象window
  • 方法调用模式下,this指向为调用者
  • 构造函数模式下,this指向被构造的对象,如果构造了多个对象,this就指向这些被构造的对象
  • apply(call)调用模式下,this指向第一个参数

思考题:

var myNumber = {
value: 1,
add: function(i){
var helper = function(i){
console.log(this);
this.value +=1;
}
helper(i);
}
}
myNumber.add(1); //1、helper函数中的this指向哪个对象,2、这段代码能否实现正确逻辑 3、可以怎么修改来实现正确逻辑

三、函数传参

1、按值传递:原始类型

2、按共享传递:对象类型

var count = {a:1,b:1};
var addOne = function(obj){
obj.a +=1;
obj.b +=1;
return obj;
}
var ret = addOne(count);
console.log(ret);
console.log(count); //Object {a: 2, b: 2} Object {a: 2, b: 2}
但是现在还不能判定时按引用传递,因为如果是引用传递在函数内部对外部变量引用的修改,任何改变都会发生在外部变量上,实践结果如下:
var count = {a:1,b:1};
var addOne = function(obj){
obj = {a:2,b:2};
return obj;
}
var ret = addOne(count);
console.log(ret);
console.log(count); Object {a: 2, b: 2}
Object {a: 1, b: 1}

javascript-函数进阶的更多相关文章

  1. 深入理解javascript函数进阶系列第一篇——高阶函数

    前面的话 前面的函数系列中介绍了函数的基础用法.从本文开始,将介绍javascript函数进阶系列,本文将详细介绍高阶函数 定义 高阶函数(higher-order function)指操作函数的函数 ...

  2. 深入理解javascript函数进阶系列第二篇——函数柯里化

    前面的话 函数柯里化currying的概念最早由俄国数学家Moses Schönfinkel发明,而后由著名的数理逻辑学家Haskell Curry将其丰富和发展,currying由此得名.本文将详细 ...

  3. 深入理解javascript函数进阶系列第三篇——函数节流和函数防抖

    前面的话 javascript中的函数大多数情况下都是由用户主动调用触发的,除非是函数本身的实现不合理,否则一般不会遇到跟性能相关的问题.但在一些少数情况下,函数的触发不是由用户直接控制的.在这些场景 ...

  4. 深入理解javascript函数进阶系列第四篇——惰性函数

    前面的话 惰性函数表示函数执行的分支只会在函数第一次调用的时候执行,在第一次调用过程中,该函数会被覆盖为另一个按照合适方式执行的函数,这样任何对原函数的调用就不用再经过执行的分支了.本文将详细介绍惰性 ...

  5. JavaScript的函数进阶

    函数进阶 1立即执行函数表达式 立即执行的函数表达式的英文全称为Immediately Invoked Function Expression,简称就为IIFE.这是一个如它名字所示的那样,在定义后就 ...

  6. 【转】Python之函数进阶

    [转]Python之函数进阶 本节内容 上一篇中介绍了Python中函数的定义.函数的调用.函数的参数以及变量的作用域等内容,现在来说下函数的一些高级特性: 递归函数 嵌套函数与闭包 匿名函数 高阶函 ...

  7. 零基础讲解JavaScript函数

    一 JavaScript函数1 什么是函数  函数是一组代码(指令)的集合,通常用来完成某个单一的功能.(书的目录和章节,电视剧剧集的名称等)2 为什么要使用函数  2.1 把复杂程序划分成不同的功能 ...

  8. JavaScript函数体系

    第4章  JavaScript函数 1. 函数基本介绍 ① 为什么需要函数 函数最大的好处就是将零散的代码封装到了一起,当我们要再次使用该功能的时候,不需要再重新书写代码,只需要调用封装好的函数就可以 ...

  9. javascript入门进阶(一)

    javascript 入门进阶 这里主要讲解一下在入门阶段很难注意的一些知识点,不一定有用.但是会了总比不会强. 1.HTML为<script>标签准备的6个属性: -async:可选.表 ...

  10. ABP(现代ASP.NET样板开发框架)系列之21、ABP展现层——Javascript函数库

    点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之21.ABP展现层——Javascript函数库 ABP是“ASP.NET Boilerplate Project ...

随机推荐

  1. STC-ISP下载过程

  2. Umbraco 上传文件到另一个文件夹,而不是media files

    If you want to upload there media files to another place in the same instance of IIS, for example a ...

  3. cookie 编码问题

    问题描述:  Control character in cookie value or attribute. 解决方案: 1.前台编码 encodeURIComponent(str) 2.后台解码 原 ...

  4. opennebula 自定义安装目录

    /bin//mkinstalldirs /usr/local/lib /bin//mkinstalldirs /usr/local/include /bin//mkinstalldirs /usr/l ...

  5. Angularjs 整体框架结构

    //angulajs整体代码框架结构/** * @license AngularJS v1.2.6 * (c) 2010-2014 Google, Inc. http://angularjs.org ...

  6. 从gitbook将书籍导入到github中

    gitbook自己的导出工具经常出问题,可直接使用git. 从gitbook中clone下书 $ git clone https://git.gitbook.com/username/name_of_ ...

  7. NAT的全然分析及其UDP穿透的全然解决方式

    NAT的全然分析及其UDP穿透的全然解决方式   一:基本术语 防火墙 防火墙限制了私网与公网的通信,它主要是将(防火墙)觉得未经授权的的包丢弃,防火墙仅仅是检验包的数据,并不改动数据包中的IP地址和 ...

  8. Codeforces Round #331 (Div. 2)C. Wilbur and Points 贪心

    C. Wilbur and Points Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/596/ ...

  9. delphi 滚屏

    滚屏   uses MSHTML;var    a: IHTMLDocument2;    x,y:Integer;begin    y:=y+20;   //加减进行上下滚动    a :=WebB ...

  10. Android学习笔记之百度地图

    步行路线搜索及RouteOverlay 方式与驾车路线搜索类似,只需将mMKSearch.drivingSearch(null, start, null, end)修改为mMKSearch.walki ...