【浅学 JavaScript 】

爱喝阔落的猫

已于 2023-06-27 22:34:55 修改

阅读量254

点赞数

分类专栏： # Html_Css_JavaScript_Jquery 文章标签： javascript 学习

于 2023-06-27 09:22:41 首次发布

本文链接：https://blog.csdn.net/qq_43520227/article/details/131409903

版权

Html_Css_JavaScript_Jquery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

浅学JavaScript 笔记记录

一、JavaScript

一、JavaScript

1. JavaScript介绍

在这里插入图片描述

2. 快速入门

js两种引入方式

方法一：
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<button id="btn">点我呀</button>
</body>
<!--方式一 同一页面内-->
<script>
    document.getElementById("btn").onclick = function () {
        alert("点我干嘛");
    }
</script>
</html>
方法二：
document.getElementById("btn").onclick = function () {
    alert("点我干嘛");
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<button id="btn">点我呀</button>
</body>
<!--方式一 同一页面内-->
<script src="js/my.js">
</script>
</html>

在这里插入图片描述

3. 基本语法

3.1 注释

    //单行注释
    /*
     多行注释的内容
    */
    alert("hello js s");

3.2 输入输出语句

    //1.输入框
    // prompt("请输入数据");
    //2.弹出警告框
    // alert("hello")
    //3.控制台输出
    // console.log("hello js");
    //4.页面内容输出 没有换行
    document.write("hello js");
    document.write("<br>");
    document.write("hello js");

3.3 变量和常量

    //1. 定义局部变量
    let name = "张三";
    let age = 23;
    document.write(name + "," + age + "<br>");

    //2.定义全局变量 不需要写修饰符
    {
        let a = "aa";
        b = "bb";
    }
    // document.write(a);
    document.write(b);
    //3.定义一个常量
    const PI = 3.1415926;
    document.write(PI);

3.4 原始数据类型

在这里插入图片描述

3.5 运算符

在这里插入图片描述

    //字符串类型数字进行运算，会自动类型转换
    let num = "10";
    document.write(num + 5 + "<br>"); //105
    document.write(num + "5" + "<br>"); //105
    document.write(num - 5 + "<br>"); //5
    document.write(num * 5 + "<br>"); //50

    let num2 = 10;
    document.write(num == num2); //true 只比较值是否相同 
    document.write(num === num2);//false 比较类型 然后比较值 类型不匹配直接false

3.6 流程控制语句

跟java一样

3.7 数组

    //定义数组
    let arr = [10, 20, 30];
    arr[3] = 40;
    for (let i = 0; i < arr.length; i++) {
        document.write(arr[i] + "<br>");
    }
    document.write("--------------------<br>")
    //数组高级运算符 ...
    //复制数组 
    let arr2 = [...arr];
    for (let i = 0; i < arr2.length; i++) {
        document.write(arr2[i] + "<br>");
    }
    document.write("--------------------<br>")
    //合并数组
    let arr3 = [40, 50, 60];
    let arr4 = [...arr2, ...arr];
    for (let i = 0; i < arr4.length; i++) {
        document.write(arr4[i] + "<br>");
    }
    document.write("--------------------<br>")
    //将字符串转成数组
    let arr5 = [..."heima"];
    for (let i = 0; i < arr5.length; i++) {
        document.write(arr5[i] + "<br>");
    }
    document.write("--------------------<br>")

4. 函数

在这里插入图片描述

 //无参无返回值
    function println() {
        document.write("hello js" + "<br>");
    }
    //方法调用
    println();

    //有参有返回值
    function getSum(num1, num2) {
        return num1 + num2;
    }
    //方法调用
    let result = getSum(10, 20);
    document.write(result + "<br>");

    //可变参数 对n个数字求和
    function getSums(...params) {
        let sum = 0;
        for (let i = 0; i < params.length; i++) {
            sum += params[i];
        }
        return sum;
    }
    let sumx = getSums(1, 5, 6, 4);
    document.write(sumx + "<br>");
    //匿名函数
    let fun = function () {
        document.write("hello js ");
    }
    fun();