ES6学习函数(四)

news/2024/12/23 20:38:53 标签: es6, 学习, javascript

这里写目录标题

  • 一、带参数默认值的函数
  • 二、rest参数
  • 三、箭头函数
    • 一、箭头函数
    • 二、箭头函数的作用
      • 2.1、使表达更加简洁
      • 2.2、简化回调函数
    • 三、箭头函数使用注意点
      • 3.1、没有this绑定
      • 3.2、箭头函数中没有arguments对象
      • 3.3、箭头函数不能使用new关键字来实例化对象

一、带参数默认值的函数

ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。

        function log(x,y){
            y=y||'World';//y如果没有值则赋值World
            console.log(x,y);
            
        }
        log('Hello');//hello world

ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面。

        function log(x,y='World'){
            console.log(x,y);
        }
        log('Hello');//hello world

默认的表达式可以是一个函数

        function getVal(val){
            return val+5;
        }

        function add2(a,b=getVal(5)){
            return a+b;
        }
        console.log(add2(5));
        //console.log(add2(5,20));

二、rest参数

ES6 引入 rest 参数(形式为…变量名),称为剩余参数或可变参数。它允许函数接收不定数量的参数,这些多余的参数会被收集到一个数组中,使得处理多个参数变得更加简洁和易于维护。‌

        function add(...values) {
        	let sum = 0;
        	for (var val of values) {
            	sum += val;
        	}
        	return sum;
        }
        console.log(add(1,2,3,4)) // 10

三、箭头函数

一、箭头函数

ES6允许使用箭头=>定义函数

	let f = x=>x;
	//等同于
	let f = function(x){
	    return x;
	}

	// 有一个参数
	let add = value => value;

	// 有两个参数
	let add = (value,value2) => value + value2;
	
	let add = (value1,value2)=>{
	    
	    return value1 + value2;
	} 
	// 无参数
	let fn = () => "hello world";

	let doThing = () => {
	
	}
	//如果箭头函数直接返回一个对象,必须在对象外面加上括号,否则会报错。
	let getId = id => ({id: id,name: 'mjj'}) //注意
	let obj = getId(1);

二、箭头函数的作用

2.1、使表达更加简洁

	const isEven = n => n % 2 == 0;
	const square = n => n * n;

2.2、简化回调函数

	// 正常函数写法
	[1,2,3].map(function (x) {
	  return x * x;
	});
	
	// 箭头函数写法
	[1,2,3].map(x => x * x);

三、箭头函数使用注意点

3.1、没有this绑定

        //点击打印事件
        let PageHandler = {
            id: 123,
            init: function () {
                // 使用bind来改变内部函数this的指向
                document.addEventListener('click', function (event) {
                    this.doSomeThings(event.type);
                }.bind(this), false);
            },
            doSomeThings: function (type) {
                console.log(`事件类型:${type},当前id:${this.id}`);
            }
        }
        PageHandler.init();
        let PageHandler = {
            id: 123,
            init: function () {
                // 箭头函数没有this的指向,箭头函数内部的this值只能通过查找作用域链来确定

                // 如果箭头函数被一个非箭头函数所包括,那么this的值与该函数的所属对象相等,否则 则是全局的window对象
                document.addEventListener('click', (event) => {
                    console.log(this);
                    this.doSomeThings(event.type);
                }, false);
            },
            doSomeThings: function (type) {
                console.log(`事件类型:${type},当前id:${this.id}`);
            }
        }
        PageHandler.init();

3.2、箭头函数中没有arguments对象

        var getVal = (a, b) => {
            console.log(arguments);
            return a + b;
        }
        console.log(getVal(1, 2)); //arguments is not defined
        //这些写就不存在问题
        function getVal(a,b){
            console.log(arguments);
            return a + b;
        }

arguments 内置对象:在 JavaScript 的 每个函数 的 内部都可以访问 内置的 arguments 对象 ,

3.3、箭头函数不能使用new关键字来实例化对象

      let Person = ()=>{}
      let p1 = new Person();// Person is not a constructor

http://www.niftyadmin.cn/n/5796973.html

相关文章

c++---------数据类型

基本数据类型 整数类型(Integral Types) int(整型) 这是最常用的整数类型,通常用于存储一般范围的整数值。在32位系统中,int类型一般占用4个字节,取值范围大约是 - 2147483648到2147483647。例如…

Cmd命令大全(万字详细版)

1. 常用命令 1.1 cd命令 //进入d盘 D: //进入F盘 F: cd /? //获取使用帮助cd \ //跳转到硬盘的根目录cd C:\WINDOWS //跳转到当前硬盘的其他文件d: //跳转到其他硬盘cd /d e:\software //跳转到其他硬盘的其他文件夹,注意此处必须加/d参数。…

瑞吉外卖项目学习笔记(四)@TableField(fill = FieldFill.INSERT)公共字段填充、启用/禁用/修改员工信息

瑞吉外卖项目学习笔记(一)准备工作、员工登录功能实现 瑞吉外卖项目学习笔记(二)Swagger、logback、表单校验和参数打印功能的实现 瑞吉外卖项目学习笔记(三)过滤器实现登录校验、添加员工、分页查询员工信息 文章目录 7 修改员工信息7.1 启用/禁用员工账号7.1.1 需求梳理7.1.2…

vscode怎么设置anaconda python解释器(anaconda解释器、vscode解释器)

文章目录 先在ananconda prompt里创建并激活了虚拟环境,然后执行where python,显示的第一个就是这个虚拟环境python解释器路径:然后我们可以在vscode里添加这个python解释器: 先在ananconda prompt里创建并激活了虚拟环境&#xf…

【从零开始入门unity游戏开发之——C#篇25】C#面向对象动态多态——virtual、override 和 base 关键字、抽象类和抽象方法

文章目录 多态多态的主要类型 一、virtual、override 和 base 关键字1、**virtual 关键字** (虚方法)2、**override 关键字** (重写)3、**base 关键字** (基类访问)4、总结: 二、抽象类和抽象方法1、抽象类1.1 什么是抽象类1.2 定义和使用抽象类 2、抽象方法2.1 什么…

python报错系列(16)--pyinstaller ????????

系列文章目录 文章目录 系列文章目录前言一、pyinstaller ????????1.报错如下2.安装pyinstaller3.报错如下:4.封装py文件为exe成功5.国内源 总结 前言 一、pyinstaller ??? 1.报错如下 PS D:\Users\gxcaoty\Desktop\性能覆盖率> pyinstaller37.exe…

远程过程调用(RPC,Remote Procedure Call)是一种协议

远程过程调用(RPC,Remote Procedure Call)是一种协议,允许程序在不同的计算机上执行代码,就像调用本地函数一样。在Python中,有几种常见的RPC框架和库可以用来实现远程过程调用。 以下是一些常用的Python …

Pytorch | 从零构建ParNet/Non-Deep Networks对CIFAR10进行分类

Pytorch | 从零构建ParNet/Non-Deep Networks对CIFAR10进行分类 CIFAR10数据集ParNet架构特点优势应用 ParNet结构代码详解结构代码代码详解SSEParNetBlock 类DownsamplingBlock 类FusionBlock 类ParNet 类 训练过程和测试结果代码汇总parnet.pytrain.pytest.py 前面文章我们构…