JavaScript-入门第二周学习笔记2

目录

一、函数内容的补充

1、创建并调用

2、作用域

3、声明提前

4、按值传递

二、预定义的全局变量

1、编码和解码

 2、isFinite(num)-判断num是不是无穷大

3、parseInt/parseFloat/isNaN/eval

三、分支结构：switch分支

        1、语法：

        2、特殊情况

扩展：

        JS动画

---

一、函数内容的补充

1、创建并调用

        ①创建

                Ⅰ【声明方式】创建函数
                               function 函数名(形参,...){
                                        函数体;
                                        return 返回值/结果;
                               }

                Ⅱ【直接量方式】创建函数 - 无用
                               var 函数名=function(形参,...){
                                        函数体;
                                        return 返回值/结果;
                               }

        ②调用

var 接住返回的结果=函数名(实参,...);

            //其实return的本意退出函数，但是如果return后跟着一个数据，
            //顺便将数据返回到函数作用域的外部，但return只负责返回，不负责保存
            //就算省略return，默认也会return undefined;
            //具体需不要得到函数的结果，看你自己

                return的使用：

function f1(){
    var a=100;
    return a;
}
var result=f1();
console.log(result);    //100

2、作用域

        ①全局作用域：全局变量 和 全局函数，在页面的任何一个位置都可以使用。

        ②局部/函数作用域：局部变量 和 局部函数，在当前函数调用时内部可用。

                变量的使用规则：有限使用自己的，自己没有找全局，全局没有就报错。

                缺点：

                        Ⅰ千万不要在函数中对未声明的变量直接赋值，会导致全局污染。

                        Ⅱ 局部可以用全局，但是全局不能只用局部变量（解决方法：return）

3、声明提前

        在程序正式执行之前，
        将var声明的变量（轻，更靠前）和function声明的函数（重，更靠后），
        都会悄悄集中定义在当前作用域的顶部，
        但是赋值留在原地，
        声明方式创建的函数会完整的提前，
        直接量方式创建的函数不会完整提前，只有变量部分会提前。

注意：

        ①变量名和函数名不要重复。

        ②先创建后使用。

        ③如果笔试时需要先调用后创建，多半是在考声明提前。

笔试题小案例：

function f1(){
    console.log(a);    //10
    a=20;
    console.log(a);    //20
}
console.log(a);        //undefined
var a=10;
f1();
console.log(a);        //20
a=100;
console.log(a);        //100

//控制台输出结构：
//undefined
//10
//20    
//20    
//100

4、按值传递

        两个变量之间进行赋值。

        ①如果传递的是原始类型的值：

                修改一个变量，另一个变量是不会受到影响的，其实是赋值了一个副本给对方

        ②如果传递的是引用类型的对象：

                修改一个变量，另一个变量是会收到影响的，因为操作的其实是同一个地址值。

二、预定义的全局变量

        前辈们提前创建好的方法，我们可以直接使用。

1、编码和解码

        问题：url中不允许出现多字节字符，如果出现会乱码
        utf-8编码格式下，一个汉字，3字节
        解决：发送前，前端将多字符原文编码为单字节字符（数字、字母）
                   发送后，后端将单字节字符解码为多字节原文

        使用语法：
          

//编码：
var code=encodeURIComponent("原文");
//解码：
var 原文=decodeURIComponent(code);

        tip:其实这个东西在某次浏览器更新后，就当场淘汰了，浏览器自带此功能

 2、isFinite(num)-判断num是不是无穷大

        ture->有限数字        false->无穷大

        为false的情况：NaN,Infinity,分母为0

3、parseInt/parseFloat/isNaN/eval

        eval(str)：计算字符串，简单来说就是脱字符串的衣服（去掉字符串的引号）

三、分支结构：switch分支

        1、语法：

switch(变量/表达式){
    case 值1:操作1;break;
    case 值2:操作2;break;
    default:默认操作；
}

        2、特殊情况

                ①case的比较不带隐式转换。

                ②问题：默认只要一个case满足后，会将后面所有的操作全部做完。

                        解决办法： break；

                        建议：每一个case的操作后都跟上一个break（最后的一个操作default可以省略break，如果中间多个条件做的操作是一样的，也可以不要。）

                ③defaul可以省略，如果条件都不满足的情况下，什么操作都不会执行。

 面试题：if和switch的区别

1、switch..case..

缺点：必须要知道准备的结果才能使用，不能做范围判断。

优点 ：执行效率相对较高。

2、if..else

缺点：执行效率相对较低。

优点：可以是范围判断。

建议：代码优化，尽量将所有if..else换成switch..case或三目运算 

扩展：

        JS动画

        js操作样式，瞬间生效的，只需要加上过渡（transition）。

        animate.css动画库