新课程新版javascript函数.pptx

函数简介 创客学院 韩老师 WEB前端开发 什么函数-function 函数是由事件驱动的，被调用执行的，可重复使用的代码块 函数还能接受输入的参数，不同的参数会返回不同的值（参数话） 默认不会自动执行，除非被调用 函数是JS里面的一等公民 Object 是JS中使用最多的一个类型。 函数没有重载，想通过的函数后面的会覆盖掉前面的函数 函数实际上是对象。每个函数都是 Function 类型的实例，而且都与其他引用类型一样具有属性和方法。由于函数是对象，因此函数名实际上也是一个指向函数对象的指针，不会与某个函数绑定 函数的创建 函数声明 ：function fn() {} // 四项都为必须 可省略分号 函数表达式： var fn = function() {}; // 匿名函数赋值给一个变量的过程 命名函数表达式：var demo = function() fn {} // 含内部作用于 有name属性 ES6创建箭头函数：() => {}; // 节省代码量 没有arguments对象 函数生成器： function* f() {} // 无return语句 使用yield代替，可含有多个 函数构造器：var fn = new Function() // 传参必须使用字符串 evel()方法进行参数解析 函数声明语句/函数表达式 函数声明语句会在JS预编译时进行声明前置操作（当前作用域下） 函数声明可先调用，在声明 函数表达式语句是一个为变量赋值的过程 变量值为一个匿名函数 函数表达式语句的变量会在当前作用域下声明前置，而值只有在赋值之后才可使用 函数表达式语句必须先创建表达式在进行调用 函数表达式应用场景： 为变量赋值 为对象的方法赋值 作为函数的参数传递 （作为回调函数使用 常见于ES5数组方法使用） 命名函数表达式/箭头函数 var myFn = function fn(); 命名函数表达式有name属性 函数体内，存在一个变量，在函数体内可以访问到，外部无法访问到 var a = function b () {b == function(){}} IE8下命名函数表达式解释的时候会当作一个普通的函数声明，之后在赋值给变量，造成命名污染 浏览器在支持ES6或转码的情况下可进行箭头函数的创建 var fn = (a,b) => {return a + b}; 箭头函数没有自己的上下文执行环境（this指向外部的作用域this） 箭头函数是匿名函数 name属性是一个空的字符串 箭头函数内部没有arguments对象 函数的参数只有一个时候小括号也可以省略 a => {return a}; val => val; 函数调用 创客学院 韩老师 WEB前端开发 函数的调用 一般情况下，调用函数使用函数名 + （）的方式进行调用 function fn(){console.log('hello world')} // fn() === 'hello world' 当匿名函数传递给变量的时候，使用变量 + () 的方式进行调用 var fn = function(){alert('hello')} // fn() === 'hello' 匿名函数还可由事件驱动进行调用 document.querySelector('div').onclick = function() {alert('hello')} // ''hello'' 可作为回掉函数进行调用 var fn = function(item){return item > 1}; [1,2,3].some(fn); // true; 函数特性 函数不能实现重载，相同的函数默认会覆盖掉前面的函数 函数的声明会进行一个声明前置的操作 严格模式下，条件语句中进行函数声明会报错 函数内部的变量在本作用域下会进行变量提升的过程 函数的参数默认可省略 函数的赋值过程是赋值引用的过程 多个变量可指向同一个函数 函数属性和方法 name属性：返回函数名 length属性：返回函数预期传入的参数个数，即函数定义之中的参数个数。 toString方法：返回函数的源码。 函数检测 typeof 函数的传参 创客学院 韩老师 WEB前端开发 函数的传参 函数运行，有时需要提供外部数据，不同的外部数据会得到不同的结果，这种外部数据就叫参数 var fn = function(a,b){console.log(a,b)}; fn(