JavaScript 是⼀种客户端脚本语⾔（脚本语⾔是⼀种轻量级的编程语⾔）。

JavaScript 通常被直接嵌⼊ HTML ⻚⾯，由浏览器解释执⾏

JavaScript 是⼀种解释性语⾔（就是说，代码执⾏不进⾏预编译）。

特点：弱类型和基于对象。(因为⾯向对象需要具有封装、继承、多态的特征)

JavaScript语⾔中包含三个核⼼：ECMAScript基本语法、DOM、BOM

1.2 前端Web技术的组成：HTML、CSS、JavaScript

HTML是⼀种标记语⾔，⽤来结构化我们的⽹⻚内容并赋予内容含义，例如定义段落、标题和数据表，或在⻚⾯中嵌⼊图⽚和视频。

CSS 是⼀种样式规则语⾔，可将样式应⽤于 HTML 内容，例如设置背景颜⾊和字体，在多个列中布局内容。

JavaScript 是⼀种脚本语⾔，可以⽤来创建动态更新的内容，控制多媒体，制作图像动画，还有很多。（虽然它不是万能的，但可以通过简短的代码来实现神奇的功能。）

2，JavaScript使用方法

可以像添加CSS那样将 JavaScript 添加到 HTML ⻚⾯中。CSS 使⽤ <link> 元素链接外部样式表，使⽤ <style> 元素向 HTML 嵌⼊内部样式表，JavaScript 这⾥只需⼀个元素 <script> 。

2.1 内部JavaScript: 使⽤ <script> ... </script> 标签

属性：

charset（可选）字符集设置、
defer（可选执⾏顺序）值：defer、
language(已废除)、
src（可选）使⽤外部的js脚本⽂件
type(必选)类型：值：text/javascript

<script type="text/javascript">
<!--
javaScript语⾔
//-->
</script>

注意

可以在HTML中任何地方插入js脚本，比如可以将js插入head头部（需要特殊处理才能操作body内部元素）、插在body内部，也可以插在body后面（按照程序执行顺序，这样就可以操作body体内）

举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        //此处为javascript语言
        var str = "Hello World!";
        console.log(str);//输出到控制台  
    </script>
</head>
<body>
    <h1>JavaScript语言的使用</h1>
</body>
</html>

2.2 外部 JavaScript

使⽤外部导⼊js会使代码更加有序，更易于复⽤，且没有了脚本的混合，HTML也会更加易读

<script type="text/javascript" src="my.js"></script>

举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>JavaScript语言的使用</h1>
</body>
<script src="./my.js"></script>
</html>

2.3 内联JavaScript处理器

就是将js代码写⼊html代码中，如在html标签的事件中或超级链接⾥。

<button onclick="javaScript语⾔"></button> 
<a href="javascript:alert('aa');alert('bb')">点击</a>

举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>JavaScript语言的使用</h1>
    <button onclick="alert('Hello World!')">点击我</button>
</body>
</html>

3，JavaScript基础语法

3.1 JavaScript的输出

JavaScript 没有任何直接打印或者输出的函数。

若有显示数据可以通过下⾯不同的⽅式来输出：

window.alert() 弹出警告框
document.write() ⽅法将内容写到 HTML ⽂档中
innerHTML 写⼊到 HTML 元素
console.log() 写⼊到浏览器的控制台

参考示例

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>JavaScript实例</title>
</head>
<body>
    <h3>测试JavaScript的输出</h3>
    <div id="did">div层</div>
</body>
<script>
    //弹出⼀个信息提示框
    window.alert("Hello JavaScript!");
 
    //输出到浏览器⻚⾯中
    document.write("这个是⻚⾯中的输出");

    //通过写⼊HTML标签中，完成⻚⾯中的输出
    document.getElementById('did').innerHTML="div层中的输出";

    //控制台上的输出
    console.log("控制台上的输出");
</script>
</html>

多段js代码，其中一段出错，不影响其他代码的效果！

想要换行需要使用br标签

3.2 变量

什么是变量

变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据

为什么要使⽤变量

使⽤变量可以⽅便的获取或者修改内存中的数据

如何使⽤变量使⽤var声明变量

var name;

变量的赋值

var name;
name = "zhangsan";

同时声明多个变量

var name,age,sex;
name = 'lisi';
age = 20;
sex = "man"

同时声明多个变量并赋值

var name = 'wangwu', age = 25;

3.3 变量的命名规则和规范

规则 - 必须遵守的，不遵守会报错

由字⺟、数字、下划线、$符号组成，不能以数字开头
不能是关键字和保留字，例如：for、 if、while。
区分⼤⼩写

规范 - 建议遵守的，不遵守不会报错

变量名必须有意义
遵守驼峰命名法。⾸字⺟⼩写，后⾯单词的⾸字⺟需要⼤写。例如：userName、userPassword

3.4 语句与注释

语句：

⼀般程序中的语句是由表达式加分号构成 ; 组成。(js中的每条语句之间的分割符可以是回⻋换⾏也可以是";"分号(推荐分号))
一行中有多条语句时，必须通过分号隔开；
压缩代码时，多行代码可能合为一行，所以建议每行语句后加分号；

表达式的种类很多：

如：算术表达式、赋值表达式、关系表达式、逻辑表达式等等...
也可以是⼀个函数、⽅法的调⽤

脚本注释： // 单⾏注释和 /* 多⾏注释 */

单⾏注释

单⾏注释以 // 开头。
任何位于 // 与⾏末之间的⽂本都会被 JavaScript 忽略（不会执⾏）。

多⾏注释

多⾏注释以 /* 开头，以 */ 结尾。
任何位于 /* 和 */ 之间的⽂本都会被 JavaScript 忽略。

注释的⽬的：

为程序添加辅助说明，便于阅读理解。
注释掉临时不需要执⾏的代码、便于调试、排错。

4，数据类型介绍

4.1 JavaScript中数据类型

值类型(基本类型)：

字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol。
注意：Symbol 是 ES6 引⼊了⼀种新的原始数据类型，表示独⼀⽆⼆的值。

引⽤数据类型：

对象(Object)、数组(Array)、函数(Function)。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //数值类型
        console.log(typeof a); //undefined 没有定义的变量

        var a = 10; //整数
        console.log(typeof a); //number
        a = 3.14; //浮点数
        console.log(typeof a); //number

        //布尔类型：boolean： 值：true false
        a = true;
        console.log(typeof a); //boolean

        //字符串：使用单引号或双引号都可以定义子符串
        a = "Hello ...";
        console.log(typeof a); //string
        a = null;
        console.log(typeof a); //object

        //引用类型
        var b = [10,20,30]; //数组的定义
        console.log(typeof b); //数组对象object

        console.log(b instanceof Array); //true 检查对象b是否是来源于Array
        console.log(a instanceof Array); //false 检查对象a是否是来源于Array
    
        var ob = new Object();
        console.log(typeof ob); //object
        var fn = function(){} //声明一个空函数
        console.log(typeof fn); //function

    </script>
</head>
<body>
    <h1>JavaScript语言的数据类型</h1>
</body>
</html>

typeof 操作符获取⼀个变量的类型,返回结果如下：

undefined - 如果变量是 Undefined 类型的
boolean - 如果变量是 Boolean 类型的
number - 如果变量是 Number 类型的 (整数、浮点数)
string - 如果变量是 String 类型的（采⽤""、 ''）
object - 如果变量是⼀种引⽤类型或 Null 类型的如： new Array()/ new String()...
function -- 函数类型

typeof "zhangsan" // 返回 string
typeof 3.14 // 返回 number
typeof NaN // 返回 number
typeof true // 返回 boolean
typeof [10,20,30,40] // 返回 object
typeof {name:'lisi', age:20} // 返回 object
typeof new Date() // 返回 object
typeof function(){} // 返回 function
typeof myCar // 返回 undefined (如果 myCar 没有声明)
typeof null // 返回 object

5，整数的二八十六进制转换

5.1 举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>

        console.log("======================================");
        console.log(1.23e5); //1.23*10的5次方
        console.log("整数进制的使用");
        console.log(10); //10 十进制
        console.log(0b10); //2 二进制
        console.log(0o10); //8 八进制
        console.log(0x10); //16 十六进制（0 1 2 3 4 5 6 7 8 9 a b c d e f）
        console.log("===============十进制转成其他进制==============");
        var num = 220;
        console.log(num.toString(2)); //11011100 二进制
        console.log(num.toString(8)); //334 八进制
        console.log(num.toString(16)); //DC 十六进制

        console.log("===============其他进制转成十进制==============");
        console.log(parseInt('11011100',2)); //二进制转十进制
        console.log(parseInt('334',8)); //八进制转十进制
        console.log(parseInt('DC',16)); //十六进制转十进制

    </script>
</head>
<body>
    <h1>JavaScript语言的数据类型</h1>
</body>
</html>

十进制装其他进制：除基取余

其他进制转十进制：Σ权值*权重

5.2 面试题

假设有15瓶水，其中有一瓶水有毒，请问至少使用几只小白鼠可以一次性试（最快）喝出来。

比如编号1、2、3、4的小白鼠，喝完之后的状态（0正常，1死亡）为：0011，即编号3、4的白鼠共同喝过且1、2白鼠都没喝过的水有问题！也就是0011对应的第三瓶水

6，值类型与引用类型的区别

6.1 undefined 和 null 的区别

null 和 undefined 的值相等，但类型不等：

typeof undefined // undefined
typeof null // object
null === undefined // 类型+值比较false
null == undefined // 值比较true

object引⽤类型引⽤类型通常叫做类（class），也就是说，遇到引⽤值，所处理的就是对象。Object 对象⾃身⽤处不⼤，不过在了解其他类之前，还是应该了解它。因为 ECMAScript 中的Object 对象与 Java 中的 java.lang.Object 相似， ECMAScript 中的所有对象都由这个对象继承⽽来，Object 对象中的所有属性和⽅法都会出现在其他对象中，所以理解了 Object 对象，就可以更好地理解其他对象。

6.2 值类型理解：

变量之间的互相赋值，是指开辟⼀块新的内存空间，将变量值赋给新变量保存到新开辟的内存⾥⾯；之后两个变量的值变动互不影响，例如：

var a = 10; //开辟⼀块内存空间保存变量a的值“10”；
var b = a; //给变量 b 开辟⼀块新的内存空间，将 a 的值 “10” 赋值⼀份保存到新的内存⾥；
//a 和 b 的值以后⽆论如何变化，都不会影响到对⽅的值；

6.3 引用类型理解：

变量之间的互相赋值，只是指针的交换，⽽并⾮将对象（普通对象，函数对象，数组对象）复制⼀份给新的变量，对象依然还是只有⼀个，只是多了⼀个指引。

//需要开辟内存空间保存对象，变量 a 的值是⼀个地址，这个地址指向保存对象的空间；
var a = { x: 1, y: 2 };
var b = a; // 将a 的指引地址赋值给 b，⽽并⾮复制⼀给对象且新开⼀块内存空间来保存；
// 这个时候通过 a 来修改对象的属性，则通过 b 来查看属性时对象属性已经发⽣改变；

6.4 举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //值类型和引用类型的区别
        //值类型：
        var a = 10;
        var b = a; //由于a是值类型，故此处赋值，属于开辟一个新空间，将的值复制一份传给了b。
        b = 20;
        console.log(a); //10 

        //引用类型：
        var oa = {name:'zhangsan',age:20};
        var ob = oa; //oa是引用类型，故ob为oa别名。并没有复制一份新对象
        ob.name = "lisi";
        console.log(oa);

    </script>
</head>
<body>
    <h1>JavaScript语言的数据类型</h1>
</body>
</html>

7，数据类型转换

JavaScript 变量可以转换为新变量或其他数据类型：

通过使⽤ JavaScript 函数
通过 JavaScript ⾃身⾃动转换

ECMAScript 中可⽤的 3 种强制类型转换如下：

Boolean(value) - 把给定的值转换成 Boolean 型；
Number(value) - 把给定的值转换成数字（可以是整数或浮点数）；
String(value) - 把给定的值转换成字符串；

使⽤：Number（）、parseInt() 和parseFloat（）做类型转换

Number()强转⼀个数值(包含整数和浮点数)。
*parseInt()强转整数，
*parseFloat（）强转浮点数

函数isNaN()检测参数是否不是⼀个数字。 is not a number

举例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //类型转换
        console.log(String(20))
        console.log(typeof String(20))
        console.log(String(false))
        console.log(String(new Date()))
        console.log(String(null))
        console.log(String([10,20,30]))
        console.log("========数值类型的转换========");
        console.log(Number("30")+20); //50
        console.log("30"+20); //"3020"
        console.log(Number('3.1415926'));
        console.log(Number('3.14abc')); //NaN => Not a Number
        console.log(isNaN("20")); //false 不是一个纯数值判断函数

        console.log(parseInt("40abc")); //40
        console.log(parseInt("40.6abc")); //40
        console.log(parseFloat("40.6abc")); //40.6
        console.log(parseFloat("abc40.8")); //NaN

        console.log(true+1); //2
        console.log("abc"+100); //'abc100'
    </script>
</head>
<body>
    <h1>JavaScript语言的数据类型--类型转换</h1>
</body>
</html>

8，运算符

8.1 按照操作元数的个数不同分为：

⼀元运算符、⼆元运算符和三元运算符：

delete：⽤于删除对象中属性的如：delete o.name; //删除o对象中的name属性
++ -- : ⼀元加法和⼀元减法

8.2 按照种类划分又分为如下运算符

1）算数运算符

注意：其中+号具有两重意思：字串连接和数值求和。

就是加号”+“两侧都是数值则求和，否则做字串连接

2）赋值运算符

3）⽐较运算符

4）逻辑运算符

5）位运算符

位运算符处理 32 位数。
该运算中的任何数值运算数都会被转换为 32 位的数。结果会被转换回 JavaScript 数。

上例使⽤ 4 位⽆符号的例⼦。但是 JavaScript 使⽤ 32 位有符号数。

因此，在 JavaScript 中， ~5 不会返回 10，⽽是返回 -6。

~00000000000000000000000000000101 将返回 11111111111111111111111111111010 。

⽆符号位移（>>>）和有符号位移（>>）的区别是

有符号位移运算时如果数字为正数时位移后在前⾯补0，为负数时则在位移后在前⾯补1

6）条件运算符（三元运算符）

7）逗号运算符

8）类型运算符

instanceof 运算符与 typeof 运算符相似，⽤于识别正在处理的对象的类型。

与 typeof ⽅法不同的是，instanceof ⽅法要求开发者明确地确认对象为某特定类型。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log("=========6.三元运算符========");
        var age = 26;
        var info = (age < 18) ? "太年轻":"足够成熟";
        console.log(info);

        
        console.log("=========7.逗号运算符========");
        var a = 10, b = 20, c = 30;
        console.log(a+":"+b+":"+c); //10:20:30
        
        console.log("=========8.类型运算符========");
        //typeof  instanceof
        var oStringObject = new String("hello world"); 
        console.log(oStringObject instanceof String);   // 输出 "true"
        // 判断 foo 是否是 Foo 类的实例
        function Foo(){} 
        var foo = new Foo(); 
        console.log(foo instanceof Foo)//true
        // 判断 foo 是否是 Foo 类的实例 , 并且是否是其父类型的实例
        function Aoo(){} 
        function Foo(){} 
        Foo.prototype = new Aoo();//JavaScript 原型继承
        var foo = new Foo(); 
        console.log(foo instanceof Foo)//true 
        console.log(foo instanceof Aoo)//true
        
        console.log("=========9.delete运算符========");
        var stu = {name:'zhangsan',sex:'man',age:20};
        console.log(stu);
        delete stu.sex; //删除stu对象中的sex属性
        console.log(stu);
    
    </script>
</head>
<body>
    <h1>JavaScript语言中的运算符--其他运算符</h1>
</body>
</html>

8.3 运算符的优先级

优先级从⾼到底

1. () 优先级最⾼
2. ⼀元运算符 ++ -- !
3. 算数运算符先 * / % 后 + -
4. 关系运算符 > >= < <=
5. 相等运算符 == != === !==
6. 逻辑运算符先 && 后||
7. 赋值运算符 = += -= *= /= %=

9，流程控制——九九乘法表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>JavaScript语言--流程控制训练--九九乘法表</h1>
</body>
<script>
     document.write('<table width="800" border="1">');
     //循环输出行
     for(var j=1; j<=9; j++){
        document.write('<tr>');
        //循环输出字段（列）
        for(var i=1; i<=9; i++){
            //判断是否输出空的单元格
            if(i>j){
                document.write('<td>&nbsp;</td>');// &nbsp;表示输出一个空格
            }else{
                document.write('<td>'+i+'*'+j+"="+(i*j)+'</td>');
            }
        }
        document.write('</tr>');
     }
     document.write('</table>');
     
     document.write('<br/><hr/><br/>');

     document.write('<table width="800" border="1">');
     //循环输出行
     for(var j=1; j<=9; j++){
        document.write('<tr>');
        //循环输出字段（列）
        for(var i=9; i>=1; i--){
            //判断是否输出空的单元格
            if(i>j){
                document.write('<td>&nbsp;</td>');
            }else{
                document.write('<td>'+i+'*'+j+"="+(i*j)+'</td>');
            }
        }
        document.write('</tr>');
     }
     document.write('</table>');


     document.write('<br/><hr/><br/>');

     document.write('<table width="800" border="1">');
     //循环输出行
     var j = 9;
     while(j>=1){
        document.write('<tr>');
        //循环输出字段（列）
        var i = 1;
        while(i <= 9){
            //判断是否输出空的单元格
            if(i>j){
                document.write('<td>&nbsp;</td>');
            }else{
                document.write('<td>'+i+'*'+j+"="+(i*j)+'</td>');
            }
            i++;
        }
        document.write('</tr>');
        j--;
     }
     document.write('</table>');


     document.write('<br/><hr/><br/>');

     document.write('<table width="800" border="1">');
     //循环输出行
     var j = 9;
     do{
        document.write('<tr>');
        //循环输出字段（列）
        var i = 9;
        do{
            //判断是否输出空的单元格
            if(i>j){
                document.write('<td>&nbsp;</td>');
            }else{
                document.write('<td>'+i+'*'+j+"="+(i*j)+'</td>');
            }
            i--;
        }while(i >= 1);
        document.write('</tr>');
        j--;
     }while(j>=1);
     document.write('</table>');
</script>
</html>

10，函数

10.1 函数的定义方法

函数是什么:

函数（function）是⼀段完成指定任务的已命名代码块。函数可以遵照给它的⼀组值或参数完成特定的任务，并且可能返回⼀个值。

在JavaScript中有两种函数：

⾃定义函数与系统函数。

标准格式：（中括号表示可选）

function 函数名（[参数列表..]）{
 函数体。。。
 [return 返回值;]
}

JavaScript三种定义函数方法：

第⼀种是使⽤function语句定义函数如上⾯格式

第⼆种是使⽤Function()构造函数来定义函数（不常⽤）

var 函数名 = new Function(“参数1”，”参数2”，”参数3”……”函数体”);

如： var 函数名 = new Function(”x”,”y”,”var z=x+y;return z;”);

第三种是在表达式中定义函数

var 函数名 = function(参数1，参数2，…){函数体};

例如：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
        //函数的定义：
        function myfun(){
            console.log("aaaaaaaaa");
            console.log("bbbbbbbbb");
            console.log("ccccccccc");
            console.log("ddddddddd");
        }

        //函数使用
        myfun();
        console.log("-------------------");
        myfun();
        console.log("-------------------");
        myfun();
        console.log("-------------------");
       */


       //函数的定义方式：
       //1.标准式
       function demo1(){
           console.log("Hello Demo1");
       }

       demo1();

       //2.使用Function()构造函数定义
       var demo2 = new Function('console.log("Hello Demo2");');

       demo2();

       //3.使用表达式方式定义（匿名）
       var demo3 = function(){
            console.log("Hello Demo3"); 
       }

       demo3();

       //4. 函数自调用定义（括号括起方法的定义，并再次添加括号）
       (function(){
            console.log("Hello Demo4");
       })();
    </script>
</head>
<body>
    <h1>JavaScript语言中的函数</h1>
</body>
</html>

10.2 函数中的参数

arguments 对象

在函数代码中，使⽤特殊对象 arguments，开发者⽆需明确指出参数名，就能访问它们。
arguments是⼀个对象,是⼀个伪数组，arguments[索引]---->实参的值
也可以访问这个值，即第⼀个参数的值（第⼀个参数位于位置 0，第⼆个参数位于位置 1，依此类推）。
arguments.length--->是实参的个数

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //函数中的参数
        function mysum(m){
            total = 0;
            for(var i=0; i<=m; i++){
                total += i;
            }
            console.log(m+"的累加值："+total);
        }

        //使用
        mysum(10);
        mysum(50);
        mysum(100);

        console.log("=============================");

        //定义多个参数的调用
        function myadd(a,b){
            console.log(a+b);
        }

        myadd(10,20);
        myadd(100,200);
        myadd(200);
        myadd(200,300,400);
        
        console.log("=============================");

        //arguments 对象
        function fun(){
            console.log(arguments);
            //遍历输出所有参数值
            for(var i in arguments){
                console.log(arguments[i]);
            }
        }

        fun(10,20,30,40,50);
    </script>
</head>
<body>
    <h1>JavaScript语言的函数</h1>
</body>
</html>

10.3 函数中的返回值

函数中的返回值：

如果⼀个函数中有return ,那么这个函数就有返回值
如果⼀个函数中没有return,那么这个函数就没有返回值
如果⼀个函数中没有明确的返回值,那么调⽤的时候接收了,结果就是undefined
(没有明确返回值:函数中没有return或函数中有return,但是return后⾯没有任何内容)
函数内容执⾏遇到return，则⽴刻执⾏返回，且下⾯的代码是不会被执⾏的

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //函数中的返回值：
        
        //统计指定参数的累加值函数
        function mysum(m){
            total = 0;
            for(var i=0; i<=m; i++){
                total += i;
            }
            return total; //返回结果
        }

        //使用
        var a = mysum(10);
        console.log("10的累加值："+a);
        console.log("50的累加值："+mysum(50));
        console.log("100的累加值："+mysum(100));
        
        console.log("=========================");


        function fun(m){
            console.log("111111");
            console.log("222222");
            if(m>=10){
                return; //执行return后，就会终止当前函数的执行
            }
            console.log("333333");
        }

        console.log(fun(18)); //undefined
        console.log("=========================");

        function demo(){
            console.log("aa");
            return "cc";
        }
        console.log("bb"+demo()); //aa  bbcc
    </script>
</head>
<body>
    <h1>JavaScript语言的函数</h1>
</body>
</html>

10.4 函数之变量作用域

关于变量作⽤域：

由于函数的出现导致了变量的定义分为函数内定义和函数外定义，即全局和局部变量

全局变量:在函数外使⽤var声明的变量就是全局变量,全局变量可以在⻚⾯的任何位置使⽤

全局变量,如果⻚⾯不关闭,那么就不会释放,就会占空间,消耗内存。

局部变量:在函数内使⽤var关键字定义的变量是局部变量，即出了函数外边⽆法获取。

隐式全局变量:没有使⽤var声明的变量,就叫隐式全局变量，在函数内外都可以获取到。

全局变量是不能被删除的,隐式全局变量是可以被删除的（使⽤delete）

定义变量使⽤var是不会被删除的,没有var是可以删除的

函数外⾯定义的变量是全局变量，函数内可以直接使⽤。

在函数内部没有使⽤var定义的=变量则为全局变量。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //变量的作用域：

        /*
        var name = "zhangsan"; //全局变量

        function demo(){
            console.log("函数内输出全局变量1："+name);
            name = "lisi";
            console.log("函数内输出全局变量2："+name);
        }

        console.log("函数外输出全局变量1："+name);
        demo();
        console.log("函数外输出全局变量2："+name);
        */

        /*
        function demo2(){
            var uname = "zhangsan"; //局部变量
            console.log("函数内输出全局变量："+uname);
        }
        demo2(); //函数调用
        //console.log("函数外输出全局变量2："+uname); //报错，不存在

       //console.log(window);
        */

        //隐式全局变量:没有使用var声明的变量,就叫隐式全局变量，在函数外可以获取到。
        var b = 20;
        function demo3(){
            a1 = 10; //没有var声明的变量 隐式全局变量
            console.log(a1);
            console.log(b);
        }

        demo3();
        delete b; //只可以删除隐式全局变量
        console.log(a1);
        console.log(b);
    </script>
</head>
<body>
    <h1>JavaScript语言的函数</h1>
</body>
</html>

10.5 函数之常用内置函数

escape() //字串编码

unescape() //字串反编码

*eval() //将参数字符串作为脚本代码来执⾏。

*isNaN() // is not a number (不是⼀个数值)

*parseInt()

*parseFloat()

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //内置函数：
        /*
        escape()    //字串编码
        unescape()    //字串反编码
        *eval()        //将参数字符串作为脚本代码来执行。
        *isNaN()      // is not a number (不是一个数值)
        *parseInt()
        *parseFloat()
        */

        var url = "http://www.***.com/a.html?name=张三&age=20";

        console.log(url);
        url2 = escape(url);
        console.log(url2);
        console.log(unescape(url2));

        console.log("--------------------");

        var str = "var uname='zhangsan',age=20;";
        eval(str); //将参数str字串当成js脚本程序执行
        console.log(uname);

        console.log(isNaN("10s"));
        
        console.log(parseInt("34as4567dfg"));


        </script>
</head>
<body>
    <h1>JavaScript语言的函数</h1>
</body>
</html>

章节汇总在这里（づ￣3￣）づ╭❤～@&再见萤火虫&【04-前端技术】

对学习Java感兴趣的同学欢迎加入QQ学习交流群：1126298731

有问题欢迎提问，大家一起在学习Java的路上打怪升级！(o゜▽゜)o☆[BINGO!]

04-前端技术_javaScript基础

四，javaScript基础

1，JavaScript语言介绍

1.1 什么是JavaScript？