JavaWeb学习第四天之JS

最新推荐文章于 2024-07-15 17:15:41 发布

丹柒七

最新推荐文章于 2024-07-15 17:15:41 发布

阅读量1.1k

点赞数 28

文章标签： javascript 学习前端

本文链接：https://blog.csdn.net/m0_75213259/article/details/135855888

版权

什么是JavaScript

JavaScript（简称：JS），是一门跨平台、面相对象的脚本语言，是用来控制网页行为的，它能使网页可交互。

JavaScript和Java是完全不同的语言，不论是概念还是设计，但是基础语法是类似的。

JavaScript在1995年由Brendan Eich发明，并于1997年成为ECMA标准。

JavaScript的引入方式

内部脚本：将JS代码定义在HTML页面中

JavaScript代码必须位于<script></script>标签之间

在HTML文档中，可以在任意地方，放置任意数量的<script>

一般会把脚本置于<body>元素的底部，可改善显示速度

外部脚本：将JS代码定义在外部JS文件中，然后引入到HTML页面中

外部JS文件中，只包含JS代码，不包含<script>标签

JavaScript的基础语法

书写语法（绝大多数与Java类似）

1.区分大小写

2.注释：//单行注释

/*多行注释*/

3.大括号代表代码块

与Java不同的是，JavaScript语法没有那么严谨，每行皆为的分号可有可无。

输出语句

1.JavaScript使用windows.alert()写入警告框

2.JavaScript使用document.write()写入HTML输出

3.JavaScript使用console.log()写入浏览器控制台

在不同位置输出Hello JS的代码实现：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS-引入方式</title>

    

    <!-- 外部脚本 -->

    <!-- <script src="demon.js"></script> -->
</head>
<body>
    
   <!-- 内部脚本 -->
   <script>
   /* 方式一：弹出警告框 */
   window.alert("Hello JS");

   /* 方式二：写入html页面中 */
   document.write("Hello JS");

   /* 方式三：控制台输出 */
   console.log("Hello JS");
   </script> 
    
   
</body>
</html>

变量

1.JavaScript中var关键字（variable的缩写）来声明变量

2.JavaScript是一门弱类型语言，变量可以存放不同类型的值

3.命名规则

组成字符可以是任何字符、数字、下划线（_）或美元符号（$）。

数字不能开头。

建议使用驼峰命名。

相关代码如下，目的是令其弹出“张三”弹窗。

<body>
    
   <!-- 内部脚本 -->
   <script>

   var a = 10;
   a = "张三";

   /* 方式一：弹出警告框 */
   window.alert(a);

其中声明变量var有一些特点，如下：

特点1：var的作用域比较大，是为全景变量。

特点2：var定义的变量可以重复定义，其中优先取最后定义的值。

注意事项：

除了var关键字外，JavaScript后面的版本还新增了关键字let和const关键字。其中let关键字的用法类似于var，但是所声明的变量只在let关键字所在的代码块儿中有效，且不允许重复声明。而const关键字是用来声明一个只读的常量，一旦声明，常量的值就不能改变。

代码如下：

{
    let a = 3;
    alert(a);
   }

数据类型、运算符、流程控制语句：

JavaScript中分为：原始数据类型和引用类型

number：数字（整型、小数、NaN（Not a Number））

String：字符串、单双引皆可

boolean：布尔。true，false

null：对象为空

undefined：当声明的变量为初始化时，该变量的默认值是underfined。

使用typedef运算符可以获取数据类型

运算符

算术运算符：+，-，*，/,%,++,--

赋值运算符：=，+=， -=，*=，/=，%=

比较运算符：>,<,>=,<=,!=,==,===(==会进行类型转换，但是===不会进行类型转换)

逻辑运算符：&&，||，！

三元运算符：条件表达式？true_value:false_value

类型转换

字符串类型转为数字：将字符串转为数字，如果字面值不是数字，则转为NaN

Number转为boolean：0和NaN为false，其他均转为true

String转为boolean：空字符串为false，其他均转为true

Null和undefined转为boolean：均转为false

JavaScript函数

定义：JavaScript函数通过function关键字进行定义，相关语法为：

function functionName(参数1, 参数2)
   {
//要执行的代码
   }

注意：

形式参数不需要类型，因为JavaScript是弱类型语言。

返回值也不需要定义类型，只需要在函数内部直接使用return返回即可

调用：

函数名称（实际参数列表）

var result = add(10,20);
alert(result);

定义方式二：

var functionName = function（参数1，参数2）{
//要执行的代码
}

JavaScript对象

Array

JavaScript中Array对象用于定义数组。相关代码如下：

var 变量名 = new Array(元素列表);//方式一

var 变量名 = [元素列表];//方式二

访问

arr[索引] = 值;

练习代码如下：

 <script>
        /* 定义函数 */
        /* function add(a,b){
            return a + b;
        } */
        /* 定义数组方式一*/
        //var arr = [1,2,3,4];

        /* 定义数组方式二 */
        var arr = new Array(1,2,3,4);

        console.log(arr[0]);
        console.log(arr[1]);


    </script>

注意：

JavaScript的数据的部分特点与Java中的集合语法类似：长度可变，类型可变。

Array的相关属性：length——设置或返回数组中元素的数量。

Array的相关方法：forEach（）遍历数组中的每个有值的元素，并调用一次传入的函数。

push（）将新元素添加到数组的末位，并返回新的长度。

splice（）从数组中删除元素。

相关代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <script>
        /* 定义函数 */
        /* function add(a,b){
            return a + b;
        } */
        /* 定义数组方式一*/
        //var arr = [1,2,3,4];

        /* 定义数组方式二 */
        var arr = new Array(1,2,3,4);

        /* console.log(arr[0]);
        console.log(arr[1]); */
        
        //forEach：遍历数组中有值的元素
        arr.forEach(function (e){
            console.log(e);
        });

       /*  arr.forEach(e => {
            console.log(e);
        }); */

        arr.push(5, 6, 7);
        console.log(arr);

        /* splice:删除元素 */
        arr.splice(2, 2);

        console.log(arr);





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

丹柒七

关注

28
点赞
踩
18

收藏

觉得还不错? 一键收藏
0
评论
JavaWeb学习第四天之JS

JavaScript（简称：JS），是一门跨平台、面相对象的脚本语言，是用来控制网页行为的，它能使网页可交互。JavaScript和Java是完全不同的语言，不论是概念还是设计，但是基础语法是类似的。JavaScript在1995年由Brendan Eich发明，并于1997年成为ECMA标准。JavaScript代码必须位于<script></script>标签之间在HTML文档中，可以在任意地方，放置任意数量的<script>一般会把脚本置于<body>元素的底部，可改善显示速度。
复制链接

扫一扫