我的编程空间,编程开发者的网络收藏夹
学习永远不晚

JavaScript预解析及相关技巧有哪些

短信预约 -IT技能 免费直播动态提醒
省份

北京

  • 北京
  • 上海
  • 天津
  • 重庆
  • 河北
  • 山东
  • 辽宁
  • 黑龙江
  • 吉林
  • 甘肃
  • 青海
  • 河南
  • 江苏
  • 湖北
  • 湖南
  • 江西
  • 浙江
  • 广东
  • 云南
  • 福建
  • 海南
  • 山西
  • 四川
  • 陕西
  • 贵州
  • 安徽
  • 广西
  • 内蒙
  • 西藏
  • 新疆
  • 宁夏
  • 兵团
手机号立即预约

请填写图片验证码后获取短信验证码

看不清楚,换张图片

免费获取短信验证码

JavaScript预解析及相关技巧有哪些

这篇文章主要介绍了JavaScript预解析及相关技巧有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript预解析及相关技巧有哪些文章都会有所收获,下面我们一起来看看吧。

变量

同样,以这两个小例子的错误对比提示开始。

alert(y1);     //代码段1var y1 = 'dddd';alert(y2);     //代码段2 // alert(typeof y2);y2 = 'xxxxx';

先思考一下,为什么一个会提示 undefined , 一个却抛出变量未定义的错。。先看JavaScript的解析过程。

javascript在执行过程之前,会做一件事件“预解析”。解析引擎会以块为单位级别,执行所有 var 变量的创建,并赐予它们一个初始值:undefined。这样一来,第一个例子为什么会弹出undefined的原因就显而易见了。

所以第一段代码其实就等价于

var y1;alert(typeof y1); //很自然,它此时值为undefinedy1 = 'dddd';

那第二段代码为什么又抛错呢,此时就不再属于“预解析”阶段了,(在这里我假设浏览器遇到一个script标签时只做两件事:预解析和执行,其实不 只这两件事情),而处于执行阶段,抛错原因在于js在执行段状态并不知晓y2的状态(预解析阶段没有捕获到y2的任何信息),当然就抛出未定义的错误信 息。这里又牵扯到另一个问题: js 是弱类型语言,变量不定义可以用,那为什么这里又抛出为定义错误呢。

事出总有因,javascript总有很多自身奇怪的特性,有一个叫变量的读写不均等。未定义的变量,仅仅是可写,并不可读。何为可写,每个人都熟悉这样的写法:

y2 = 'exam';  //在没出现它的定义操作之前(即在它还没有自己的scope之前)该操作会将这段代码认为是定义一个全局变量,在window上注册一个属性y2,并赋值为exam

但在对它的读操作,js引擎搜寻不到它的任何相关信息,就以自己的脾气行事,毫不客气抛一个未定义的错,这是js的游戏规则。还有但是,那为什么却 可以获取它的类型呢。还记得 js对对象的操作吧。如果访问对象一个不存在的属性及类型,会提示undefined, (因为它当前是window对象的一个属性)。

再注:这里需要区分, 变量的读写不均等 仅用于变量,读取所有对象的属性,不存在该特性,如果不存在,会提示undefined。

结论

到这里,我的思考结果: 对于变量和对象的写操作,他们有一定的类似之处.但是读操作,各有各的一套规则,正因为此,所以有了上面的问题。
这样一来,下面这个题应该就很容易得到答案了吧。

if (!('a' in window)) {  var a = 1;}alert(a);

函数

引申一下,function. 还记得上面提到的预解析,在javascript的预解析中,除了对var 变量的预定义,还包括了提取对函数的定义,所以可以在script的任何地方定义函数,在任何地方调用。不限于它之前.

但函数的定义方式,包括了一种叫字面量定义法, 用var的方法声明function.看下面

alert(typeof y3); //结果?var y3 = function (){ console.log('1'); }

还记得这个约定吧:调用必须出现在声明之后,为什么呢,如果理解了上面,其实这里答案已经明了。javascript 引擎在预解析 var 时 会给他们一个初始值 undefined,这样一来,如果我们在它的声明之前调用它,javascript 引擎还没拿到它的真实值,自然会报"xxx is not a function" 的错.这也理清了为什么同为函数声明,一个却关系到声明和调用的顺序,一个却无这样的约束。

结论

它是函数,是js执行,动态修改的结果,依然遵循了变量的预解析规则(在上面alert的时候,它还并没有拿到字面量函数的信息)。
如果是两个混合呢。看下面, 同时存在了为y4的变量和function。

alert(typeof y4); //结果?function y4(){  console.log('y4')}var y4;

因为 javascript 在预解析时function的声明优先级高的缘故,所以y4自然为function类型, 但是在当y4 赋值之后(此时js引擎处于执行过程中),它对js的赋值操作将会覆盖function的声明。所以:

alert(typeof y5);var y5 = 'angle';function y5(){  console.log('ghost');  }alert(y5);

第一次alert结果,因为它处于js 执行过程中的顶端,所以为 function。 第二次再alert时, 它的值已经被重写为5(不要被function的定义位置在下所迷惑。)

从js的解析和执行分开来想,才发现眼前豁然开朗,很多问题的答案都很自然得浮出水面,正如那篇文章作者所说,"一旦理解了执行环境、调用对象、闭包、词法作用域、作用域链这些概念,JS语言的很多现象都能迎刃而解。"

现在再看,即使在这个存在着很多不可思议的语言中,也有很多可以追溯到它的缘由。

如何更好的做参数判断

讨论了上面那么多,那如何让它更贴近于实际开发呢,既然javascript的读写不均等性,如何才能避免在不报错的情况下做参数判断呢。

eg:

if(cusVar){ //这里的判断,是不是存在隐含的问题呢。 }

如何严谨一些呢。

if(window['cusVar']) { //保证它不报错。  //或者这样的判断也是可行的 window.cusVar | typeof cusVar !== 'undefined'  //干活咯}

最后补充又一个小quiz, (理解 预解析与执行的分离)

var y7 = 'test';function fun1(){  alert(y7);  var y7 = 'sex';}fun1();

关于“JavaScript预解析及相关技巧有哪些”这篇文章的内容就介绍到这里,感谢各位的阅读!相信大家对“JavaScript预解析及相关技巧有哪些”知识都有一定的了解,大家如果还想学习更多知识,欢迎关注编程网行业资讯频道。

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

JavaScript预解析及相关技巧有哪些

下载Word文档到电脑,方便收藏和打印~

下载Word文档

猜你喜欢

JavaScript预解析及相关技巧有哪些

这篇文章主要介绍了JavaScript预解析及相关技巧有哪些的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JavaScript预解析及相关技巧有哪些文章都会有所收获,下面我们一起来看看吧。变量同样,以这两个小例
2023-07-04

Visual Studio调试的相关技巧有哪些

本篇内容介绍了“Visual Studio调试的相关技巧有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!我的IIS明显打开的!在CPU1
2023-06-17

JavaScript字节二进制及相关API有哪些

本文小编为大家详细介绍“JavaScript字节二进制及相关API有哪些”,内容详细,步骤清晰,细节处理妥当,希望这篇“JavaScript字节二进制及相关API有哪些”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧
2023-07-05

.Net Framework数组的相关操作技巧有哪些

本篇内容主要讲解“.Net Framework数组的相关操作技巧有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“.Net Framework数组的相关操作技巧有哪些”吧!.Net Frame
2023-06-17

windows service运行Python相关操作技巧有哪些

这篇文章主要为大家展示了“windows service运行Python相关操作技巧有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“windows service运行Python相关操作技巧
2023-06-17

linux Shell中网络相关命令的使用技巧有哪些

这篇文章主要介绍linux Shell中网络相关命令的使用技巧有哪些,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!ifconfig这个命令与Windows的“ipconfig”作用一致,用于显示网络接口,子网掩码等详
2023-06-16

软考系统分析师案例分析题解题技巧有哪些

软考系统分析师案例分析题是考试中的重要组成部分,它不仅考察考生的理论知识,还考察其分析问题和解决问题的能力。软考系统分析师案例分析题解题技巧有哪些?具体请见下文。

软考案例分析题有哪些解题技巧和方法

软考中的案例分析题是考察考生综合运用所学知识解决实际问题能力的重要题型。这类题目通常要求考生根据给定的案例背景,分析问题、提出解决方案,并展示自己的逻辑思维和专业能力。具体请见下文。
软考案例分析题有哪些解题技巧和方法
2024-09-13

解析提高PHP执行效率的50个技巧分别有哪些

解析提高PHP执行效率的50个技巧分别有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。1、用单引号代替双引号来包含字符串,这样做会更快一些。因为PHP会在双引号包围的字
2023-06-17

编程热搜

  • Python 学习之路 - Python
    一、安装Python34Windows在Python官网(https://www.python.org/downloads/)下载安装包并安装。Python的默认安装路径是:C:\Python34配置环境变量:【右键计算机】--》【属性】-
    Python 学习之路 - Python
  • chatgpt的中文全称是什么
    chatgpt的中文全称是生成型预训练变换模型。ChatGPT是什么ChatGPT是美国人工智能研究实验室OpenAI开发的一种全新聊天机器人模型,它能够通过学习和理解人类的语言来进行对话,还能根据聊天的上下文进行互动,并协助人类完成一系列
    chatgpt的中文全称是什么
  • C/C++中extern函数使用详解
  • C/C++可变参数的使用
    可变参数的使用方法远远不止以下几种,不过在C,C++中使用可变参数时要小心,在使用printf()等函数时传入的参数个数一定不能比前面的格式化字符串中的’%’符号个数少,否则会产生访问越界,运气不好的话还会导致程序崩溃
    C/C++可变参数的使用
  • css样式文件该放在哪里
  • php中数组下标必须是连续的吗
  • Python 3 教程
    Python 3 教程 Python 的 3.0 版本,常被称为 Python 3000,或简称 Py3k。相对于 Python 的早期版本,这是一个较大的升级。为了不带入过多的累赘,Python 3.0 在设计的时候没有考虑向下兼容。 Python
    Python 3 教程
  • Python pip包管理
    一、前言    在Python中, 安装第三方模块是通过 setuptools 这个工具完成的。 Python有两个封装了 setuptools的包管理工具: easy_install  和  pip , 目前官方推荐使用 pip。    
    Python pip包管理
  • ubuntu如何重新编译内核
  • 改善Java代码之慎用java动态编译

目录