JavaScript 作用域实例分析


Posted in Javascript onOctober 02, 2019

本文实例讲述了JavaScript 作用域。分享给大家供大家参考,具体如下:

JavaScript  作用域

1. JavaScript 以函数作为作用域

JavaScript: 以函数做为作用域

function func(){
  if(1==1){
    var name = 'xsk'
  }
  console.log(name);
}
func()

2. 函数作用域在函数未被调用之前,已经创建

JavaScript:函数作用域提前创建

function func(){
  if(1==1){
    var name = 'xsk'
  }
  console.log(name);
}

3. 函数的作用域在作用域链,并且也是在被调用之前创建

JavaScript:作用域链提前创建

示例一:

xo = "xsk";
function func(){
  var xo = "miy"
  function inner(){
    var xo = "nn"
    console.log(xo)
  }
  inner()
}
func()
// 输出 nn

示例二:

xo = "xsk";
function func(){
  var xo = "miy"
  function inner(){
    console.log(xo)
  }
  return inner;
}
var ret = func()
// 输出miy
// ret 相当于 inner()函数

示例三:

xo = "xsk";
function func(){
  var xo = "miy"
  function inner(){
    console.log(xo)
  }
  var xo = "tony"
  return inner;
}
var ret = func()
ret()
// 输出tony

:作用域嵌套作用域被称为作用域链。

:查找变量会优先在本地作用域找,没有在跳到下一级。

4. 函数内局部变量提前声明

JavaScript:函数局部变量提前声明

示例一:

function func(){
  console.log(xxoo);
}
func();
// 报错

示例二:

function func(){
  console.log(xxoo);
  var xxoo = 'xsk'
}
func();
// 输出 undefined
// 函数执行顺序,谁在前面谁执行

(1)、JavaScript 当创建一个函数时,会自动生动生成作用域链。

(2)、生成作用域的同时会找到所有的局部变量提前声明。(var 变量名)

(3)、为赋值的局部变量默认为undefined。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
再说AutoComplete自动补全之实现原理
Nov 05 Javascript
JavaScript使用cookie记录临时访客信息的方法
Apr 07 Javascript
fastclick插件导致日期(input[type="date"])控件无法被触发该如何解决
Nov 09 Javascript
js数组常用最重要的方法
Feb 04 Javascript
在vscode中统一vue编码风格的方法
Feb 22 Javascript
如何把vuejs打包出来的文件整合到springboot里
Jul 26 Javascript
原生js实现form表单序列化的方法
Aug 02 Javascript
Node.js 如何利用异步提升任务处理速度
Jan 07 Javascript
从0到1构建vueSSR项目之路由的构建
Mar 07 Javascript
JavaScript实现简单的图片切换功能(实例代码)
Apr 10 Javascript
封装Vue Element的table表格组件的示例详解
Aug 19 Javascript
TypeScript中条件类型精读与实践记录
Oct 05 Javascript
JavaScript Dom 绑定事件操作实例详解
Oct 02 #Javascript
JavaScript 面向对象基础简单示例
Oct 02 #Javascript
Nautil 中使用双向数据绑定的实现
Oct 02 #Javascript
详解element-ui级联菜单(城市三级联动菜单)和回显问题
Oct 02 #Javascript
基于iview-admin实现动态路由的示例代码
Oct 02 #Javascript
你不可不知的Vue.js列表渲染详解
Oct 01 #Javascript
基于VUE的v-charts的曲线显示功能
Oct 01 #Javascript
You might like
基于PHP 面向对象之成员方法详解
2013/05/04 PHP
CI框架中libraries,helpers,hooks文件夹详细说明
2014/06/10 PHP
分享PHP源码批量抓取远程网页图片并保存到本地的实现方法
2015/12/01 PHP
symfony2.4的twig中date用法分析
2016/03/18 PHP
PHP+swoole+linux实现系统监控和性能优化操作示例
2019/04/15 PHP
php解决安全问题的方法实例
2019/09/19 PHP
去除链接虚线全面分析总结
2006/08/15 Javascript
番茄的表单验证类代码修改版
2008/07/18 Javascript
实现变速回到顶部的JavaScript代码
2011/05/09 Javascript
禁止你的左键复制实用技巧
2013/01/04 Javascript
点击A元素触发B元素的事件在IE8下会识别成A元素
2014/09/04 Javascript
jQuery Ajax中的事件详细介绍
2015/04/16 Javascript
JavaScript数组对象实现增加一个返回随机元素的方法
2015/07/27 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
2016/10/26 Javascript
使用Promise链式调用解决多个异步回调的问题
2017/01/15 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
2020/01/18 Javascript
[04:19]DOTA2亚洲邀请赛 现场花絮
2015/03/11 DOTA
[48:32]2018DOTA2亚洲邀请赛 3.31 小组赛 A组 LGD vs VG
2018/04/01 DOTA
简单文件操作python 修改文件指定行的方法
2013/05/15 Python
python爬虫获取淘宝天猫商品详细参数
2020/06/23 Python
Python字符串处理的8招秘籍(小结)
2019/08/13 Python
Python使用微信接入图灵机器人过程解析
2019/11/04 Python
python导入库的具体方法
2020/06/18 Python
Python计算信息熵实例
2020/06/18 Python
h5实现获取用户地理定位的实例代码
2017/07/17 HTML / CSS
Ralph Lauren英国官方网站:Ralph Lauren UK
2018/04/03 全球购物
国际商务专业学生个人的自我评价
2013/09/28 职场文书
大学生水果店创业计划书
2014/01/28 职场文书
初中美术教学反思
2014/01/29 职场文书
任命书格式
2014/06/05 职场文书
节电标语大全
2014/06/23 职场文书
学雷锋标语
2014/06/25 职场文书
学习党的群众路线实践活动思想汇报
2014/09/12 职场文书
《亲亲我的妈妈》观后感(3篇)
2019/09/26 职场文书
十大最强岩石系宝可梦,怪颚龙实力最强,第七破坏力很强
2022/03/18 日漫
详解Golang如何实现支持随机删除元素的堆
2022/09/23 Python