整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

JavaScript return语句

. 基本概念

1.1 语句作用

return语句用于终止一个函数的执行,同时将一个返回值返回给这个函数的调用者。因此,return语句必须要被包含在函数之中;否则,程序就会出错。如果没有为return语句指明它的返回值,那么它就默认返回undefined

如果一个函数中没有显式的写明return语句,那么在函数执行时JavaScript会在该函数执行流程的末尾自动添加一条未指明返回值的return语句。return语句也可以被添加在函数的前面部分,这通常用于当满足某个条件时而提前退出函数。

1.2 语法结构

return语句的语法结构如下所示:

return [expression];

其中expression可以是JavaScript中任意合法的表达式,它的计算结果就是return语句的返回值,在函数终止的时候会被返回给该函数的调用者。如果省略了expression,那么return语句的返回值就默认为undefined

如果要显式指明expression,那么它和return关键字必须写在同一行上,即它们之间不能有换行符。否则,JavaScript会自动在return关键字的后面添加分号。此时,该return语句其实是一个未指明返回值的return语句,而expression在return语句之后永远都不会被执行到。

2. 示例

2.1 指明返回值

<script>
    // 定义一个函数,计算一个数的两倍
    function twice(x) {
        var result = x * 2;
        return result;
    }

    // 调用该函数,并打印返回值
    var value1 = twice(9);
    console.log("value1 = " + value1);
</script>

以上代码的执行结果如下图所示。我们用实参9调用函数twice(),它先计算9的两倍然后再返回该结果,随后该返回值被赋值给了变量value1。第10行的代码打印出value1的值,可以看到它的值确实为18

该示例中的twice()函数还可以简写为下面的形式,即计算两倍的表达式被包含在return语句中,它的结果被直接返回。这样就不需要先声明一个变量临时保存计算结果,再用return语句返回该变量。

<script>
    // 和上面代码中的twice函数完全等价
    function twice(x) {
        return x * 2;
    }
</script>

2.2 省略返回值

<script>
    // 定义一个函数,它的最后是一条没有指明返回值的return语句
    function abc() {
        console.log("执行函数abc().");
        return;
    }

    // 调用该函数,并打印返回值
    var value2 = abc();
    console.log("value2 = " + value2);
</script>

从下图的执行结果中我们可以看到,首先打印出了字符串"执行函数abc().",说明函数abc()确实被执行了。第10行的代码打印出的变量value2的值为undefined,这正是return语句的默认返回值。

2.3 省略return语句

<script>
    // 定义一个函数,它省略了return语句
    function abc() {
        console.log("执行函数abc().");
    }

    // 调用该函数,并打印返回值
    var value3 = abc();
    console.log("value3 = " + value3);
</script>

下图中的执行结果表明,该示例和上一个例子的执行结果完全一致(除了变量被命名为value3之外)。该例子的成功执行表明,当一个函数的执行流程的最后一条语句是没有显式指定返回值的return语句时,该return语句可以被省略。

当一个函数的执行流程的最后缺少return语句的时候,JavaScript会自动在该执行流程的最后添加一条没有返回值的return语句,当然该函数的返回值就为undefined了。

2.4 return语句不能在函数之外

<script>
    // return 语句在函数之外:这会导致程序出错
    return;
    console.log("青石野草");
</script>

以上代码的执行结果如下图所示,我们可以看到浏览器明确指出第3行的return语句是错误的。

2.5 提前终止函数

return语句不一定非要是函数的最后一条语句,它也可以处于函数的前面或中间,用于提前终止函数的执行。示例代码如下所示:

<script>
    // 定义一个函数,它计算一个数的相反数;
    // 当参数为0时,它会被提前终止
    function opposite(x) {
        if(x == 0) {
            console.log("0的相反数是它自身。");
            return 0;
        }

        console.log("不为0的数的相反数是它的负数。");
        return -x;
    }

    // 调用函数,并打印返回值
    var value4 = opposite(0);
    console.log("value4 = " + value4);
</script>

我们使用实参0调用函数opposite(),当实参为0的时候,会执行if语句中的代码。它首先打印字符串"0的相反数是它自身。",然后遇到语句return 0;。这条return语句提前终止函数的执行,并返回0。因此,if语句后面的那一条打印语句和return -x;均不会被执行。下图中的执行结果正印证了这一执行流程。

这个例子也说明了一个函数可以包含多个return语句,用于根据不同的情况而退出函数。

2.6 自动添加分号

<script>
    // 定义一个函数,它和第一个例子中的函数几乎一样;
    // 只是原本的return语句被拆分成了两行。
    function twice(x) {
        var result = x * 2;
        return
        result;
    }

    // 调用函数,并打印返回值
    var value5 = twice(9);
    console.log("value5 = " + value5);
</script>

该示例的执行结果如下图所示,可以看到第11行打印出的变量value5的值为undefined,而不是我们原本期望的数字18。这是怎么回事呢?

这个示例和第一个例子唯一的不同就是我们把return语句拆成了两行,return关键字和它的返回值result被写在了不同的行上。在其它编程语言或者JavaScript的某些其它语句中,这样的拆行不会对原程序有任何影响。

但JavaScript的return语句是个例外,在本文的开头我们就说过如果return关键字和它的返回值之间有换行符的话,JavaScript会自动在return关键字之后插入一个分号,此时该return语句的意义就和我们所期望的不同了。

这样自动插入分号的结果就会让该示例中的twice()函数实际等同于下面的代码。此时无论传递的参数是多少,return语句都会提前终止函数并默认返回undefined,而变量result始终都不会被返回。

<script>
    // 定义一个函数,它和第一个例子中的函数几乎一样;
    // 只是原本的return语句被拆分成了两行。
    function twice(x) {
        var result = x * 2;
        return;     // 注意,这个分号是JavaScript自动插入的;它改变了程序的语义。
        result;
    }
</script>

如果你真的想要将return语句写在多行上,那么你可以将返回值用括号括起来。但请一定要注意,此时左括号也必须要和return关键字写在同一行上,就像下面的代码这样:

<script>
    /* 要将return语句写在多行上,可以用括号将返回值括起来;
     * 但是,左括号也必须要和return关键字写在同一行上。
     */
    function twice(x) {
        return (
            x * 2
        );
    }
</script>

(完)

源: AI入门学习

作者:小伍哥

apply()堪称Pandas中最好用的方法,其使用方式跟map()很像,主要传入的主要参数都是接受输入返回输出。

但相较于昨天介绍的map()针对单列Series进行处理,一条apply()语句可以对单列或多列进行运算,覆盖非常多的使用场景。

参考上篇:Pandas中的宝藏函数-map

基本语法:

DataFrame.apply(func, axis=0, raw=False, result_type=None, 
args=(), **kwargs)

参 数:

func : function 应用到每行或每列的函数。

axis :{0 or 'index', 1 or 'columns'}, default 0 函数应用所沿着的轴。

0 or index : 在每一列上应用函数。

1 or columns : 在每一行上应用函数。

raw : bool, default False 确定行或列以Series还是ndarray对象传递。

False : 将每一行或每一列作为一个Series传递给函数。

True : 传递的函数将接收ndarray 对象。如果你只是应用一个 NumPy 还原函数,这将获得更好的性能。

result_type : {'expand', 'reduce', 'broadcast', None}, default None 只有在axis=1列时才会发挥作用。

expand : 列表式的结果将被转化为列。

reduce : 如果可能的话,返回一个Series,而不是展开类似列表的结果。这与 expand 相反。

broadcast : 结果将被广播到 DataFrame 的原始形状,原始索引和列将被保留。

默认行为(None)取决于应用函数的返回值:类似列表的结果将作为这些结果的 Series 返回。但是,如果应用函数返回一个 Series ,这些结果将被扩展为列。

args : tuple 除了数组/序列之外,要传递给函数的位置参数。

**kwds: 作为关键字参数传递给函数的附加关键字参数。

官方:https://pandas.pydata.org/pandas-docs/stable/reference/api/pandas.DataFrame.apply.html

先构造一个数据集

data = pd.DataFrame(
{"name":['Jack', 'Alice', 'Lily', 'Mshis', 'Gdli', 'Agosh', 'Filu', 'Mack', 'Lucy', 'Pony'],
"gender":['F', 'M', 'F', 'F', 'M', 'F', 'M', 'M', 'F', 'F'],
"age":[25, 34, 49, 42, 28, 23, 45, 21, 34, 29]}
                     ) 
data
 name gender  age
0   Jack      F   25
1  Alice      M   34
2   Lily      F   49
3  Mshis      F   42
4   Gdli      M   28
5  Agosh      F   23
6   Filu      M   45
7   Mack      M   21
8   Lucy      F   34
9   Pony      F   29

1)单列数据

这里我们参照2.1向apply()中传入lambda函数:

data.gender.apply(lambda x:'女性' if x is 'F' else '男性')
0    女性
1    男性
2    女性
3    女性
4    男性
5    女性
6    男性
7    男性
8    女性
9    女性

可以看到这里实现了跟map()一样的功能。

2)输入多列数据

apply()最特别的地方在于其可以同时处理多列数据,我们先来了解一下如何处理多列数据输入单列数据输出的情况。

譬如这里我们编写一个使用到多列数据的函数用于拼成对于每一行描述性的话,并在apply()用lambda函数传递多个值进编写好的函数中

注意:当调用DataFrame.apply()时,apply()在串行过程中实际处理的是每一行数据,而不是Series.apply()那样每次处理单个值,在处理多个值时要给apply()添加参数axis=1


def fun_all(name, gender, age):
    gender = '女性' if gender is 'F' else '男性'
    return '有个名字叫{}的人,性别为{},年龄为{}。'.format(name, gender, age)




data.apply(lambda row:fun_all(row['name'],row['gender'],row['age']), axis = 1)
0     有个名字叫Jack的人,性别为女性,年龄为25。
1    有个名字叫Alice的人,性别为男性,年龄为34。
2     有个名字叫Lily的人,性别为女性,年龄为49。
3    有个名字叫Mshis的人,性别为女性,年龄为42。
4     有个名字叫Gdli的人,性别为男性,年龄为28。
5    有个名字叫Agosh的人,性别为女性,年龄为23。
6     有个名字叫Filu的人,性别为男性,年龄为45。
7     有个名字叫Mack的人,性别为男性,年龄为21。
8     有个名字叫Lucy的人,性别为女性,年龄为34。
9     有个名字叫Pony的人,性别为女性,年龄为29。
def intro(r):
    #r代指dataframe中的任意行,是series类型数据,拥有类似字典的使用方法。
    return '大家好,我是{name},性别是{gender},今年{age}岁了!'.format(name=r['name'], gender=r['gender'],age=r['age'])


data.apply(intro, axis=1)
Out[81]: 
0     大家好,我是Jack,性别是F,今年25岁了!
1    大家好,我是Alice,性别是M,今年34岁了!
2     大家好,我是Lily,性别是F,今年49岁了!
3    大家好,我是Mshis,性别是F,今年42岁了!
4     大家好,我是Gdli,性别是M,今年28岁了!
5    大家好,我是Agosh,性别是F,今年23岁了!
6     大家好,我是Filu,性别是M,今年45岁了!
7     大家好,我是Mack,性别是M,今年21岁了!
8     大家好,我是Lucy,性别是F,今年34岁了!
9     大家好,我是Pony,性别是F,今年29岁了!
dtype: object


#其实这样写也是可以的,更简单些
def intro(r):
    return '大家好,我是{},性别是{},今年{}岁了!'.format(r['name'], r['gender'],r['age'])




data.apply(intro, axis=1)

3)输出多列数据

有些时候我们利用apply()会遇到希望同时输出多列数据的情况,在apply()中同时输出多列时实际上返回的是一个Series,这个Series中每个元素是与apply()中传入函数的返回值顺序对应的元组。

比如下面我们利用apply()来提取name列中的首字母和剩余部分字母:


data.apply(lambda row: (row['name'][0], row['name'][1:]), axis=1)
0     (J, ack)
1    (A, lice)
2     (L, ily)
3    (M, shis)
4     (G, dli)
5    (A, gosh)
6     (F, ilu)
7     (M, ack)
8     (L, ucy)
9     (P, ony)

可以看到,这里返回的是单列结果,每个元素是返回值组成的元组,这时若想直接得到各列分开的结果,需要用到zip(*zipped)来解开元组序列,从而得到分离的多列返回值:


a, b = zip(*data.apply(lambda row: (row['name'][0], row['name'][1:]), axis=1))


a
('J', 'A', 'L', 'M', 'G', 'A', 'F', 'M', 'L', 'P')
b
('ack', 'lice', 'ily', 'shis', 'dli', 'gosh', 'ilu', 'ack', 'ucy', 'ony')

4)结合tqdm给apply()过程添加进度条

我们知道apply()在运算时实际上仍然是一行一行遍历的方式,因此在计算量很大时如果有一个进度条来监视运行进度就很舒服。

tqdm:用于添加代码进度条的第三方库

tqdm对pandas也是有着很好的支持。

我们可以使用progress_apply()代替apply(),并在运行progress_apply()之前添加tqdm.tqdm.pandas(desc='')来启动对apply过程的监视。

其中desc参数传入对进度进行说明的字符串,下面我们在上一小部分示例的基础上进行改造来添加进度条功能:


from tqdm import tqdm
def fun_all(name, gender, age):
    gender = '女性' if gender is 'F' else '男性'
    return '有个名字叫{}的人,性别为{},年龄为{}。'.format(name, gender, age)
    
#启动对紧跟着的apply过程的监视
from tqdm import tqdm
tqdm.pandas(desc='apply')
data.progress_apply(lambda row:fun_all(row['name'],row['gender'],
                  row['age']), axis = 1)


apply: 100%|██████████| 10/10 [00:00<00:00, 5011.71it/s]


0     有个名字叫Jack的人,性别为女性,年龄为25。
1    有个名字叫Alice的人,性别为男性,年龄为34。
2     有个名字叫Lily的人,性别为女性,年龄为49。
3    有个名字叫Mshis的人,性别为女性,年龄为42。
4     有个名字叫Gdli的人,性别为男性,年龄为28。
5    有个名字叫Agosh的人,性别为女性,年龄为23。
6     有个名字叫Filu的人,性别为男性,年龄为45。
7     有个名字叫Mack的人,性别为男性,年龄为21。
8     有个名字叫Lucy的人,性别为女性,年龄为34。
9     有个名字叫Pony的人,性别为女性,年龄为2

可以看到在jupyter lab中运行程序的过程中,下方出现了监视过程的进度条,这样就可以实时了解apply过程跑到什么地方了。

结合tqdm_notebook()给apply()过程添加美观进度条,熟悉tqdm的朋友都知道其针对jupyter notebook开发了ui更加美观的tqdm_notebook()。而要想在jupyter notebook/jupyter lab平台上为pandas的apply过程添加美观进度条,可以参照如下示例:

eturn 定义:

return 语句会 终止函数的执行 并 返回函数的值。


注意这两个: 1.终止函数的执行 2.返回函数的值

返回函数的值这里就不过多叙述了,就是 return 变量

先看下面的例子:

<!DOCTYPE html>
<html>
<head>
 <title>return测试</title>
</head>
<body>
<a href="#"></a>
<a onclick="fun1()">111</a>
<a onclick="fun2()">222</a>
<a onclick="fun3()">333</a>
<a onclick="fun4()">444</a>
<script type="text/javascript">
 function fun1() { return ;
 console.log('111 这个不会执行')
 } function fun2() { return false console.log('222 这个不会执行')
 } function fun3() { return true console.log('333 这个不会执行')
 } function fun4() {
 console.log('444 这个会执行')
 } </script>
</body>
</html>

通过上面的例子 可以看出 return ; return false return true 在函数内部都中断了函数的执行

接着看看 他们返回的结果是个啥 代码如下:

 function fun1() {
 return ;
 }
 function fun2() {
 return false
 }
 function fun3() {
 return true
 }
 console.log(fun1())
 // undefined
 console.log(fun2())
 // false
 console.log(fun3())
 // true

返回的结果分别是 undefined false true 注:(undefine != false)

有个知识点 : 表单提交的时候 如果函数返回 false 表单就不提交了 ,切记!

首先看看能提交的情况,代码如下:

<!DOCTYPE html>
<html>
<head>
 <title>return测试</title>
</head>
<body>
 <form method="post" onsubmit="return submitFunction()">
 <input type="text" name="nameId">
 <button type="submit" id="submit">提交</button> 
 </form>
<script type="text/javascript">
 function submitFunction () { return ;
 } </script>
</body>
</html>

效果如下: 右边出现了请求(注意:表单请求会刷新页面)



阻止表单提交的代码如下:

<!DOCTYPE html>
<html>
<head>
 <title>return测试</title>
</head>
<body>
 <form method="post" onsubmit="return submitFunction()">
 <input type="text" name="nameId">
 <button type="submit" id="submit">提交</button> 
 </form>
<script type="text/javascript">
 function submitFunction () { return false;
 } </script>
</body>
</html>

效果如下:右边没有出现请求,请求被阻止了




总结如下:

1. return ; return false return true 都会在函数内部阻止程序的执行。

2. 只有 return false 会阻止表单的提交。

对前端的技术,架构技术感兴趣的同学关注我的头条号,并在后台私信发送关键字:“前端”即可获取免费的架构师学习资料

知识体系已整理好,欢迎免费领取。还有面试视频分享可以免费获取。关注我,可以获得没有的架构经验哦!!