JS:JS中常见的 “函数名 is not a function” 错误
js中常见的错误,例如Uncaught TypeError: x is not a function
其原因除了函数本身有错之外,还有一种很奇怪的情况:函数本身没有错,但是运行时就是不能正常运行。这种情况与javascript的特性有关:变量与函数声明前置的优先级。
总结:
js有声明前置,函数和变量的声明都会前置,即会在整个js代码的最开始,不管声明部分在什么位置。
js中函数的声明优先于同名变量的声明,不管先后顺序如何。
函数的声明会在整段js代码的最前面,不管function() 函数在js的什么位置。
当先声明了名为x()的函数,再声明名为var x的变量时,变量名会覆盖函数,使得在同名变量定义之后,函数变得未定义,即同名变量定义之后 调用同名函数会报错,即 x is not a function。
当有两个同名变量和两个同名函数一起定义时,四个量的名字相同,那么后一个函数或者变量会覆盖掉前一个对应的量(函数/变量)且四个中最后一个定义量之后在引用此量,该量的类型(变量/函数)是最后一次定义此名量时的类型(变量/函数)。
1-4点解释如下:
首先看代码:
console.log(x)
console.log(x());
var x=1;
function x(){
console.log(5);
}
console.log(x)
console.log(x());//此时x变成了一个变量
输出结果:
function x(){
console.log(5);
}
5
1
Uncaught TypeError: x is not a function
----------------------------
js解释器在对其上下文进行解释执行时分为三个阶段来进行:声明阶段、初始化阶段、执行阶段。
针对js上下文,首先会进行声明阶段,声明阶段中的特点是声明前置;声明又会包括变量声明前置和函数声明前置,鉴于以上代码的输出结果,我们可以得出函数声明前置优先于变量声明前置的特点,并且如果变量名和函数名冲突会忽略变量的声明,因此声明过得变量名或函数名不会重复声明,这样也可以很好地解释为什么第一次输出的是函数而不是undefined。根据js的这些特点我们可以将以上代码解析成如下:
//声明阶段
function x(){//函数声明
console.log(5);
}
var x;//变量声明,因为x已经声明过了,此处不进行声明(忽略)
//执行阶段
console.log(x);
console.log(x());
x=1;
console.log(x);
console.log(x());
如上代码所述,js将变量和函数的声明前置,然后再执行代码。
- 第二次输出时,因为声明阶段已经声明过名为x的函数,所以在执行阶段中调用x函数,会执行函数体中的内容。
- 第三次输出时,输出1,因为x被赋值为1.
- 第四次输出时,因为x此时是一个变量而不是一个函数,所以js无法解释“变量()”这样的格式,就会提示“x is not a function”。
第5点解释如下:当有两个同名变量和两个同名函数一起定义时,四个量的名字相同,那么后一个函数或者变量会覆盖掉前一个对应的量(函数/变量)。
js中声明过得变量名或函数名不会重复声明,如果js代码中有同名的函数或同名的变量时,程序如何运行,如下代码:
console.log(x)
console.log(x());
var x=1;
var x=100;
function x(){
console.log(5);
}
function x(){
console.log(500);
}
console.log(x)
console.log(x());//此时x变
根据js解析代码的特点,将代码解析成如下:
//声明阶段
function x(){//函数声明
//console.log(5);此句会被下句代码覆盖
console.log(500);
}
var x;//变量声明,因为x已经声明过了,此处不进行声明(忽略)
//执行阶段
console.log(x);
console.log(x());
x=1;
x=100;//x的值被覆盖
console.log(x);
console.log(x());//此时x变成了一个变量
所以输出的结果就是:
function x(){
console.log(500);
}
500
100
Uncaught TypeError: x is not a function
----------------------------
所以:如果声明了同名的函数其定义会被后者覆盖,声明了同名的变量其值也会被后者覆盖
JS:JS中常见的 “函数名 is not a function” 错误的更多相关文章
- JS循环中使用bind函数的参数传递问题
JS循环中使用bind函数的参数传递问题,问题代码如下: for (var sc in result) { var tempp = '<div class="sidebar_todo_ ...
- vue 组件名和方法名 重名了,报function错误
vue 组件名和方法名 重名了,报function错误
- js中关于事件处理函数名后面是否带括号的问题
今天总结一个关于事件处理程序的小细节.首先回顾一下事件处理的一些概念. JS中的事件处理(事件绑定)就是让某种或某些事件触发某些活动.有两种常见的形式,分别是DOM Level 0 和DOM Leve ...
- 破解 Rith's CrackMe #1(对比IDA查看动态分析中的MFC函数名)
系统 : Windows xp 程序 : Rith's CrackMe #1 程序下载地址 :http://pan.baidu.com/s/1gecW9Qr 要求 : 注册机编写 使用工具 : IDA ...
- 【转】《深入理解计算机系统》C程序中常见的内存操作有关的典型编程错误
原文地址:http://blog.csdn.net/slvher/article/details/9150597 对C/C++程序员来说,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构 ...
- 错误内存【读书笔记】C程序中常见的内存操作有关的典型编程错误
题记:写这篇博客要主是加深自己对错误内存的认识和总结实现算法时的一些验经和训教,如果有错误请指出,万分感谢. 对C/C++程序员来讲,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构成的 ...
- 《深入理解计算机系统》C程序中常见的内存操作有关的典型编程错误
对C/C++程序员来说,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构成的模块跑起来后才出现内存崩溃,是很让人痛苦的.因为崩溃的位置在时间和空间上,通常是在距真正的错误源一段距离之后才 ...
- JS 调试中常见的报错的解决办法
报错:Uncaught SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse (<anonymous>) ...
- js对象中的回调函数
假设一个页面new多个同类型的对象,且该对象内部含异步请求的回调,很有可能回调函数中的this指向最后一次new的对象. 解决该问题的办法是,异步请求使用$.ajax并制定其context为this, ...
随机推荐
- 计蒜客A1998 Ka Chang (分块+dfs序+树状数组)
题意 给你一个\(1e5\)的有点权的树,有\(1e5\)个操作: 1.给第\(x\)层的点加上\(y\) 2.求以\(x\)为根的子树的点权和 思路 首先处理出层数为x的所有点 操作2一般都是用df ...
- 批处理(BAT) Ping监控, 结果记录入日志文件
::执行效果 @echo off ::等待用户输入需要监控IP set /p ip=Input the IP required to monitor: echo executing...... :st ...
- 使用Python打造一款间谍程序
知识点 这次我们使用python来打造一款间谍程序 程序中会用到许多知识点,大致分为四块 win32API 此处可以在MSDN上查看 Python基础重点在cpytes库的使用,使用方法请点击此处 ...
- apache 负载均衡
此次使用mod_proxy的方式来实现的,因为在Apache2以上的版本中已经集成了,因此不需要再另行安装和配置了. 只需要把注释去掉即可,去掉以下模块的注释: LoadModule proxy_mo ...
- CVE-2020-0618 SQL 远程代码执行
CVE-2020-0618 SQL Server远程代码执行 1.简介 SQL Server Reporting Services(SSRS)提供了一组本地工具和服务,用于创建,部署和管理移动报告和分 ...
- mac 软件相关的
mac 系统教学 https://www.w3cschool.cn/macdevsetup/carp1i83.html 可以查看的软件网站 https://www.ifunmac.com/ https ...
- 1,Python爬虫环境的安装
前言 很早以前就听说了Python爬虫,但是一直没有去了解:想着先要把一个方面的知识学好再去了解其他新兴的技术. 但是现在项目有需求,要到网上爬取一些信息,然后做数据分析.所以便从零开始学习Pytho ...
- absoulue与relative配合定位盒子居中问题
如何通过absoulue与relative配合把一个盒子或者是把2个div块同时放到页面中央部分?定位完成后为什么又需要margin-left与margin-top各往回走50%的长度,别忘记用z-i ...
- Android Gradle报错 (Error:No such property: GradleVersion for class: JetGradlePlugin) 的原因与解决
Error:No such property: GradleVersion for class: JetGradlePlugin 错误原因:IDE 版本(GradlePlugin)和 Gradle 版 ...
- C#中FolderBrowserDialog类打开文件夹使用说明
C#中FolderBrowserDialog类打开文件夹使用说明 作用:打开文件选择窗口获取文件夹路径. 导入的命名空间为: System.Windows.Forms; 属性: Descr ...