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 相关文章推荐
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
Jan 09 Javascript
二叉树的非递归后序遍历算法实例详解
Feb 07 Javascript
Javascript 函数parseInt()转换时出现bug问题
May 20 Javascript
关于JS中prototype的理解
Sep 07 Javascript
基于jQuery实现的幻灯图片切换
Dec 02 Javascript
详解JS: reduce方法实现 webpack多文件入口
Feb 14 Javascript
AngularJS 仿微信图片手势缩放的实例
Sep 28 Javascript
基于Vue实现关键词实时搜索高亮显示关键词
Jul 21 Javascript
Vue 框架之键盘事件、健值修饰符、双向数据绑定
Nov 14 Javascript
vue学习笔记五:在vue项目里面使用引入公共方法详解
Apr 04 Javascript
利用Node.js如何实现文件循环覆写
Apr 05 Javascript
微信小程序自定义组件实现环形进度条
Nov 17 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
提高PHP编程效率的53个要点(经验小结)
2010/09/04 PHP
Yii2增加验证码步骤详解
2016/04/25 PHP
浅谈PHP正则中的捕获组与非捕获组
2016/07/18 PHP
PHP实现可精确验证身份证号码的工具类示例
2018/05/31 PHP
javascript 基础篇2 数据类型,语句,函数
2012/03/14 Javascript
JavaScript高级程序设计(第3版)学习笔记12 js正则表达式
2012/10/11 Javascript
jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
2013/12/05 Javascript
IE浏览器不支持getElementsByClassName的解决方法
2014/08/27 Javascript
jquery中trigger()无法触发hover事件的解决方法
2015/05/07 Javascript
JQuery给网页更换皮肤的方法
2015/05/30 Javascript
详解参数传递四种形式
2015/07/21 Javascript
使用Chart.js图表库制作漂亮的响应式表单
2015/10/28 Javascript
Javascript 字符串模板的简单实现
2016/02/13 Javascript
Jquery zTree 树控件异步加载操作
2016/02/25 Javascript
AngularJS 与百度地图的结合实例
2016/10/20 Javascript
Angular2使用vscode断点调试ts文件的方法
2017/12/13 Javascript
详解Vue微信授权登录前后端分离较为优雅的解决方案
2018/06/29 Javascript
js最实用string(字符串)类型的使用及截取与拼接详解
2019/04/26 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
超详细的5个Shell脚本实例分享(值得收藏)
2019/08/15 Javascript
关于layui 弹出层一闪而过就消失的解决方法
2019/09/09 Javascript
JavaScript中的函数申明、函数表达式、箭头函数
2019/12/06 Javascript
Bootstrap简单实用的表单验证插件BootstrapValidator用法实例详解
2020/03/29 Javascript
基于vuex实现购物车功能
2021/01/10 Vue.js
python 中文字符串的处理实现代码
2009/10/25 Python
Python使用scrapy抓取网站sitemap信息的方法
2015/04/08 Python
使用httplib模块来制作Python下HTTP客户端的方法
2015/06/19 Python
Python3中条件控制、循环与函数的简易教程
2017/11/21 Python
Python 在字符串中加入变量的实例讲解
2018/05/02 Python
python如何使用代码运行助手
2020/07/03 Python
浅析pandas随机排列与随机抽样
2021/01/22 Python
10分钟理解CSS3 FlexBox弹性布局
2018/12/20 HTML / CSS
应届毕业生就业自荐信
2013/10/26 职场文书
英文自荐信
2013/12/19 职场文书
意外伤害赔偿协议书
2014/09/16 职场文书
幼儿园中班教育随笔
2015/08/14 职场文书