JavaScript函数进阶-调用方式,内部this指向,高阶函数,闭包

    技术2025-01-25  12

    这里写目录标题

    1.函数的定义和调用2.函数的调用方式3.this知识1.函数里this的指向2.改变函数内部this指向1.call()2.apply()3.bind() 4.严格模式1、优点2.应用3.变化1.变量规定2.严格模式下this指向的是undefined3.函数变化 5.高阶函数6.闭包1.变量作用域2.闭包

    1.函数的定义和调用

    函数的声明方式:function 关键字(命名函数)

    function fn(){}

    函数表达式;匿名函数

    var fun=function(){}

    new function (“参数1”,“参数2”,“函数体")所有的函数都是function的实例

    2.函数的调用方式

    普通函数

    //1.普通函数 function fn() { console.log(111); } fn();

    对象方法

    //2.对象方法调用函数 var o = { sayhi: function() { console.log(22); } } o.sayhi();

    构造函数

    function Star() { console.log(33); }; new Star();

    绑定事件函数

    var btn = document.querySelector(“button”); btn.addEventListener(“click”, function() { console.log(44); })

    定时器函数

    //5.定时器函数,事件到了就被调用 setInterval(function() { console.log(55); }, 1000);

    立即执行函数

    //6.立即执行函数 (function() { console.log(66); })();

    3.this知识

    1.函数里this的指向

    调用方式this指向普通函数window构造函数实例对象,原型对象里的方法也指向实例对象构造函数函数该方法所属对象事件绑定函数绑定事件对象定时器函数window立即执行函数window

    2.改变函数内部this指向

    1.call()

    可以调用函数和实现改变函数内部的this的指向还可以实现继承fun.call(thisArg,arg1,arg2),thisArg是指在fun函数运行时指定的this值 //call()可以调用函数和改变函数内部this的指向 function Father(uname, age) { this.uname = uname; this.age = age; } function Son(uname, age) { Father.call(this, uname, age); } var son = new Son("刘德华", 28); console.log(son);

    2.apply()

    可以调用函数和实现改变函数内部的this的指向fun.apply(thisArg,[argsArray])thisArg是指在fun函数运行时指定的this值[argsArray]是指传递的值必须包含在数组里 var o = { name: "ycq" }; function fn(arr) { //普通函数指向的this的window // console.log(this); console.log(arr); } //这里就把this指向对象改成了o fn.apply(o, ["pink"]); var arr = [1, 51, 13, 136]; //Math调用就是指向的math,传递的值就是arr var max = Math.max.apply(Math, arr); console.log(max);

    3.bind()

    不会调用函数,但能改变函数内部this指向fun.bind(thisArg,arg1,arg2,…),一般用var xx来接一下这个函数返回用指定的this值和初始化参数改造的原函数拷贝适用于有的函数不需要立即调用,但是又想改变函数内部的this指向 <button>点击</button> <script> var o = { name: "ycq" }; function fn(x, y) { console.log(this); console.log(x + y); } //不会调用函数,但是可以改变函数内部this的指向 var f = fn.bind(o, 1, 2); f(); //有一个按钮,当点击了之后就禁用,三秒之后在使用 var btn = document.querySelector("button"); btn.addEventListener("click", function() { //点击事件里面的this指向的是btn绑定事件对象 this.disabled = true; //定时器函数里面的this指向的是window setTimeout(function() { btn.disabled = false; }, 3000); }) </script>

    4.严格模式

    1、优点

    消除了js语法中不合理的不严谨之处消除了代码中不安全的地方

    2.应用

    整个脚本中:在的第一行添加上"use strict"个别函数中:放在个别函数的第一行,函数内下边的代码严格执行严格模式,函数外的代码是普通模式执行

    3.变化

    1.变量规定

    严格模式禁止使用一个变量没有声明就赋值,必须先用var赋值之后再使用严格模式严禁用delete 变量删除已经指明的变量

    2.严格模式下this指向的是undefined

    严格模式下,若构造函数不加new调用,this指向undefined时会报错new实例化的构造函数指向创建的实例对象严格模式下定时器里面的this仍然指向window事件、对象里面的函数还是指向调用者

    3.函数变化

    不能有重名的参数不允许在非函数的代码块声明函数 例如:for,if语句带有{}

    5.高阶函数

    高阶函数是指接受函数作为参数或者是将函数作为返回值输出函数可以作为参数进行传递函数也是一种数据类型,同样可以作为参数传递给另一个参数使用,最典型的就是作为回调函数

    6.闭包

    1.变量作用域

    局部变量,函数执行完之后就会被销毁 全局变量

    2.闭包

    闭包是一个函数有权访问另一个函数作用域里面的变量(局部变量)这个函数既如果是内部的,直接调用即可如果是外部的,函数内返回return 函数;在函数外边用var xx=函数();即可 <script> function fn() { var num = 10function fun() { console.log(num); } //这个是相当于内部的闭包 //fun(); //外部的闭包是用return return fun(); } //内部的 //new fn(); //外部的 var f = fn(); </script>
    Processed: 0.011, SQL: 9