当前位置：首页 > 行业知识 > 12.与JavaScript深入交流-[js一篇通]

行业知识

12.与JavaScript深入交流-[js一篇通]

2026-11-01 04:03:31 来源：互联网转载

文章目录

1.变量的使用
- 1.1基本用法
- 1.2理解动态类型
- 2.基本数据类型
- - 2.1number 数字类型
  - - 2.1.1数字进制表示
    - 2.1.2特殊的数字值
    - 2.2string 字符串类型
    - - 2.2.1基本规则
      - 2.2.2转义字符
      - 2.2.3求长度
      - 2.2.4字符串拼接
      - 2.3boolean 布尔类型
      - 2.4undefined 未定义数据类型
      - 2.5null 空值类型
      - 3.运算符
      - 3.1算术运算符
        3.2赋值运算符 & 复合赋值运算符
        3.3自增自减运算符
        3.4比较运算符
        3.5逻辑运算符
        3.6位运算
        3.7移位运算
        4.条件语句
        4.1if 语句
        4.1.1基本语法格式
        4.1.2练习案例
        4.2三元表达式
        4.3switch
        5.循环语句
        5.1while 循环
        5.2continue
        5.3break
        5.4for 循环
        6.数组
        6.1创建数组
        6.2获取数组元素
        6.3新增数组元素
        6.3.1通过修改 length 新增
        6.3.2通过下标新增
        6.3.3使用 push 进行追加元素
        6.3.4数组的三种循环遍历
        6.4删除数组中的元素
        7.函数
        7.1语法格式
        7.2关于参数个数
        7.3函数表达式
        7.4作用域
        7.5作用域链
        8.对象
        8.1基本概念
        8.1.1使用字面量创建对象 [常用]
        8.1.2使用 new Object 创建对象
        8.1.3使用构造函数创建对象
        8.2理解 new 关键字
        8.3JavaScript 的对象和 Java 的对象的区别
        8.3.1JavaScript 没有 "类" 的概念
        8.3.2JavaScript 对象不区分 "属性" 和 "方法"
        8.3.3JavaScript 对象没有 private / public 等访问控制机制.
        8.3.4JavaScript 对象没有 "继承"
        8.3.5JavaScript 没有 "多态"
        8.3.3JavaScript 对象没有 private / public 等访问控制机制.
        8.3.4JavaScript 对象没有 "继承"
        8.3.5JavaScript ��有 "多态"
        大家好，我是晓星航。今天为大家带来的是 JavaScript语法描述相关的讲解！
        
        1.变量的使用
        
        1.1基本用法
        
        创建变量(变量定义/变量声明/变量初始化)
        
        var name = 'zhangsan';var age = 20;
        
        var 是 JS 中的关键字, 表示这是一个变量.
        
        = 在 JS 中表示 “赋值”, 相当于把数据放到内存的盒子中. = 两侧建议有一个空格
        
        每个语句最后带有一个 ; 结尾. JS 中可以省略 ; 但是建议还是加上.
        
        注意, 此处的 ; 为英文分号. JS 中所有的标点都是英文标点.
        
        初始化的值如果是字符串, 那么就要使用单引号或者双引号引起来.
        
        初始化的值如果是数字, 那么直接赋值即可.
        
        使用变量
        
        console.log(age); // 读取变量内容age = 30; // 修改变量内容
        
        为啥动漫中的角色都是要先喊出技能名字再真正释放技能?
        
        就是因为变量要先声明才能使用.
        
        代码示例: 弹框提示用户输入信息, 再弹框显示.
        
        var name = prompt("请输入姓名:");var age = prompt("请输入年龄:");var score = prompt("请输入分数");alert("您的姓名是: " + name);alert("您的年龄是: " + age);alert("您的分数是: " + score);
        
        也可以把三个输出内容合并成一次弹框
        
        var name = prompt("请输入姓名:");var age = prompt("请输入年龄:");var score = prompt("请输入分数");alert("您的姓名是: " + name + "\n" + "您的年龄是: " + age + "\n" + "您的分数是: " +score + "\n");
        
        + 表示字符串拼接, 也就是把两个字符串首尾相接变成一个字符串.
        \n 表示换行
        JavaScript 中还支持使用 let 定义变量. 用法和 var 基本类似. 用法上的差异此处暂时不讨论.
        
        1.2理解动态类型
        
        JS 的变量类型是程序运行过程中才确定的(运行到 = 语句才会确定类型)
        var a = 10; // 数字var b = "hehe"; // 字符串
        
        随着程序运行, 变量的类型可能会发生改变.
        var a = 10; // 数字a = "hehe"; // 字符串
        
        这一点和 C Java 这种静态类型语言差异较大.
        
        C, C++, Java, Go 等语言是静态类型语言. 一个变量在创建的时候类型就确定了, 不能在运行时发生改变.
        
        而 JS，python，PHP，Lua…都是动态类型，一个变量在创建的时候类型就是可以随便变化的，在运行时不能确定具体类型，但是可以发生改变类型的操作
        
        如果尝试改变, 就会直接编译报错.
        
        动态类型和静态类型适用的范围：
        
        动态类型的语言特别适合初创型公司，规模小，特别赶时间。
        
        而静态类型适合规模大，业务更稳定的公司，因为这类公司大部分时间都在做维护工作，而动态类型由于具体类型不能确定，此时维护的成本就很高(程序猿维护时因为不清楚具体类型在了解类型时会消耗更多的时间成本)
        
        例如：字节，b站，豆瓣，知乎…这些大公司一开始也是使用 JS 来开发大型项目的(因为以前前端页面只有JS，而JS是动态类型没得选)，后来 TS 火了之后，这些大厂纷纷都切换到了 TS 了。(因为TS功能更强大，且是静态类型便于后期的软件维护)
        
        2.基本数据类型
        
        JS 中内置的几种类型
        
        number: 数字. 不区分整数和小数.
        boolean: true 真, false 假.
        string: 字符串类型.
        undefined: 只有唯一的值 undefined. 表示未定义的值.
        null: 只有唯一的值 null. 表示空值.
        2.1number 数字类型
        
        JS 中不区分整数和浮点数, 统一都使用 “数字类型” 来表示.
        
        2.1.1数字进制表示
        
        计算机中都是使用二进制来表示数据, 而人平时都是使用十进制.
        
        因为二进制在使用过程中不太方便(01太多会看花眼).
        
        所以在日常使用二进制数字时往往使用八进制和十六进制来表示二进制数字.
        
        var a = 07; // 八进制整数, 以 0 开头var b = 0xa; // 十六进制整数, 以 0x 开头var c = 0b10; // 二进制整数, 以 0b 开头
        
        注意:
        
        一个八进制数字对应三个二进制数字
        一个十六进制数字对应四个二进制数字. (两个十六进制数字就是一个字节)
        各种进制之间的转换, 不需要手工计算, 直接使用计算器即可.
        
        2.1.2特殊的数字值
        
        Infinity: 无穷大, 大于任何数字. 表示数字已经超过了 JS 能表示的范围.
        
        -Infinity: 负无穷大, 小于任何数字. 表示数字已经超过了 JS 能表示的范围.
        
        NaN: 表示当前的结果不是一个数字.
        
        var max = Number.MAX_VALUE;// 得到 Infinityconsole.log(max * 2);// 得到 -Infinityconsole.log(-max * 2);// 得到 NaNconsole.log('hehe' - 10);
        
        注意:
        
        负无穷大和无穷小不是一回事. 无穷小指无限趋近与 0, 值为 1 / Infinity
        ‘hehe’ + 10 得到的不是 NaN, 而是 ‘hehe10’, 会把数字隐式转成字符串, 再进行字符串拼接.
        可以使用 isNaN 函数判定是不是一个非数字.
        console.log(isNaN(10)); // falseconsole.log(isNaN('hehe' - 10)); // true
        
        2.2string 字符串类型
        
        2.2.1基本规则
        
        字符串字面值需要使用引号引起来, 单引号双引号均可.
        
        var a = "haha";var b = 'hehe';var c = hehe; // 运行出错
        
        如果字符串中本来已经包含引号咋办?
        
        var msg = "My name is "zhangsan""; // 出错var msg = "My name is \"zhangsan\""; // 正确, 使用转义字符. \" 来表示字符串内部的引号. var msg = "My name is 'zhangsan'"; // 正确, 搭配使用单双引号var msg = 'My name is "zhangsan"'; // 正确, 搭配使用单双引号
        
        2.2.2转义字符
        
        有些字符不方便直接输入, 于是要通过一些特殊方式来表示.
        
        \n
        \
        \'
        \"
        \t
        2.2.3求长度
        
        使用 String 的 length 属性即可
        
        var a = 'hehe';console.log(a.length);var b = '哈哈';console.log(b.length);
        
        结果:
        
        42
        
        单位为字符的数量
        
        2.2.4字符串拼接
        
        使用 + 进行拼接
        
        var a = "my name is ";var b = "zhangsan";console.log(a + b);
        
        注意, 数字和字符串也可以进行拼接
        
        var c = "my score is ";var d = 100;console.log(c + d);
        
        注意, 要认准相加的变量到底是字符串还是数字
        
        console.log(100 + 100); // 200console.log('100' + 100); // 100100
        
        2.3boolean 布尔类型
        
        表示 “真” 和 “假”
        
        boolean 原本是数学中的概念 (布尔代数).
        
        在计算机中 boolean 意义重大, 往往要搭配条件/循环完成逻辑判断.
        
        Boolean 参与运算时当做 1 和 0 来看待.
        
        console.log(true + 1);console.log(false + 1)
        
        这样的操作其实是不科学的. 实际开发中不应该这么写.
        
        2.4undefined 未定义数据类型
        
        如果一个变量没有被初始化过, 结果就是 undefined, 是 undefined 类型
        
        var a;console.log(a)
        
        undefined 和字符串进行相加, 结果进行字符串拼接
        
        console.log(a + "10"); // undefined10
        
        undefined 和数字进行相加, 结果为 NaN
        
        console.log(a + 10);
        
        2.5null 空值类型
        
        null 表示当前的变量是一个 “空值”.
        
        var b = null;console.log(b + 10); // 10console.log(b + "10"); // null10
        
        注意:
        
        null 和 undefined 都表示取值非法的情况, 但是侧重点不同.
        
        null 表示当前的值为空. (相当于有一个空的盒子)
        
        undefined 表示当前的变量未定义. (相当于连盒子都没有)
        
        3.运算符
        
        JavaScript 中的运算符和 Java 用法基本相同. 此处不做详细介绍了.
        
        3.1算术运算符
        
        +
        
        /
        %
        3.2赋值运算符 & 复合赋值运算符
        
        =
        +=
        -=
        *=
        /=
        %=
        3.3自增自减运算符
        
        ++: 自增1
        –: 自减1
        3.4比较运算符
        
        >
        =
        == 比较相等(会进行隐式类型转换)
        !=
        === 比较相等(不会进行隐式类型转换)
        !==
        3.5逻辑运算符
        
        用于计算多个 boolean 表达式的值.
        
        && 与: 一假则假
        || 或: 一真则真
        ! 非
        3.6位运算
        
        & 按位与
        | 按位或
        ~ 按位取反
        ^ 按位异或
        3.7移位运算
        
        > 有符号右移(算术右移)
        >>> 无符号右移(逻辑右移)
        4.条件语句
        
        4.1if 语句
        
        4.1.1基本语法格式
        
        条件表达式为 true, 则执行 if 的 { } 中的代码
        
        // 形式1if (条件) { 语句}// 形式2if (条件) { 语句1} else { 语句2}// 形式3if (条件1) { 语句1} else if (条件2) { 语句2 } else if .... { 语句...} else { 语句N}
        
        4.1.2练习案例
        
        代码示例1: 判定一个数字是奇数还是偶数
        
        var num = 10;if (num % 2 == 0) { console.log("num 是偶数");} else { console.log("num 是奇数");}
        
        注意! 不能写成 num % 2 == 1 就是奇数. 负的奇数 % 2 结果可能是 -1.
        
        代码示例2: 判定一个数字是正数还是负数
        
        var num = 10;if (num > 0) { console.log("num 是正数");} else if (num
        代码示例3: 判定某一年份是否是闰年
        
        var year = 2000;if (year % 100 == 0) { // 判定世纪闰年 if (year % 400 == 0) { console.log("是闰年"); } else { console.log("不是闰年"); }} else { // 普通闰年 if (year % 4 == 0) { console.log("是闰年"); } else { console.log("不是闰年"); }}
        
        4.2三元表达式
        
        是 if else 的简化写法.
        
        条件 ? 表达式1 : 表达式2
        
        条件为真, 返回表达式1 的值. 条件为假, 返回表达式2 的值.
        
        注意, 三元表达式的优先级是比较低的.
        
        4.3switch
        
        更适合多分支的场景.
        
        switch (表达式) { case 值1: 语句1; break; case 值2: 语句2: break; default: 语句N;}
        
        用户输入一个整数, 提示今天是星期几
        
        var day = prompt("请输入今天星期几: ");switch (parseInt(day)) { case 1: console.log("星期一"); break; case 2: console.log("星期二"); break; case 3: console.log("星期三"); break; case 4: console.log("星期四"); break; case 5: console.log("星期五"); break; case 6: console.log("星期六"); break; case 7: console.log("星期日"); break; default: console.log("输入有误");}
        
        5.循环语句
        
        重复执行某些语句
        
        5.1while 循环
        
        while (条件) { 循环体;}
        
        执行过程:
        
        先执行条件语句
        条件为 true, 执行循环体代码.
        条件为 false, 直接结束循环
        代码示例1: 打印 1 - 10
        
        var num = 1;while (num console.log(num); num++;} result *= i; i++;}console.log(result) if (i == 3) { i++; continue; } console.log("我在吃第" + i + "个李子"); i++;} if (num % 3 != 0) { num++; // 这里的 ++ 不要忘记! 否则会***循环. continue; } console.log("找到了 3 的倍数, 为:" + num); num++;} if (i == 3) { break; } console.log("我在吃第" + i + "个李子"); i++;} if (num % 3 == 0) { console.log("找到了 3 的倍数, 为:" + num); break; } num++;}// 执行结果找到了 3 的倍数, 为:102 循环体} console.log(num);} result *= i;}console.log("result = " + result); if (arr[i] % 2 != 0) { newArr.push(arr[i]); }}console.log(newArr); 函数体 return 返回值;}// 函数调用函数名(实参列表) // 不考虑返回值返回值 = 函数名(实参列表) // 考虑返回值 console.log("hello");}// 如果不调用函数, 则没有执行打印语句hello(); console.log("hello");} var sum = 0; for (var i = 0; i

上一篇：手机无法上网？别急！原因解析与快速解决建议！

下一篇：服务器散热风向怎么选?

行业知识

12.与JavaScript深入交流-[js一篇通]

文章目录

1.变量的使用

1.1基本用法

1.2理解动态类型

2.基本数据类型

2.1number 数字类型

2.1.1数字进制表示

2.1.2特殊的数字值

2.2string 字符串类型

2.2.1基本规则

2.2.2转义字符

2.2.3求长度

2.2.4字符串拼接

2.3boolean 布尔类型

2.4undefined 未定义数据类型

2.5null 空值类型

3.运算符

3.1算术运算符

3.2赋值运算符 & 复合赋值运算符

3.3自增自减运算符

3.4比较运算符

3.5逻辑运算符

3.6位运算

3.7移位运算

4.条件语句

4.1if 语句

4.1.1基本语法格式

4.1.2练习案例

4.2三元表达式

4.3switch

5.循环语句

5.1while 循环

最新文章

图文

热门标签

友情链接

行业知识

12.与JavaScript深入交流-[js一篇通]

文章目录

1.变量的使用

1.1基本用法

1.2理解 动态类型

2.基本数据类型

2.1number 数字类型

2.1.1数字进制表示

2.1.2特殊的数字值

2.2string 字符串类型

2.2.1基本规则

2.2.2转义字符

2.2.3求长度

2.2.4字符串拼接

2.3boolean 布尔类型

2.4undefined 未定义数据类型

2.5null 空值类型

3.运算符

3.1算术运算符

3.2赋值运算符 & 复合赋值运算符

3.3自增自减运算符

3.4比较运算符

3.5逻辑运算符

3.6位运算

3.7移位运算

4.条件语句

4.1if 语句

4.1.1基本语法格式

4.1.2练习案例

4.2三元表达式

4.3switch

5.循环语句

5.1while 循环

最新文章

图文

热门标签

友情链接

1.2理解动态类型