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 相关文章推荐
锋利的jQuery 要点归纳(一) jQuery选择器
Mar 21 Javascript
jquery.validate使用时遇到的问题
May 25 Javascript
深入解析Javascript闭包的功能及实现方法
Jul 10 Javascript
jQuery继承extend用法详解
Oct 10 Javascript
Webpack如何引入bootstrap的方法
Jun 17 Javascript
Redux 和 Mobx的选择问题:让你不再困惑!
Sep 18 Javascript
浅谈vue路径优化之resolve
Oct 13 Javascript
vue + vuex todolist的实现示例代码
Mar 09 Javascript
微信小程序页面间传值与页面取值操作实例分析
Apr 30 Javascript
vue中input的v-model清空操作
Sep 06 Javascript
微信小程序获取当前位置和城市名
Nov 13 Javascript
javascript设计模式 ? 享元模式原理与用法实例分析
Apr 15 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压缩html网页代码(清除空格,换行符,制表符,注释标记)
2012/04/02 PHP
PHP 获取 ping 时间的实现方法
2017/09/29 PHP
js下用层来实现select的title提示属性
2010/02/23 Javascript
关于jquery.validate1.9.0前台验证的使用介绍
2013/04/26 Javascript
基于jquery插件实现常见的幻灯片效果
2013/11/01 Javascript
JS动态增加删除UL节点LI及相关内容示例
2014/05/21 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
2016/06/20 Javascript
利用JS提交表单的几种方法和验证(必看篇)
2016/09/17 Javascript
js实现百度地图定位于地址逆解析,显示自己当前的地理位置
2016/12/08 Javascript
nodejs获取微信小程序带参数二维码实现代码
2017/04/12 NodeJs
基于Cookie常用操作以及属性介绍
2017/09/07 Javascript
node(koa2) web应用模块介绍详解
2019/03/29 Javascript
Vue.js递归组件实现组织架构树和选人功能案例分析
2019/07/03 Javascript
详细介绍解决vue和jsp结合的方法
2020/02/06 Javascript
vue总线机制(bus)知识点详解
2020/05/10 Javascript
vue动态加载SVG文件并修改节点数据的操作代码
2020/08/17 Javascript
[01:25]DOTA2自定义游戏灵园鬼域等你踏足
2015/10/30 DOTA
[00:48]食人魔魔法师至宝“金鹏之幸”全新模型和自定义特效展示
2019/12/19 DOTA
Python中decorator使用实例
2015/04/14 Python
python获取外网IP并发邮件的实现方法
2017/10/01 Python
python2.7实现爬虫网页数据
2018/05/25 Python
使用python根据端口号关闭进程的方法
2018/11/06 Python
pygame游戏之旅 按钮上添加文字的方法
2018/11/21 Python
python实现二维数组的对角线遍历
2019/03/02 Python
python super用法及原理详解
2020/01/20 Python
Python matplotlib画图时图例说明(legend)放到图像外侧详解
2020/05/16 Python
Python基于正则表达式实现计算器功能
2020/07/13 Python
Selenium+BeautifulSoup+json获取Script标签内的json数据
2020/12/07 Python
基于HTML5的WebSocket的实例代码
2018/08/15 HTML / CSS
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
Currentbody德国站:健康与美容技术专家
2020/04/05 全球购物
FragranceNet中文网:北美健康美容线上零售商
2020/08/26 全球购物
运动会开幕式解说词
2014/02/05 职场文书
研究生导师评语
2014/12/31 职场文书
html5移动端禁止长按图片保存的实现
2021/04/20 HTML / CSS
MySQL慢查询中的commit慢和binlog中慢事务的区别
2022/06/16 MySQL