JavaScript基础介绍

泡^沫8

已于 2022-11-19 09:00:39 修改

阅读量771

点赞数 4

文章标签： javascript

于 2022-11-18 20:57:08 首次发布

本文链接：https://blog.csdn.net/weixin_74792903/article/details/127928362

版权

一.javaScript是什么

JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

二.javaScript的作用

1.嵌入动态文本于HTML页面。

2.对浏览器事件做出响应。

3.读写HTML元素。

4.在数据被提交到服务器之前验证数据。

5.检测访客的浏览器信息。控制cookies，包括创建和修改等。

6.基于Node.js技术进行服务器端编程。

三.组成部分

1.ECMAScript ：JavaScript的基本语法

2.DOM:文档对象模型，用来获取或设置文档中标签的属性

3.BOM:浏览器对象模型，用来获取或设置浏览器得属性、行为

1.js的书写位置

①行内样式

②内部样式

③外链样式

行内样式(了解)

<head> 
<title>行内样式</title>
</head>

<body>
    <!-- 三种引入方式 -->
    <!-- 1.行内 了解-->

    <button onclick="alert('我的')">你好</button>
</body>

内部样式

① 必须放在结束body标签的上方,为了更好的操作标签
② 内部js不带src属性

<head>
    <title>内部样式</title>
</head>

<body>

    <!--2. 内链
        注意点:
        1.必须放在结束body标签上方.为了更好操作标签 
        2.内部js不带scr属性
    -->
 <script> alert('你好') </script>
</body>

外链样式

①外部js的script 里面不能写代码，不生效

②写项目时使用外部js ,更加直观

<head>
    <title>外链样式</title>
</head>

<body>

    <!-- 1.外链 js  在写项目时使用
        注意点
    1.外部js的script 里面不能写代码 ,不生效
    2.写项目时使用外部js ,更加直观-->
 <script src="./js/demo.js"> </script> 


</body>

2.js的注释

① 单行注释
符号：// 右边这一行的代码会被忽略
② 多行注释
符号：/**/ 右边这一行的代码会被忽略
③ 注释的作用：方便程序员查看和理解，浏览器不解析

3.js的结束符

js引擎在执行语句代码换行时,默认是可以在一行显示,但是要以分号隔开

不打分号.我们要换行,回车键在js引擎解析时会默认为;号

总结: 在实际开发分号可以不加,按照团队要求进行判断是否添加

<head>
    <title>结束符</title>
</head>

<body>
    <!-- 结束符
    符号英文;号
    作用:让语句结束
    -->
    <script>
        //js引擎在执行语句代码换行时,默认是可以在一行显示,但是要以分号隔开
    /*    alert(1);
          alert(2); */
        // 不打分号.我们要换行,回车键在js引擎解析时会默认为;号
        alert(1)
        alert(2)
        // 总结: 在实际开发 分号可以不加,按照团队要求进行判断是否添加
    </script>
</body>

4.输入和输出语

输入和输出语法是js制定的规则

①输入

在页面弹出对话框，提示用户输入内容

②输出

在页面的body标签内输出内容，能够解析标签

在页面弹出提示框，提示用户

在控制台打印输出，给程序员调试错误使用

5.五大基本数据类型

JavaScript不能识别所有的数据，任何编程语言的编译器都不同，都有属于自己的数据类型。不同数据存储与处理方式不同，给数据分类能够更加充分和高效的利用内存,也能更加方便程序员使用数据。

①数字型 :number 类型整数正数小数负数

②字符串类型: string "", '', ``,包裹的数据称为字符串类型

③布尔类型 :boolean类型固定的值 true真 false假

④undefined :未定义固定的值表示没有值值不存在

⑤null :空值

如图所示


<head>
    <title>五大基本数据类型</title>
</head>

<body>
    <script>
        //1.数字型 number 类型 整数 正数 小数 负数
        console.log(11); //整数 正数
        console.log(1.1); //小数 
        console.log(-11); //负数

        //2.字符串类型 string "", '', ``,包裹的数据称为字符串类型
        console.log("123");
        console.log('123');
        console.log(`123`);
        //引号是可以嵌套的 外单内双 外双内单
        console.log("我的'高圆圆'");

        //3.布尔类型 boolean类型 固定的值 true真 false假
        console.log(true);
        console.log(false);
        //作用:进行判断的时候使用

        //4.undefined 未定义 固定的值 表示没有值 值不存在
        console.log(undefined);

        //5. null 空值
        console.log(null);

    </script>
</body>

6.检测数据类型

typeof 运算符可以返回被检测的数据类型

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        //检测数据类型 typeof 关键词 作用:检测数据类型
        // 关键词 有特殊作用的英文单词
        // 运算符

        // 用法1.typeof 数据 用的比较多,推荐大家使用
        console.log(typeof 10); //number
        console.log(typeof '你好');//string

        // 用法2:typeof(数据)
        console.log(typeof (true));//boolean

        console.log(typeof (undefined));//undefined
        console.log(typeof (null)); //object对象
    </script>
</body>

7.变量

①变量

变量是计算机中用来存储数据的“容器”，简单来说就是一个装东西的盒子,作用是存储数据。

②变量的基本使用

变量声明
声明变量有两部分构成：声明关键字、变量名（标识）
let 即关键字 (let: 允许、许可、让、要)，所谓关键字是系统提供的专门用来声明（定义）变量的词语
变量赋值 =号赋值符 =号的作用是赋值的
输出这个变量名

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>变量</title>
</head>

<body>
    <script>
        // 需求 :初始化一个姓名的变量,赋值为张三,在已赋值的情况下把他的值重新修改为李四
        let uname = '张三'
        uname = '李四'
        console.log(uname);

    </script>
</body>

③更新变量、声明多个变量

注意点:变量重复声明会报错,let声明的变量只能声明一次

更新变量:直接给它一个不同的值来更新它

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>变量</title>
</head>

<body>
    <script>


        //定义多个变量 多个之间用使用逗号隔开
        // let age = 24, sex = '女', name = '爱人'

        // 咱们不建议一行定义多个变量,建议一行写一个为了更好的可读性
        let age = 24
        let sex = '女'
        let name = '爱人'
        console.log(age, sex, name)
    </script>
</body>

④变量的命名规范

不能使用关键字定义
变量命名不能以数字开头、短横线间隔，可以由下划线、字母、数字、$组成
字母严格区分大小写，如 Age 和 age 是不同的变量
命名要有语义化
命名遵守小驼峰命名法 ( 第一个单词首字母小写，后面每个单词首字母大写。例：userName )
总结:如果变量名报错的话就换一个

8.常量

常量是不能变化的值,是一个固定值

命名规范和变量一致。

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>常量</title>
</head>

<body>
    <script>

        //常量 不能变化的值,是一个固定值

        //定义常量const
        // const π
        const π = 3.14  
π = 3.1415       
//总结:当我们保持数据不会进行更改的,我们使用常量进行保存,反之就使用变量
    </script>
</body>

9.变量和常量的区别
1.变量可以先定义在赋值和常量必须进行初始化
2.变量的值是可以改变的,常量是无法改变的