JavaScript与JSON练习

最新推荐文章于 2026-06-22 22:05:57 发布

原创最新推荐文章于 2026-06-22 22:05:57 发布 · 360 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

GEO检测

标签

#前端 #javascript #java #json #html

今天练习了HTML里的JavaScript，以及JS对象与JSON字符串的转化，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS练习</title>
</head>
<body>
<script>
    alert( "Hello JS" );    //弹出框
    let a =20;              //声明变量let
    a = "hello";            //声明变量不加任何修饰符(弱类型)
    alert(a);
    alert(typeof a);        //string
    let name = "Tom";
    let age = 18;
    alert("我是"+name+"，我今年"+age+"岁了");
    alert(`我是${name},我今年${age}岁了`)   //`${变量名}`  反引号：简化字符串拼接

    const b = 3.14;         //声明常量用const
    let c = 20;             //声明变量用let

    function add(b,c){            //具名函数
        return b+c;
    }
    result1 = b+c;
    alert(result1);

    let add2 = function(c,b){     //匿名函数
        return b+c;
    }
    result2 = b+c;
    alert(result2)

    let add3 =(c,b) => {          //箭头函数
        return b+c;
    }
    result3 = b+c;
    alert(result3)


    //自定义对象的创建和使用
    let user = {
        name:"Tom",
        age:18,
        gender:"男",
        eat:function(){           //不推荐使用箭头函数，否则this指向错误
            alert(this.name+"吃东西像猪")
        }
    }
    alert(user.age);
    user.eat();


    //JS对象转化为JSON字符串：
    let person = {
        name:"Jerry",age:18,gender:"男"
    }
    alert(person);       //此时网页显示[Object],需要转成JSON格式 {"键":"值"}
    alert(JSON.stringify(person))   //{"name":"Jerry","age":18,"gender":"男"}

    //那么反过来，将JSON转化为JS对象：
    let JSON_person = '{"name":"Anne","age":16,"gender":"女"}' //一定要记得在外层加引号
    alert(JSON.parse(JSON_person).name);        //Anne

效果图如下：alert即为网页弹窗。