js中函数的返回值return_js获取 return 返回值-CSDN博客

本文链接：https://blog.csdn.net/TC_16_zl/article/details/73963784

js中函数的返回值：return

一、函数的返回值需要注意的几点：

1、函数名+括号：如fn1() == return 后面的值
2、所有函数默认返回值：都是未定义 undefined
3、return 后面的任何代码都不执行了

二、函数返回值的类型及实例：

1、return返回的类型： js中函数的返回值类型有数字、字符串、布尔值、函数、对象（元素、[]、{}、null）、未定义

2、return返回值的实例：

1) 函数的返回值为数字

代码如下：

function fn1(){
return function(){
alert(100); //嘿嘿，我是JavaScript！
}
}
alert(fn1()); //会显示出所有return后的值，包括注释的内容

2)函数返回值中带有参数

代码如下：

function fn1(b){
return function(a){
alert(a+b);
}
}
fn1(20)(10); //30 作用域链

3)函数的返回值为对象

代码如下：

function fn1(){
return window;
}
fn1().onload = function(){
document.body.innerHTML = 123;
} //返回值是123

4)js中函数的返回值返回为数组

代码如下：

alert(fn1(5)); //返回的值为1,2,3,4,5
alert(fn1(7)); //返回的值为1,2,3,4,5,6,7
function fn1(n){
var arr = [];
for( var i=1;i<=n;i++){
arr.push(i); //向数组中插入值
}
return arr;
}

5)js中函数的返回值返回为未定义

代码如下：

function fn1(){
return;
}
alert(fn1());//返回的值为undefined

2、函数返回值的实例：js中函数返回值返回为对象的简单实例代码的简化

代码如下：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>js中函数的返回值</title>
<style>
h1{ height:30px; width:300px; border:2px solid pink; border-radius:20px; box-shadow:5px 5px 5px yellow; font-size:25px; font-family:"楷体"; line-height:30px; text-align:center; margin:40px auto;}
#div1{ height:100px; width:100px; background:pink; border:1px solid yellow;}
</style>
<script>
window.onload = function(){
var oBtn = document.getElementById('btn1');
var oDiv = document.getElementById('div1');
oBtn.onclick = function(){
oDiv.style.background = 'yellow';
oDiv.style.border = '2px solid pink';
oDiv.style.marginLeft = '200px';
}
function getId(id){
return document.getElementById(id);
}
getId('btn1').onclick = function(){
getId('div1').style.background = 'yellow';
getId('div1').style.border = '2px solid pink';
getId('div1').style.marginLeft = '200px';
}
}
</script>
</head>
<body>
<h1>js中函数的返回值</h1>
<input type="button" value="按钮" id="btn1" />
<div id="div1"></div>
</body>
</html>