javascript-函数进阶

一、函数定义

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}
时间: 2024-10-13 00:20:21

javascript-函数进阶的相关文章

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

前面的话 函数柯里化currying的概念最早由俄国数学家Moses Schönfinkel发明,而后由著名的数理逻辑学家Haskell Curry将其丰富和发展,currying由此得名.本文将详细介绍函数柯里化(curring) 定义 currying又称部分求值.一个currying的函数首先会接受一些参数,接受了这些参数之后,该函数并不会立即求值,而是继续返回另外一个函数,刚才传入的参数在函数形成的闭包中被保存起来.待到函数被真正需要求值的时候,之前传入的所有参数都会被一次性用于求值 从

javascript入门进阶(一)

javascript 入门进阶 这里主要讲解一下在入门阶段很难注意的一些知识点,不一定有用.但是会了总比不会强. 1.HTML为<script>标签准备的6个属性: -async:可选.表示应该立刻下载脚本,但不应妨碍页面中的其他操作.(其他的下载可以等待) -charset:可选.表示通过src指定的代码的字符集. -defer:可选.表示脚本可以延迟到文档被解析和显示之后在执行.该版本值对外部JavaScript有效果 -src:可选.执行代码的外部文件. --type:可选.编写代码使用

ABP展现层——Javascript函数库

ABP展现层——Javascript函数库 点这里进入ABP系列文章总目录 基于DDD的现代ASP.NET开发框架--ABP系列之21.ABP展现层——Javascript函数库 ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称. ABP的官方网站:http://www.aspnetboilerplate.com ABP在Github上的开源项目:https://github.com/aspnetboilerplate ASP.NET Boil

C#实现百度地图附近搜索&amp;调用JavaScript函数

前一篇文章"C#调用百度地图API入门&解决BMap未定义问题"讲述了如何通过C#调用百度API显示地图,并且如何解决BMap未定义的问题.这篇文章主要更加详细的介绍百度地图的一些功能,包括附近搜索.城市搜索.路线规划.添加覆盖物等等. 希望文章对你有所帮助!如果文章中有不足之处,还请海涵~ 百度官方文档:http://developer.baidu.com/map/jsmobile.htm 官方DEMO例:http://developer.baidu.com/map/jsde

JavaScript函数,作用域以及闭包

JavaScript函数,作用域以及闭包 1. 函数 (1). 函数定义:函数使用function关键字定义,它可以用在函数定义表达式或者函数声明定义. a. 函数的两种定义方式: * function functionName() {} * var functionName = function(){} b. 两种函数定义不同之处 1). 声明提前问题 函数声明语句   :声明与函数体一起提前 函数定义表达式 :声明提前,但是函数体不会提前 请看下面图示:绿色线上面实在js初始加载的时候,查看

HTML 学习笔记 JavaScript (函数)

函数是由事件驱动的或者当他被调用时执行的可重复使用的代码块 实例 <!DOCTYPE html> <html> <head> <script> function myFunction() { alert("Hello World!"); } </script> </head> <body> <button onclick="myFunction()">点击这里</b

javascript 函数重载 overloading

函数重载 https://en.wikipedia.org/wiki/Function_overloading In some programming languages, function overloading or method overloading is the ability to create multiple methods of the same name with different implementations. Calls to an overloaded functi

第十篇--------javascript函数-参数

javascript函数的参数:形参,实参 //function 参数 //形参列表 function test(a,b,c,d){ //alert(test.length); //形参个数,4个 //函数的实际参数,内部就是用一个数组去接收函数的实际参数 //arguments 对象,可以访问函数的实际参数 //arguments 对象只能在函数的内部使用 alert(arguments.length); //2个 alert(arguments[0]); //10 alert(argumen

javaScript 函数重载

javaScript函数不支持重载.有时我们想像java.C等语言 一样定义 重载的方法,那么 我们就可以用其他的方式去定义 重载的函数. 当然,实现的方式 有好多种,每个人 可能不同.下面 我贴出我的实现及使用方法 和 大家交流. js 源码: /**  * 函数参数重载方法 overload,对函数参数进行模式匹配.默认的dispatcher支持*和...以及?,"*"表示一个任意类型的参数,"..."表示多个任  *意类型的参数,"?"一般

前端笔试题目总结——应用JavaScript函数递归打印数组到HTML页面上

数组如下: var item=[{ name:'Tom', age:70, child:[{ name:'Jerry', age:50, child:[{ name:'William', age:20 }] }, { name:'Jessi', age:30 }]}]; 输出的HTTML如下: 1 <ol> 2 <li>name:Tom</li> 3 <li>age:70</li> 4 <li>children: 5 <ol&g