这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天

学习笔记

---

对Javascript的认识

前端最核心的三种技术是HTML、CSS和JavaScript。在学习JavaScript之前，已经学习了HTML和CSS基础知识，接下来就是对Javascript的学习。

Javascript是一种属于网络的脚本语言,已经被广泛用于Web应用开发。虽然Javascript是作为Web开发而出名，但它不仅仅用于Web领域，他也被用于许多的非浏览器领域。

对Javascript的基础学习

如何写Javascript：

<script>
    // 控制台的输出
 console.log('123123');
</script>

基础的变量与常量
变量可以更改，而常量不可以更改。

<script>
    // 声明变量
    let a;
    a = 10;
    console.log('a =' + a);
    // 常量，不可更改
    const b = 70;
    console.log('b =' + b);
    // b = 80; 错误的做法。
</script>

Javascript的基础数据类型
JavaScript 定义了 6 种基本数据类型。

1. String 字符串
2. Number 数值
3. Boolean 布尔值
4. Null 空值
5. Undefined 未定义
6. Object 对象

<script>
    let a = 10;

    let b = 3.14;

    let c = '这是一个字符串';

    let d = true;
    let e = false;

    let f = 'asdasd' / 10;

    let g; 
   
</script>

<script>
    let a = 10;
    let b = 20;
    window.document.writeln('a + b = ' + (a + b) + '<br>');
    window.document.writeln('a - b = ' + (a - b) + '<br>');
    window.document.writeln('a * b = ' + (a * b) + '<br>');
    window.document.writeln('a / b = ' + (a / b) + '<br>');
    window.document.writeln('20 % 3 = ' + (20 % 3) + '<br>');
</script>

逻辑运算符：

<script>
    let a = 10;
    let b = 10;
    // "=="比较的是值
    window.document.writeln("a == b >>> " + (a == b) + '<br>');
    // "==="比较的是值和内存地址（绝对比较）
    window.document.writeln("a === b >>> " + (a === b) + '<br>');
    window.document.writeln("a != b >>> " + (a != b) + '<br>');
    let c = true;
    let d = false;
    window.document.writeln("true == false >>> " + (true == false) + '<br>');
    window.document.writeln("true == false >>> " + (true == false) + '<br>');
    window.document.writeln("true && false >>> " + (true && false) + '<br>');
    window.document.writeln("true || false >>> " + (true || false) + '<br>');
</script>

条件语句

<script>
    // if(条件表达式){代码块}
    // 如果条件返回结果为true则执行代码块,如果条件返回结果为false则不执行代码块
    let a = true;
    if (a) {
        window.document.writeln('<h1>a的值为true<h1>');
    }
    let b = false;
    if (b) {
        window.document.writeln('<h1>b的值为true<h1>');
    } else {
        window.document.writeln('<h1>b的值为false<h1>');
    }
    window.document.writeln('<hr>');
    let weekDay = 10 % 8;
    if (weekDay == 1) {
        window.document.writeln('今天是星期一');
    } else if (weekDay == 2) {
        window.document.writeln('今天是星期二');
    } else if (weekDay == 3) {
        window.document.writeln('今天是星期三');
    } else if (weekDay == 4) {
        window.document.writeln('今天是星期四');
    } else if (weekDay == 5) {
        window.document.writeln('今天是星期五');
    } else if (weekDay == 6) {
        window.document.writeln('今天是星期六');
    } else {
        window.document.writeln('今天是星期日');
    }
</script>

if选择结构：

未完待续。。。。。。。。。。。。。。。

组件的封装学习

一个好的组件应该有以下特性：

• 封装性
• 扩展性
• 正确性
• 复用性