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” 错误的更多相关文章

  1. JS循环中使用bind函数的参数传递问题

    JS循环中使用bind函数的参数传递问题,问题代码如下: for (var sc in result) { var tempp = '<div class="sidebar_todo_ ...

  2. vue 组件名和方法名 重名了,报function错误

    vue 组件名和方法名 重名了,报function错误

  3. js中关于事件处理函数名后面是否带括号的问题

    今天总结一个关于事件处理程序的小细节.首先回顾一下事件处理的一些概念. JS中的事件处理(事件绑定)就是让某种或某些事件触发某些活动.有两种常见的形式,分别是DOM Level 0 和DOM Leve ...

  4. 破解 Rith's CrackMe #1(对比IDA查看动态分析中的MFC函数名)

    系统 : Windows xp 程序 : Rith's CrackMe #1 程序下载地址 :http://pan.baidu.com/s/1gecW9Qr 要求 : 注册机编写 使用工具 : IDA ...

  5. 【转】《深入理解计算机系统》C程序中常见的内存操作有关的典型编程错误

    原文地址:http://blog.csdn.net/slvher/article/details/9150597 对C/C++程序员来说,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构 ...

  6. 错误内存【读书笔记】C程序中常见的内存操作有关的典型编程错误

    题记:写这篇博客要主是加深自己对错误内存的认识和总结实现算法时的一些验经和训教,如果有错误请指出,万分感谢. 对C/C++程序员来讲,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构成的 ...

  7. 《深入理解计算机系统》C程序中常见的内存操作有关的典型编程错误

    对C/C++程序员来说,内存管理是个不小的挑战,绝对值得慎之又慎,否则让由上万行代码构成的模块跑起来后才出现内存崩溃,是很让人痛苦的.因为崩溃的位置在时间和空间上,通常是在距真正的错误源一段距离之后才 ...

  8. JS 调试中常见的报错的解决办法

    报错:Uncaught SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse (<anonymous>) ...

  9. js对象中的回调函数

    假设一个页面new多个同类型的对象,且该对象内部含异步请求的回调,很有可能回调函数中的this指向最后一次new的对象. 解决该问题的办法是,异步请求使用$.ajax并制定其context为this, ...

随机推荐

  1. 题解 SP1716 【GSS3 - Can you answer these queries III】

    \[ Preface \] 没有 Preface. \[ Description \] 维护一个长度为 \(n\) 的数列 \(A\) ,需要支持以下操作: 0 x y 将 \(A_x\) 改为 \( ...

  2. 全网最详细的Linux命令系列-Screen远程会话命令

    screen 管理你的远程会话 你是不是经常需要 SSH 或者 telent 远程登录到 Linux 服务器?你是不是经常为一些长时间运行的任务而头疼,比如系统备份.ftp 传输等等.通常情况下我们都 ...

  3. Windows服务器使用Telegraf采集服务器监控指标输出到influxdb

    1.环境说明 操作系统:Windows Server 2008 R2 IP:192.168.10.135 官方文档地址 :https://docs.influxdata.com/telegraf/v1 ...

  4. Angular解析json

    一. 解析本地Json数据并展示(待定) 1. 创建服务{ 创建一个接口对象用于接收Json数据 通过HttpClient获得本地Json文件 } 2. 组件中引入服务调用服务方法拿文件用subscr ...

  5. Java 添加、读取、删除Excel图片

    本文介绍在Java程序中如何添加图片到excel表格,添加图片时可设置图片大小.位置.旋转.超链接.可选文本等,以及如何读取.删除excel表格中已有的图片. 工具:Free Spire.XLS fo ...

  6. ab使用详解—如何使用apache性能测试工具进行压力测试

    作为后端工程师,除了实现业务需求之外,需要考虑的就是自己写的服务,在大并发下是否能正常运行了.但是,在一般开发情况下,没那么多大并发情况让你测试,那该怎么办呢? 这时候,我们就可以用到apache的压 ...

  7. 【渗透实战】web渗透实战,手动拿学校站点 得到上万人的信息(漏洞已提交)

    ------------恢复内容开始------------ ’‘’版权tanee转发交流学校请备注漏洞已经提交学校管理员关键过程的截图和脚本代码已经略去.希望大家学习技术和思路就好,切勿进行违法犯罪 ...

  8. Python requests 调Jenkins登录接口,返回404,但请求地址、请求头、消息主题和抓包的内容都一样

    #coding=utf-8import requests url = "http://localhost:8080/jenkins/j_acegi_security_check"h ...

  9. docker jenkins 前端node项目 自动化部署异常 env: ‘node’: No such file or directory

    出现问题是docker jenkins 里面没有自动安装node导致找不到这个Node命令 解决方案:手动安装nodejs # 进入jenkins对应容器中 # docker exec -it [对应 ...

  10. PyCharm专业版激活+破解到期时间2100年

    PyCharm专业版激活+破解到期时间2100年 转载文章:https://blog.51cto.com/13696145/2464312?source=dra 到2020年5月激活码: N7UR85 ...