JavaScript(学习笔记）-2.基础语法

最新推荐文章于 2024-07-30 22:36:34 发布

加油小王！！

最新推荐文章于 2024-07-30 22:36:34 发布

阅读量221

点赞数 2

分类专栏： JavaScript 文章标签： javascript html html5

本文链接：https://blog.csdn.net/qq_52107548/article/details/119960046

版权

JavaScript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

基础语法

1.语法概述
2.JavaScript 基础语法
3.JavaScript变量及内置数据类型
4.流程控制结构
详细代码：

1.语法概述

语法特点：

弱类型：变量的数据类型可以任意转换
动态类型：变量声明创建时不用指定数据类型

2.JavaScript 基础语法

2.1 JavaScript语句：

语句就是命令，告诉浏览器要做什么
语句以分号结束

2.2 JavaScript语句块：

多个语句可放在“{}"内，形成一个语句块

if(true){
document.write(1);
doucument.write("</br>");
document.write("第二条语句执行");
document.write('<h1>hh</h1>');
}

2.3 JavaScript输出内容的3种方式

document.write()页面输出内容
console.log()控制台输出
alert()弹出框输出

在这里插入图片描述

2.4 注释

单行注释：//
多行注释：/**/

3.JavaScript变量及内置数据类型

3.1 字面量：

例如：1、2、3、3.14、‘hello’、“world”、“34”、true、false

3.2 变量:

使用关键字var创建变量

JS为动态类型语言，声明变量时，不需要指明数据类型
使用=为变量赋值
值为字符串时使用''或""引起来

变量命名：

区分大小写
以字母或下划线或$开头
变量名不能是关键字、保留字

3.3 原始数据类型

注意：

卷面上：类型首字母会大写用以区分类型所对应的值，代码上仍然都是小写
判断变量在某一时刻的数据类型，使用typeof运算符

Number类型：1 、3.14 、1e6(不区分整数、浮点数，只有一种类型Number类型）

String类型： 用''或""引起一组字符

Boolean类型： true或false

Undefined类型：

只有一个值undefined
只声明了但未赋值，如var a;

Null类型：

只有一个null，表示值为空
null不等同于空的字符串或0
undefined派生于Null

认识NaN()函数（Not a Number)

表示一个没有意义，不正确的数值
console.log(typeof NaN);—Number
与自身不相等—NaN!=NaN

认识isNaN()函数

用来检测参数是否为NaN值
参数是NaN时返回true，不是NaN时返回false
不是数值返回true，是数值返回false

3.4 运算符

在这里插入图片描述
1.+:拼接字符串
注意：出现字符串后都需按字符串拼接形式
2.比较运算符：==与===
==：值相等为true
===:值和类型相等为true
3.+、-、*、/，这些运算符运算规则均按照数学规则

3.5 数据类型转换

1.隐式转换：

转换成String类型，用+连接
var sum ='img'+3+'.jpg';->img3.jpg
转换成Boolean类型：变量前面加???
2.显示转换：
全局函数

4.流程控制结构

详细代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>

    <style>
        /* 编写CSS代码 */
    </style>

</head>
<body>

    <!-- 引入外部JS文件： -->
    <script src="index.js"></script>

    <!-- 内部JS -->
    <script>
        // 2021.8.29!!!!!
        //1.注释的形式在CSS中，JS，HTML中有所不同
        //2.Script标签里编写js代码
        
        //3.两种书写形式：HTML文件中，任何JavaSript代码必须放到<script>标签中
        //4.js有报错，打开控制台看报错信息

        //5.在浏览器弹出提醒框
        //alert('Hello world')

        // 6.console.log的情况
        console.log('hahaha');
         // console.log(age);该语句会报错，因为age没有定义
        
        //  7.document.write()页面输入
        // （1）标签也可以写在document.write里边
        document.write('你真漂亮QAQ');
        document.write('<h1>你真漂亮QAQ</h1>');
       
        // 8.变量声明，且为弱类型,但一个时刻只能是一种类型
        var num=100;
        num='string';

        // 9.typeof 运算符来确定变量类型
        console.log(typeof num);
        num=100;
        console.log(typeof num);

        // 10.Undefined,只声明了但未初始化
        // 因此下面a在控制台中显示的类型为Undefined
        // Undefined的值和类型是一样的
        var a;
        console.log(a);

        // 11.Null类型只有一个值null,表示值为空，null不等同于空的字符串('')或0
        // (1)在控制台中显示是空值 空对象(object) 
        // (2)null的值和类型是一样的
        // (3)以下步骤的作用：如果某个变量将来要赋值的是对象类型的值，那初始化的时候赋值null
        // (4)undefined是派生于null的，两者在一定程度上相同，类型不同
        // 在使用undefined时赋值不赋值undefined均可，但null要想使用必须赋值
        var b = null;
        console.log (typeof b);

        // 12.Js中，计算时不用取舍正常计算
        var n1 = 100;
        var n2 =200.45;
        console.log(n1+n2);
        // 结果300.45
        console.log(10/4)
        // 结果为2.5

        // 13.NaN,表示一个没有意义、不正确的数值
        var x = 'abc';
        var y = 10;
        console.log(x/y);

        // 14.isNaN()函数，函数为true时：不是数值；false时：是数值
        isNaN('123abc');
        // 纯数字的字符串返回的是false，他认为是数值
        isNaN('123');

        // 15.运算符中‘+’字符串拼接【重要】
        // 当数字和字符串进行+运算时，数字会隐式转换成字符串，进行拼接
        // 当出现一个字符串就会进行字符串拼接
        console.log('100'+100);
        // 结果：100100
        console.log(100+100+'100');
        // 结果：200100
        console.log(100+100+'100'+100);
        // 结果：200100100

        // 16.===运算符
        // 当为true时：===完全相等（数值和类型），==（数值相等）
        console.log(3 == '3');
        console.log(3==='3');
        console.log(undefined == null);
        console.log(undefined === null);

        // 17.运算符(),改变优先顺序

        // 18.隐式转化
        // (1)数字->字符串：转换成String类型，用+连接
        var sum = 'img'+3+'.jpg';
        // (2)数字类型->布尔类型：转换成Boolean类型：变量前加！！（相当于取反）
        console.log(!!123);
        // (3)布尔类型->数字类型，结果为21
        console.log(22-true);

    </script>
</body>
</html>

结果图：
在这里插入图片描述

加油小王！！

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript(学习笔记）-2.基础语法

基础语法1.语法概述2.JavaScript 基础语法3.JavaScript变量及内置数据类型3.1 JavaScript语句：3.2 JavaScript语句块：3.3 JavaScript输出内容的3种方式3.4 注释1.语法概述语法特点：弱类型：变量的数据类型可以任意转换动态类型：变量声明创建时不用指定数据类型2.JavaScript 基础语法3.JavaScript变量及内置数据类型3.1 JavaScript语句：语句就是命令，告诉浏览器要做什么语句以分号结束3.2
复制链接

扫一扫

专栏目录