JavaScript对象类型之function

news2024/11/25 3:58:49

目录

一、Function

定义函数

调用函数

默认参数

匿名函数

箭头函数

二、函数是对象

三、函数作用域

四、闭包

五、let、var与作用域


一、Function

定义函数

function 函数名(参数) {
    // 函数体
    return 结果;
}

例如:

function add(a, b) {
    return a + b;
}

调用函数

函数名(实参);

例如:

add(1, 2);     // 返回 3

js中的函数调用特点,对参数的类型和个数都没有限制,例如:

add('a', 'b');  // 返回 ab
add(4, 5, 6);   // 返回 9, 第三个参数没有被用到, 不会报错
add(1);			// 返回 NaN, 这时 b 没有定义是 undefined, undefined 做数学运算结果就是 NaN

默认参数

java中(spring)要实现默认参数的效果

@RestController 
public class MyController {
    
    @RequestMapping("/page")
    @ResponseBody
    public void page(
        @RequestParam(defaultValue="1") int page, 
        @RequestParam(defaultValue="10") int size
    ){
        // ...
    }
}

js实现的效果

function pagination(page = 1, size = 10) {
    console.log(page, size);
}

匿名函数

语法:

(function (参数) {
    // 函数体
    return 结果;
})

例如:

(function(a,b){
    return a + b;
})

第一种场景:定义完毕后立刻调用

(function(a,b){
    return a + b;
})(1,2)

第二种场景:作为其他对象的方法,例如:

页面有元素:

<p id="p1">点我啊</p>

此元素有一个onclick方法,会在鼠标单击这个元素后被执行,onclick方法刚开始是null,需要赋值后才能使用

document.getElementById("p1").onclick = (function(){
    console.log("鼠标单击了...");
});

箭头函数

(参数) => {
    // 函数体
    return 结果;
}
  • 如果没有参数,() 还是要保留

  • 如果只有一个参数,() 可以省略

  • 如果函数体内只有一行代码,{} 可以省略

  • 如果这一行代码就是结果,return 可以省略

例如:

document.getElementById("p1").onclick = () =>  console.log("aa");

二、函数是对象

1、可以参与赋值,例如,匿名函数也能参与赋值

function abc() {
    console.log("bb");
}

document.getElementById("p1").onclick = abc;

2、有属性、有方法,执行console.dir(abc),输出结果如下:

ƒ abc()
    arguments: null
    caller: null
    length: 0
    name: "abc"
    ➡prototype: {constructor: ƒ}
    [[FunctionLocation]]: VM1962:1
    ➡[[Prototype]]: ƒ ()
    ➡[[Scopes]]: Scopes[1]
  • 其中带有 f 标记的是方法,不带的是属性

  • 带有 ➡ 符号的可以继续展开,限于篇幅省略了

  • 带有 [[ ]] 的是内置属性,不能访问,只能查看

  • 相对重要的是 [[Prototype]][[Scopes]] 会在后面继承和作用域时讲到

3、可作为方法参数

function a() {
    console.log('a')
}

function b(fn) {          // fn 将来可以是一个函数对象
    console.log('b')
    fn();                 // 调用函数对象
}

b(a)

4、可作为方法返回值

function c() {
    console.log("c");
    function d() {
        console.log("d");
    }
    return d;
}

c()()

三、函数作用域

函数可以嵌套(js代码很常见,只是嵌套形式很多时匿名函数,箭头函数)

function a() {
    function b() {        
    }
}

例如:

function c() {
    var z = 30;
}

var x = 10;
function a() {
    var y = 20;
    function b() {
        // 看这里
        console.log(x, y);
    }
    b();
}
a();
  • 以函数为分界线划定作用域,所有函数之外是全局作用域

  • 查找变量时,由内向外查找

    • 在内层作用域找到变量,就会停止查找,不会再找外层

    • 所有作用域都找不到变量,报错

  • 作用域本质上是函数对象的属性,可以通过 console.dir 来查看调试

四、闭包

var x = 10;
function a() {
    var y = 20;
    function b() {
        console.log(x,y);
    }
    return b;
}
a()();  // 在外面执行了 b
  • 函数定义时,它的作用域已经确定好了,因此无论函数将来去了哪,都能从它的作用域中找到当时那些变量

  • 别被概念忽悠了,闭包就是指函数能够访问自己的作用域中变量

五、let、var与作用域

如果函数外层引用的是let变量,那么外层普遍的{}也会作为作用于边界,最外层的let也占一个script作用域

let x = 10; 
if(true) {
    let y = 20;
    function b() {
        console.log(x,y);
    }
    console.dir(b);
}

如果函数外层引用的是var变量,外层普遍的{}不会视为边界

var x = 10; 
if(true) {
    var y = 20;
    function b() {
        console.log(x,y);
    }
    console.dir(b);
}

如果var变量出现了重名,则他俩会被视为同一作用域中的同一变量

var e = 10; 
if(true) {
    var e = 20;
    console.log(e);	// 打印 20
}
console.log(e);		// 因为是同一个变量,还是打印 20

如果是let,则视为两个作用域中的两个变量

let e = 10; 
if(true) {
    let e = 20;	
    console.log(e);	// 打印 20
}
console.log(e);		// 打印 10

要想里面的e和外面的e能区分开来,最简单的办法是改成let,或者用函数来界定作用域范围

var e = 10; 
if(true) {
    function b() {
        var e = 20;
    	console.log(e);
    }
    b();
}
console.log(e);	

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/425141.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

应届生通过Java培训班转行IT有前途吗?

借用邓小平同志曾说过的一句话&#xff1a;科学技术是第一生产力。IT行业作为科技行业中的一员&#xff0c;不管是在自身的发展&#xff0c;还是支持其他行业的发展中都扮演了不可或缺的角色&#xff0c;“互联网”是社会发展的趋势&#xff0c;前途是无限的。而计算机语言是目…

dolphinscheduler之hivecli 任务

hivecli 任务 Hivecli任务说明 dolphinscheduler的hivecli任务是专门执行hivesql的任务类型。其中子类型分为FROM_SCRIPT和FROM_FILE。 FROM_SCRIPT 执行的脚本可以直接在文本框中编写 执行的底层采用-e参数执行 hive -e "show databases;show tables"FROM_FILE…

建造者模式解读

目录 话题引进 传统方式解决盖房需求 传统方式的问题分析 建造者模式基本介绍 基本介绍 四个角色 原理类图 ​编辑 应用实例 改进代码 建造者模式在 JDK 的应用和源码分析 建造者模式的注意事项和细节 抽象工厂模式 VS 建造者模式 话题引进 1) 需要建房子&#xff1a;…

剑指 Offer (第 2 版)

&#xff08;简单&#xff09;剑指 Offer 03. 数组中重复的数字 找出数组中重复的数字。 在一个长度为 n 的数组 nums 里的所有数字都在 0&#xff5e;n-1 的范围内。数组中某些数字是重复的&#xff0c;但不知道有几个数字重复了&#xff0c;也不知道每个数字重复了几次。请…

Python实现采集某二手房源数据并做数据可视化展示

目录环境介绍&#xff1a;模块使用:实现爬虫思路&#xff1a;代码环境介绍&#xff1a; Python 3.8Pycharm 模块使用: requests >>> pip install requests 数据请求模块 parsel >>> pip install parsel 数据解析模块 csv 内置模块 实现爬虫思路&#x…

如何搭建自己的V Rising自建服务器,以及常见的V Rising服务器问题解决方案

V rising官方服务器经常无法连接&#xff0c;无法和小伙伴玩耍&#xff1b;如何搭建自己的V rising服务器呢&#xff1f;还可以修改掉落倍率&#xff0c;加快游戏进度&#xff0c;搭建自己的私人服务器。 前言 最近V rising这个游戏很火呀&#xff0c;迫不及待地和小伙伴一起…

基于粒子群优化算法的面向综合能源园区的三方市场主体非合作交易方法(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

【JSP学习笔记】4.JSP 隐式对象及客户端请求

前言 本章介绍JSP的隐式对象及客户端请求。 JSP 隐式对象 JSP隐式对象是JSP容器为每个页面提供的Java对象&#xff0c;开发者可以直接使用它们而不用显式声明。JSP隐式对象也被称为预定义变量。 JSP所支持的九大隐式对象&#xff1a; 对象描述requestHttpServletRequest 接…

一文吃透Arthas常用命令!

Arthas 常用命令 简介 Arthas 是Alibaba开源的Java诊断工具&#xff0c;动态跟踪Java代码&#xff1b;实时监控JVM状态&#xff0c;可以在不中断程序执行的情况下轻松完成JVM相关问题排查工作 。支持JDK 6&#xff0c;支持Linux/Mac/Windows。这个工具真的很好用&#xff0c;…

【C++】模板进阶--非类型模板参数模板特化及分离编译

文章目录一、非类型模板参数二、模板的特化1.模板特化的概念2.函数模板的特化3.类模板的特化3.1 全特化3.2 偏特化4.类模板特化应用示例三、模板的分离编译四、模板总结一、非类型模板参数 模板参数分为类型形参与非类型形参&#xff0c;其中&#xff0c;类型形参即出现在模板…

MBD-PMSM闭环控制模型(FOC算法)

目录 前面 Speed_and_Position_Estimator 获取HALL信号 HALL状态更新 计算转速 位置判断 ADC相电流/总线电流电压 获取AD值 计算实际值 低速高速切换 SlowLoopControl FastLoopControl 最后 前面 前面分析了BLDC的开环与闭环&#xff0c;接下来分析PMSM或者说FOC…

MySQL 异步复制、半同步复制、增强半同步复制(史上最全)

背景&#xff1a;来自于小伙伴问题 小伙伴的难题&#xff1a; mysql主从同步的时候&#xff0c;半同步和增强半同步是怎样的一个概念&#xff0c;我看网上说的有点不明不白的&#xff0c;也没找到合适的解释。 这里尼恩给大家做一下系统化、体系化的梳理。也一并把这个题目以…

【每天学习一点点】RocketMQ的架构、写数据、高效的数据查询索引、负载均衡

Rocket一、学习目标二、RocketMQ的架构运行图2.1、NameServer2.1.1 为什么需要NameServer2.1.1.1 不可以没有nameserver吗&#xff1f;2.1.2 NameServer需要单独部署吗2.1.3 Nameserver可以动态注册和注销Broker、Topic和Consume 是什么意思2.1.4 可以使用nacos的配置中心替代N…

成本与体验的“非零和博弈”

随着移动互联网和智能终端的普及&#xff0c;越来越多的海内外互联网企业开始发力短视频业务。在短视频用户全球化&#xff0c;短视频产品及内容消费井喷式增长的今天&#xff0c;用户开始逐渐对体验有了越来越高的要求。为了更清晰更流畅地播放&#xff0c;用户播放成本也随着…

TensorFlow GPU不可用,WSL2安装

这个帖子写给23年刚买电脑、系统是win11&#xff0c;tensorflow版本是2.10以上的兄弟们。不符合的可以去看其他答案了。 这是以我三天来的安装经历来写的&#xff0c;希望能给后来的兄弟们减少时间的浪费。 win11&#xff0c;安装的tensorflow的版本都是2.12的&#xff0c;但…

(二)Cmd Markdown 编辑阅读器的使用效果 | 以 Cmd Markdown 编辑阅读器为例

Cmd Markdown 编辑阅读器使用指南 &#xff08;一&#xff09;Cmd Markdown 编辑阅读器的使用示例 | 以 Cmd Markdown 编辑阅读器为例&#xff08;二&#xff09;Cmd Markdown 编辑阅读器的使用效果 | 以 Cmd Markdown 编辑阅读器为例 在 Cmd Markdown 编辑阅读器&#xff08; …

C语言实现Allan方差计算

Allan方差专有概念解释 1.量化噪声 量化噪声是一切量化操作所固有的噪声,只要进行数字量化编码采样,传感器输出的理想值与量化值之间就必然会存在微小的差别,量化噪声代表了传感器检测的最小分辨率水平。 2.角度随机游走 角度随机游走是宽带角速率白噪声积分的结果,即陀螺…

金三银四,大伙冲刺,SpringCloud 的 25 个面试考点

今天给大家分享SpringCloud高频面试题。 Spring Cloud核心知识总结 下面是一张Spring Cloud核心组件关系图&#xff1a; 从这张图中&#xff0c;其实我们是可以获取很多信息的&#xff0c;希望大家细细品尝。 话不多说&#xff0c;我们直接开始 Spring Cloud 连环炮。 连环炮…

直播协议:RTSP、RTP、RTCP、RTMP、HLS

流媒体传输一般采用HTTP/TCP(RTCP)协议来传输控制信息&#xff0c;而用UDP(RTP)协议来传输实时媒体数据&#xff08;TCP开销相对较大&#xff0c;所以不太适合传输实时数据&#xff09;。 流媒体传输一般都是采用建立在UDP协议上的RTP/RTSP等实时传输协议。为何要在UDP而不在T…

Spring事务:事务的基础 以及使用

目录 GTP前言 一、关于事务 1.事务的四大特性ACID 2.脏读、不可重复读、幻读 ① 脏读 ② 不可重复读 ③ 幻读 3.事务的隔离级别 4.事务的传播机制 ① Propagation.REQUIRED 默认 ② Propagation.SUPPORTS ③ Propagation.MANDATORY ④ Propagation.REQUIRES_NEW ⑤…