JavaScript函数参数传递
Hello,今天和大家分享下JS中的一个基本概念:函数参数传递!
先来看看一个DEMO
var str="hello world";
function func(s){
s="hello javascript";
}
func(str);
console.log(str);
请问这里控制台最终将输出什么?
答案是:hello world.
也就是说func函数并没有修改全局作用域中的str值。这个例子比较好理解,JS的函数参数传递是按值传递,只不过这里的值是指栈区的值。
这里函数将str的值传递给函数内部变量s,然后修改了内部变量s的值,显然这和全部作用域中的str并没有什么关系,所以str仍然是初始值。
除非这里我们显示调用并修改全局作用域下的变量:
function func(s){
window.str="hello javascript";
}
这样全局作用域下的str变量才会被修改。
好了,再来看第二个DEMO:
var obj={
attr:'obj attr value'
};
function func(o){
o.attr="new attr value!";
}
func(obj);
console.log(obj.attr);
这一次我们将函数传递的参数换成了一个对象,输出结果又是什么呢?
答案是:new attr value! 也就是说我们的obj这个全部作用域的对象被修改了,为什么?
原因还是第一个DEMO加粗标注的那句话:JS的函数参数传递是按值传递,只不过这里的值是指栈区的值。
对于对象来说,传递的值是对象在堆区的地址。(关于JS变量存储原理欢迎查看:http://www.cnblogs.com/souvenir/p/4969399.html)
回到DEMO2,第9行调用func函数传递过去就是obj对象的堆区地址,然后这个地址又复制给了func内部作用域的o对象,
也就是说,o与obj都指向了同一个对象,所以修改o属性的以后,再次访问obj,当然也发生了变化!
OK,这个没有问题以后,我们再来看另一个DEMO:
var obj={
attr:'obj attr value'
};
function func(obj){
obj={attr:'new attr value!'};
}
func(obj);
console.log(obj.attr);
这个DEMO是在第二个DEMO的基础上进行修改得到的,在函数内部我们不是修改obj对象的属性,而是修改obj整个对象。
可能大家会受到上面第二个DEMO的影响,认为这里的全部变量obj仍然被修改了。
答案是,obj并未被修改,输出的值仍然是:obj attr value。
眼尖的同学会发现这个DEMO其实和第一个DEMO并没有什么不同,只不过一个传递的是普通类型,一个传递的对象。
对。这里只是将一个新的对象的引用地址赋值给了obj,但是千万别忘了,obj这是func的局部变量,和全部变量obj也没有半毛钱关系。
当然,除非我们这么修改的话,情况就不一样了。
function func(obj){
window.obj={attr:'new attr value!'};
}
总结:
JS的函数参数传递是按值传递。
JS的函数参数传递是按值传递。
JS的函数参数传递是按值传递。
(嗯,重要的事情要说三遍)
JavaScript函数参数传递的更多相关文章
- JavaScript 函数参数传递到底是值传递还是引用传递
tips:这篇文章是听了四脚猫的js课程后查的,深入的理解可以参看两篇博客: JavaScript数据类型--值类型和引用类型 JavaScript数据操作--原始值和引用值的操作本质 在传统的观念里 ...
- JavaScript函数的概念
函数是这样的一段代码,它只定义一次,但可能被执行或调用任意多次. JavaScript函数是参数化的:函数的定义会包含形参,这些参数在函数的整体中像局部变量一样工作.函数调用时会为形参提供实参的值.除 ...
- 深入理解javascript函数系列第二篇——函数参数
× 目录 [1]arguments [2]内部属性 [3]函数重载[4]参数传递 前面的话 javascript函数的参数与大多数其他语言的函数的参数有所不同.函数不介意传递进来多少个参数,也不在乎传 ...
- HTML 学习笔记 JavaScript (函数)
函数是由事件驱动的或者当他被调用时执行的可重复使用的代码块 实例 <!DOCTYPE html> <html> <head> <script> func ...
- 第八章:Javascript函数
函数是这样一段代码,它只定义一次,但可能被执行或调用任意次.你可能从诸如子例程(subroutine)或者过程(procedure)这些名字里对函数概念有所了解. javascript函数是参数化的: ...
- JavaScript 函数基础
1. JavaScript 函数基础 1. 定义方法 2. 函数的调用方法 3. 函数方法 apply : 将函数作为数组的方法来调用 将参数以数组形式传递给该方法 call : 将函数作为对象的 ...
- 深入理解javascript函数进阶系列第一篇——高阶函数
前面的话 前面的函数系列中介绍了函数的基础用法.从本文开始,将介绍javascript函数进阶系列,本文将详细介绍高阶函数 定义 高阶函数(higher-order function)指操作函数的函数 ...
- JavaScript函数、闭包、原型、面向对象
JavaScript函数.闭包.原型.面向对象 断言 单元测试框架的核心是断言方法,通常叫assert(). 该方法通常接收一个值--需要断言的值,以及一个表示该断言目的的描述. 如果该值执行的结果为 ...
- javaScript系列 [01]-javaScript函数基础
[01]-javaScript函数基础 1.1 函数的创建和结构 函数的定义:函数是JavaScript的基础模块单元,包含一组语句,用于代码复用.信息隐蔽和组合调用. 函数的创建:在javaScri ...
随机推荐
- -bash: /bin/grep: Argument list too long和 find: Arguments to -type should contain only one letter报错处理
由于要查找的文件太多 过滤成只找具体时间一天以内的文件 | 查找最近30分钟修改的当前目录下的.php文件 查找最近24小时修改的当前目录下的.php文件 查找最近24小时修改的当前目录下的.php文 ...
- Python selenium PO By.XPATH定位元素报错
Python selenium PO By.XPATH定位元素报错 如下代码经常报错: # 首页的“新建投放计划”按钮 new_ads_plan = (By.XPATH, "//*[tex ...
- shell case例子
-- --
- python开发笔记-字典按值排序取前n个key值
场景举例: 假如我们有某个班级的语文成绩数据,格式为字典,其中字典key为学生姓名,value为学生成绩: 那么,如何获得单科成绩排名前3的学生姓名? 代码如下:--数据样例,方便测试 def dic ...
- 转 perl DBI 总结
https://www.cnblogs.com/homezzm/archive/2011/07/22/2113618.html ##查看已经安装的包 #!/usr/bin/perluse strict ...
- tushare包使用案例
Tushare是一个免费.开源的python财经数据接口包.主要实现对股票等金融数据从数据采集.清洗加工 到 数据存储的过程,能够为金融分析人员提供快速.整洁.和多样的便于分析的数据,为他们在数据获取 ...
- piecewise_construct存在的意义
C++11中大部分的容器对于添加元素除了传统的 insert 或者 pusb_back/push_front 之外都提供一个新的函数叫做 emplace. 比如如果你想要向 std::vector 的 ...
- 系统运维工程师装逼完全指南(转载Mark)
1.全球化的认证有助于提升逼格,什么OCM.CCIE.RHCA.CISSP等等能考都考,再不济,也要有一张系统架构设计师或者网络规划设计师的信产部认证.每过一个认证,逼格提升一档. 2.TCP/IP协 ...
- linux中安装robot环境
https://www.cnblogs.com/lgqboke/p/8252488.html(文中验证robotframework命令应该为 robot --version) 可能遇到的问题: 1.p ...
- PCL
PCL(PointCloudLibrary)——是一个的模块化的现代C++模板库. 其基于以下第三方库:Boost.Eigen.FLANN.VTK.CUDA.OpenNI.Qhull,实现点云相关的获 ...