JavaScript修改作用域外变量的方法


Posted in Javascript onMarch 25, 2016

1.今天在看JavaScript学习指南的时候做的课后习题,也因此详细的对函数的传入参数进行比较深入的研究.

题目如下:

函数如何才能修改其作用域之外的变量?编写一个函数,由1~5的数字组成的数组作为参数,调用该函数后将把其中的数字项替换为相应的字符串表示形式.

需要注意知识点:

在JavaScript中函数参数的传递,对于基于原始值的参数进行值传递(数字,字符串,布尔值),函数中的修改不会影响实际参数值.而传递给函数的参数而言,对象是一个引用,对其的修改的将会反映在主调程序中.<-但是,会有这样的情况,如下

var outer_number = ;
var outer_boolean = true;
var outer_array = [,,];
var outer_object = {test:""};
function display(num,bool,arr,obj){
console.log("number:"+num+"\nboolean:"+bool+"\narray:"+arr+"\nobject:"+obj.test);
}
function test(num,bool,arr,obj){
display(num,bool,arr,obj);//num=,bool=true,array=[,,],object.test=
num = ;
bool = false;
arr[] = ;
obj.test = "";
display(num,bool,arr,obj);//num=,bool=false,array=[,,,],object.test=
arr = [,,];
obj = {test:""};
display(num,bool,arr,obj);//num=,bool=false,array=[,,],object.test=
}
test(outer_number,outer_boolean,outer_array,outer_object);
display(outer_number,outer_boolean,outer_array,outer_object);//num = ,bool=true,array=[,,,],object.test=

在上面代码中我们创建了4个全局变量,类型分别为数字,布尔值,数组,对象.2个函数,display和test.

display执行了4次,分别结果如下:

"number:2
boolean:true
array:1,2,3
object:122"<-传入函数时的值

"number:0
boolean:false
array:1,2,3,3
object:134"<-执行更改

"number:0
boolean:false
array:3,2,1
object:133"<-重新赋值

"number:2
boolean:true
array:1,2,3,3
object:134"<-函数执行完毕后

可以看出我们对数组和对象的重新赋值并没有成功,如果按引用传递,那么我们应该也对全局变量的数组和对象重新赋值修改了呀.
其实JavaScript中所谓的按引用赋值并不是真正意义上的按引用复制,准确说应该是按共享传递.也可以叫按对象传递,按对象共享传递(call by sharing).

在这个按共享传递的条件下,我们获取的引用可以说只是实参引用的副本,它和我们经常说的按引用传递的最大差别就在于我们在对引用副本的赋值不会影响实参的值,正如我们上面那样做的那样,赋值操作是不可行的.

当然我们从对象类型和基本类型两方面看,对象是可变的而基本类型是不可变的(注意!字符串修改其实是返回的新的字符串),所以按共享传递对于基本类型来说也是符合按共享传递的.

总结一下:

JavaScript中,基本类型和对象都按共享传递(call by sharing),但是由于JavaScript的基本类型的不变性,基本类型按共享传递与按值传递没有任何区别,而对象按共享传递.

按共享传递(call by sharing):传递的是实参引用的副本,我们对引用副本的赋值不影响实参的值,但是可以使用引用副本去修改引用的内容.详细的wiki地址

函数对传入的参数:

1.基本类型,按值传递(或者也可以说按共享传递),内部赋值修改都不影响主调程序

2.对象类型,按共享传递,传入的为实参引用的副本,内部对该引用的赋值无效,对对象属性的赋值修改有效.

大概就是这么理解了,假如有什么地方我犯了什么错误,也希望能被指出来.

下面单独拉出JavaScript作用域

任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期。在JavaScript中,变量的作用域有全局作用域和局部作用域两种。

全局作用域(Global Scope)

在代码中任何地方都能访问到的对象拥有全局作用域,一般来说以下几种情形拥有全局作用域:

(1)最外层函数和在最外层函数外面定义的变量拥有全局作用域,例如:

var authorName="山边小溪";
function doSomething(){
var blogName="梦想天空";
function innerSay(){
alert(blogName);
}
innerSay();
}
alert(authorName); //山边小溪
alert(blogName); //脚本错误
doSomething(); //梦想天空
innerSay() //脚本错误

(2)所有末定义直接赋值的变量自动声明为拥有全局作用域,例如:

function doSomething(){
var authorName="山边小溪";
blogName="梦想天空";
alert(authorName);
}
doSomething(); //山边小溪
alert(blogName); //梦想天空
alert(authorName); //脚本错误

变量blogName拥有全局作用域,而authorName在函数外部无法访问到。

(3)所有window对象的属性拥有全局作用域

一般情况下,window对象的内置属性都拥有全局作用域,例如window.name、window.location、window.top等等。

1. 局部作用域(Local Scope)  

和全局作用域相反,局部作用域一般只在固定的代码片段内可访问到,最常见的例如函数内部,所有在一些地方也会看到有人把这种作用域称为函数作用域,例如下列代码中的blogName和函数innerSay都只拥有局部作用域。

function doSomething(){
var blogName="梦想天空";
function innerSay(){
alert(blogName);
}
innerSay();
}
alert(blogName); //脚本错误
innerSay(); //脚本错误

Javascript 相关文章推荐
Tab页界面 用jQuery及Ajax技术实现(php后台)
Oct 12 Javascript
Jquery带搜索框的下拉菜单
May 06 Javascript
jQuery在iframe中无法弹出对话框的解决方法
Jan 12 Javascript
node.js中的querystring.stringify方法使用说明
Dec 10 Javascript
JS+CSS模拟可以无刷新显示内容的留言板实例
Mar 03 Javascript
jQuery的基本概念与高级编程
May 14 Javascript
基于jQuery实现数字滚动效果
Jan 16 Javascript
jQuery分页插件jquery.pagination.js使用方法解析
Feb 09 Javascript
使用原生js+canvas实现模拟心电图的实例
Sep 20 Javascript
Vue实现侧边菜单栏手风琴效果实例代码
May 31 Javascript
小程序实现录音上传功能
Nov 22 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
JavaScript 2048 游戏实例代码(简单易懂)
Mar 25 #Javascript
JavaScript入门系列之知识点总结
Mar 24 #Javascript
JS实现支持Ajax验证的表单插件
Mar 24 #Javascript
拥有一个属于自己的javascript表单验证插件
Mar 24 #Javascript
jquery zTree异步加载、模糊搜索简单实例分享
Mar 24 #Javascript
js+css实现select的美化效果
Mar 24 #Javascript
基于jQuery Ajax实现上传文件
Mar 24 #Javascript
You might like
《星际争霸重制版》兵种对比图鉴
2020/03/02 星际争霸
缓存技术详谈―php
2006/12/14 PHP
PHP面向对象分析设计的61条军规小结
2010/07/17 PHP
PHP实现清除MySQL死连接的方法
2016/07/23 PHP
php 微信公众平台开发模式实现多客服的实例代码
2016/11/07 PHP
静态的动态续篇之来点XML
2006/12/23 Javascript
jqPlot jquery的页面图表绘制工具
2009/07/25 Javascript
JQuery表格拖动调整列宽效果(自己动手写的)
2014/09/01 Javascript
javascript中Date format(js日期格式化)方法小结
2015/12/17 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
js实现显示手机号码效果
2017/03/09 Javascript
ionic2自定义cordova插件开发以及使用(Android)
2017/06/19 Javascript
Vue.2.0.5实现Class 与 Style 绑定的实例
2017/06/20 Javascript
gulp教程_从入门到项目中快速上手使用方法
2017/09/14 Javascript
vue路由导航守卫和请求拦截以及基于node的token认证的方法
2019/04/07 Javascript
javascript写一个ajax自动拦截并下载数据代码实例
2019/09/07 Javascript
详解Vue中的Props与Data细微差别
2020/03/02 Javascript
微信小程序实现点击导航标签滚动定位到对应位置
2020/11/19 Javascript
在实例中重学JavaScript事件循环
2020/12/03 Javascript
利用Python脚本生成sitemap.xml的实现方法
2017/01/31 Python
Python针对给定字符串求解所有子序列是否为回文序列的方法
2018/04/21 Python
Python实现去除列表中重复元素的方法小结【4种方法】
2018/04/27 Python
python实现在图片上画特定大小角度矩形框
2018/10/24 Python
python多进程并行代码实例
2019/09/30 Python
Python文件操作基础流程解析
2020/03/19 Python
Django xadmin安装及使用详解
2020/10/26 Python
Python numpy大矩阵运算内存不足如何解决
2020/11/19 Python
请解释流与文件有什么不同
2016/07/29 面试题
银行自荐信范文
2013/10/07 职场文书
汽修专业学生自我鉴定
2013/11/16 职场文书
大学生活动策划方案
2014/02/10 职场文书
党支部特色活动方案
2014/08/20 职场文书
法律讲堂观后感
2015/06/11 职场文书
Python opencv缺陷检测的实现及问题解决
2021/04/24 Python
go开发alertmanger实现钉钉报警
2021/07/16 Golang
什么是css原子化,有什么用?
2022/04/24 HTML / CSS