JavaScript中重名的函数与对象示例详析


Posted in Javascript onSeptember 28, 2017

前言

本文主要给大家介绍了关于JavaScript中重名的函数与对象的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

JavaScript 允许重复声明变量,后声明的覆盖之前的。

var a = 1;
var a = 'x';
console.log(a);
//输出'x'

JavaScript允许重复定义函数。

JavaScript没有重载这个概念,它仅依据函数名来区分函数。

后定义的同名函数覆盖之前的,与参数无关。

function test() {
 console.log("test");
}
test(); //输出 "test arg0 + undefined"

function test(arg1) {
 console.log("test arg" + arguments.length + " + " + arg1);
}
test(1,2); //输出 "test arg2 + 1"

实参个数如果比形参少,那么剩下的默认赋值为undefined;如果实参传的比形参数量多,那么是全部都会被传进去的,只不过没有对应的形参可以引用(但可以用arguments来获取剩下的参数)

function test(arg1) {
 for(var i=0; i<arguments.length; i++) {
 console.log(arguments[i]);
 }
}
test(1,2); //输出 1 2

变量与函数重名的时候,变量生效

这涉及到了变量和函数的预解析:

- 变量声明会被顶置,函数声明也会被顶置且比变量更先声明。

- 变量的声明和赋值语句一起写时,JS引擎在解析时,会将其拆成声明和赋值2部分,声明置顶,赋值保留在原来位置。

- 声明过的变量不会再重复声明。

var a = 100;
function a() {
 return "function";
}
console.log(a); //输出 100
console.log(a()); 
/*
报错
Uncaught TypeError: a is not a function
 (anonymous function) @test.html:9
*/

JS中有两种函数,一种是普通函数,一种是函数对象。下面的这种就是“函数对象”,它实际上是声明一个匿名函数,然后将该函数的init方法赋值给该变量。

var a = 100;
var a = function() {
 return "function";
}
console.log(a);
/* 
输出
function() {
 return "function";
}
*/
console.log(a()); //输出 "function"

函数与内部变量重名

定义普通函数,即在window变量下,定义一个key,它的名字为该函数名,值为该函数的地址。函数内部的this指向window对象。

function a() {
 console.log(this); //输出 window{...}
 this.a = 1;  //即 window.a = 1,此时window下的function a已经被该变量覆盖了。
 var a = 5;  //下面的这几个变量都是局部变量,仅在花括号范围内有效。 
 a = 10;
 var v = "value"
 return "function";
}
console.log(a);  //输出 function a {...}
console.log(a()); //输出 "function"
console.log(a);  //输出 1
console.log(v);
/*
输出
Uncaught ReferenceError: v is not defined
 (anonymous function) @ mycolor.html:15
*/

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
js 自动播放的实例代码
Nov 19 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
Dec 18 Javascript
全面兼容的javascript时间格式化函数(比较实用)
May 14 Javascript
jquery.multiselect多选下拉框实现代码
Nov 11 Javascript
Vue系列:通过vue-router如何传递参数示例
Jan 16 Javascript
AngularJS路由实现页面跳转实例
Mar 03 Javascript
关于Bootstrap按钮组件消除黄框的方法
May 19 Javascript
详解在Vue中有条件地使用CSS类
Sep 30 Javascript
Vue.directive 自定义指令的问题小结
Mar 04 Javascript
vue数据初始化initState的实例详解
Apr 11 Javascript
详解50行代码,Node爬虫练手项目
Apr 22 Javascript
JS插入排序简单理解与实现方法分析
Nov 25 Javascript
js 开发之autocomplete=&quot;off&quot;在chrom中失效的解决办法
Sep 28 #Javascript
微信小程序下拉刷新界面的实现
Sep 28 #Javascript
详解Vuex中mapState的具体用法
Sep 28 #Javascript
Node.js学习之地址解析模块URL的使用详解
Sep 28 #Javascript
javascript基于牛顿迭代法实现求浮点数的平方根【递归原理】
Sep 28 #Javascript
React Native模块之Permissions权限申请的实例相机
Sep 28 #Javascript
Node.js学习之查询字符串解析querystring详解
Sep 28 #Javascript
You might like
使用bcompiler对PHP文件进行加密的代码
2010/08/29 PHP
解析PHPExcel使用的常用说明以及把PHPExcel整合进CI框架的介绍
2013/06/24 PHP
Yii查询生成器(Query Builder)用法实例教程
2014/09/04 PHP
php中debug_backtrace、debug_print_backtrace和匿名函数用法实例
2014/12/01 PHP
JQuery 学习笔记 element属性控制
2009/07/23 Javascript
document.write()及其输出内容的样式、位置控制
2013/08/12 Javascript
jquery与prototype框架的详细对比
2013/11/21 Javascript
js判断字符长度及中英文数字等
2014/03/19 Javascript
jQuery is()函数用法3例
2014/05/06 Javascript
JS实现模拟风力的雪花飘落效果
2015/05/13 Javascript
学习vue.js中class与style绑定
2016/12/03 Javascript
基于Vue实例生命周期(全面解析)
2017/08/16 Javascript
Bootstrap Paginator+PageHelper实现分页效果
2018/12/29 Javascript
vue-cli中vue本地实现跨域调试接口
2019/01/16 Javascript
JavaScript中filter的用法实例分析
2019/02/27 Javascript
vue项目打包上传github并制作预览链接(pages)
2019/04/19 Javascript
JavaScript this关键字指向常用情况解析
2020/09/02 Javascript
js实现类选择器和name属性选择器的示例步骤
2021/02/07 Javascript
python实现根据窗口标题调用窗口的方法
2015/03/13 Python
Python 中 Virtualenv 和 pip 的简单用法详解
2017/08/18 Python
python中实现精确的浮点数运算详解
2017/11/02 Python
pandas or sql计算前后两行数据间的增值方法
2018/04/20 Python
使用python批量修改文件名的方法(视频合并时)
2020/03/24 Python
Python Collatz序列实现过程解析
2019/10/12 Python
Django和Flask框架优缺点对比
2019/10/24 Python
Tensorflow 多线程与多进程数据加载实例
2020/02/05 Python
Selenium使用Chrome模拟手机浏览器方法解析
2020/04/10 Python
女性时尚在线:IVRose
2019/02/23 全球购物
白酒市场营销方案
2014/02/25 职场文书
模具专业毕业推荐信
2014/03/08 职场文书
家长建议怎么写
2014/05/15 职场文书
酒店开业策划方案
2014/06/02 职场文书
css height属性中的calc方法详解
2021/06/03 HTML / CSS
Java Optional<Foo>转换成List<Bar>的实例方法
2021/06/20 Java/Android
java代码实现空间切割
2022/01/18 Java/Android
Java十分钟精通进阶适配器模式
2022/04/06 Java/Android