js中作用域与函数闭包实例讲解

本文主要和大家分享js中作用域与函数闭包实例,1.作用域很简单,只是简单的点一下,js的作用域没有块级作用域,只有全局作用域与函数作用域;

例如:

if(true){var a=100;}console.log(a);

登录后复制

在java或者c中大括号就是块外边是获取不到的,但是在js中是可以的,就相当于

var a;if(true){a=100;}

登录后复制

这里的a就是全局作用域;凡是在函数外定义的变量都是全局作用域。

特例:

function  Loga(){a=100}console.log(a);

登录后复制

这里的a也是可以获取到的,当在函数内部不带var 就直接声明变量时也是把父作用域当作作用域,但是不建议这么写,一般需要声明定义。

对于函数作用域通过字面理解就是定义在函数内部的变量就是在函数内部起作用;

函数作用域与全局作用域的区别是,函数作用域内可以调用全局作用域的变量并进行修改,但是全局作用域不能调用函数作用域内定义的变量,这里定义很关键(是不是修改),这里涉及到作用域链,就是变量依次可以访问父级作用域的变量,通俗讲就是从内向外可以访问但是从外向内是不可以访问的。

2.闭包

闭包的概念没有一个确切的说法,下面来说一下闭包的使用场景

a.函数作为返回值;

b.函数作为参数传递

例子:

  function F1(){    var a=100return function(){console.log(a);//a是自由变量}}var a=200;var f=F1();f();

登录后复制

       

这是一个典型的闭包案例,返回值f为一个函数,执行环境是全局,但是生成环境是在F1中,这里函数的作用域就是F1,所以输出就是100;这里的a是自由变量,要去父作用域查找,就是F1.

第二中情况,函数作为参数传递

function F1(){var a=100return function(){console.log(a);}}var a=200;var f=F1();function F2(fn){var a=300;fn();}F2(f);

登录后复制

很显然结果是一样的,理由同上,执行环境是F2,但是生成环境是F1,父作用域是F1,所以输出仍为100.

相关推荐:

js中的作用域链和原型链以及原型继承

js中的作用域链和原型链以及原型继承

js中的作用域链和原型链以及原型继承

以上就是js中作用域与函数闭包实例讲解的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2784776.html

(0)
上一篇 2025年3月8日 17:15:24
下一篇 2025年3月8日 17:15:32

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • js执行顺序分析

    JavaScript是一种描述型脚本语言,由浏览器进行动态的解析与执行。函数的定义方式大体有以下两种,浏览器对于不同的方式有不同的解析顺序。本文主要和大家分享js执行顺序分析,希望能帮助到大家。 代码如下:  //“定义式”函数定义 fun…

    编程技术 2025年3月8日
    100
  • js全局和局部变量及运算符知识分享

    一、本文主要和大家分享js全局和局部变量及运算符知识,首先我们先和大家讲解局部变量和全局变量 的相关知识,希望能帮助到大家。 二、局部变量和全局变量 局部变量:在js函数内部声明的变量时局部变量,所以只能在函数内部访问它,即该变量的作用域是…

    编程技术 2025年3月8日
    200
  • js单例模式之创建弹窗实例分享

    一、了解单例模式     单例模式的定义:保证一个类仅有一个实例,并提供一个访问他的全局访问点     单例模式的核心:是确保只有一个实例,并提供全局访问 二、javascript中的单例模式     在js中,我们经常会把全局变量当做单例…

    编程技术 2025年3月8日
    200
  • 用Angularjs+mybatis做出评论系统

    这次给大家带来用angularjs+mybatis做出评论系统,用angularjs+mybatis做评论系统的注意事项有哪些?下面就是实战案例,一起来看一下。 一直想写个评论系统,看了下多说,网易,简书的评论,想了下自己该实现怎样的评论系…

    2025年3月8日
    200
  • js数组去重与去扁平化详解

    本文主要和大家分享js数组去重与去扁平化详解希望能帮助到大家。 数组去重 var arr = [1, 43, 4, 3, 2, 4, 3];  // 去重后    arr = [1, 43, 4, 3, 2] 传统方法,for循环实现 fu…

    编程技术 2025年3月8日
    200
  • Node.js的PEGjs该如何使用

    这次给大家带来node.js的pegjs该如何使用,在node.js中使用pegjs的注意事项有哪些,下面就是实战案例,一起来看一下。 (1)安装pegjs npm install pegjs 登录后复制 (2)grammer.pegjs …

    编程技术 2025年3月8日
    200
  • Vue.JS的自定义指令应该如何使用

    这次给大家带来vue.js的自定义指令应该如何使用,使用vue.js的自定义指令的注意事项有哪些,下面就是实战案例,一起来看一下。 Vue.js 允许你注册自定义指令,实质上是让你教 Vue 一些新技巧:怎样将数据的变化映射到 DOM 的行…

    编程技术 2025年3月8日
    200
  • Immutable.js详解

    这次给大家带来immutable.js详解,使用immutable.js的注意事项有哪些,下面就是实战案例,一起来看一下。 Immutable.js在react + router + redux项目中的应用 先介绍一下Immutable: …

    编程技术 2025年3月8日
    200
  • AngularJS之HelloWorld实例

    本文主要和大家分享angularjs之helloworld实例,希望能帮助到大家。 1、.angular-cli.json {  “$schema”: “./node_modules/@angular/cli/lib/config/sche…

    编程技术 2025年3月8日
    200
  • 前端关于Node.js的面试题

    这次给大家带来前端关于node.js的面试题,面试前端关于node.js岗位有哪些需要注意的,下面就是实战题目,一起来看一下。 【相关推荐:前端面试题(2020)】 如果你希望找一份有关Node.js的工作,但又不知道从哪里入手评测自己对N…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论