JavaScript中||和&&的神奇用法

JS中有时会遇到下面的情况：

1.需求 如果name1不为空，赋值给name如果name1为空，name2不为空，把name2赋值给name 依次类推
2.如果条件成立 执行后面的代码块

请看下面的|| 和 && 的简洁方案

            /*||和&&的用法*/
    function test() {
        var  name = "";
        var name1 = "名字一";
        var name2 = "名字二";
        var name3 = "名字三";
        var name4 = "名字四";

        /*需求  如果name1不为空，赋值给name
        *如果name1为空，name2不为空，把name2赋值给name 依次类推*/
        if (name1)
        {
            name = name1;
        }
        else if (name2)
        {
            name = name2;
        }
        else if (name3)
        {
            name = name3;
        }
        else
        {
            name = name4;
        }

        console.log(name);


        /*简洁方案*/
        /*上面的代码就略显复杂了  使用下面的代码也可以达到要求*/
        name = name1 || name2 || name3 || name4;

        console.log(name);


        var  age = 30;

        /*如果条件成立 执行后面的代码*/
        if (age > 20)
        {
            console.log("年龄大于20");
        }

          /*简洁方案*/
        /*下面的代码同样可以达到要求*/
        (age > 20) && console.log("年龄大于20");

        // (条件) &&
        // {
        //     成立时执行的代码块
        // }
    }