【前端寻宝之路】JavaScript初学之旅插图

🌈个人主页: Aileen_0v0
🔥热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法|MySQL|
💫个人格言:“没有罗马,那就自己创造罗马~”

#mermaid-svg-azUa9yH16cRXQUxE {font-family:”trebuchet ms”,verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-azUa9yH16cRXQUxE .error-icon{fill:#552222;}#mermaid-svg-azUa9yH16cRXQUxE .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-azUa9yH16cRXQUxE .edge-thickness-normal{stroke-width:2px;}#mermaid-svg-azUa9yH16cRXQUxE .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-azUa9yH16cRXQUxE .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-azUa9yH16cRXQUxE .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-azUa9yH16cRXQUxE .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-azUa9yH16cRXQUxE .marker{fill:#333333;stroke:#333333;}#mermaid-svg-azUa9yH16cRXQUxE .marker.cross{stroke:#333333;}#mermaid-svg-azUa9yH16cRXQUxE svg{font-family:”trebuchet ms”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-azUa9yH16cRXQUxE .label{font-family:”trebuchet ms”,verdana,arial,sans-serif;color:#333;}#mermaid-svg-azUa9yH16cRXQUxE .cluster-label text{fill:#333;}#mermaid-svg-azUa9yH16cRXQUxE .cluster-label span{color:#333;}#mermaid-svg-azUa9yH16cRXQUxE .label text,#mermaid-svg-azUa9yH16cRXQUxE span{fill:#333;color:#333;}#mermaid-svg-azUa9yH16cRXQUxE .node rect,#mermaid-svg-azUa9yH16cRXQUxE .node circle,#mermaid-svg-azUa9yH16cRXQUxE .node ellipse,#mermaid-svg-azUa9yH16cRXQUxE .node polygon,#mermaid-svg-azUa9yH16cRXQUxE .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-azUa9yH16cRXQUxE .node .label{text-align:center;}#mermaid-svg-azUa9yH16cRXQUxE .node.clickable{cursor:pointer;}#mermaid-svg-azUa9yH16cRXQUxE .arrowheadPath{fill:#333333;}#mermaid-svg-azUa9yH16cRXQUxE .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-azUa9yH16cRXQUxE .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-azUa9yH16cRXQUxE .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaid-svg-azUa9yH16cRXQUxE .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaid-svg-azUa9yH16cRXQUxE .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-azUa9yH16cRXQUxE .cluster text{fill:#333;}#mermaid-svg-azUa9yH16cRXQUxE .cluster span{color:#333;}#mermaid-svg-azUa9yH16cRXQUxE div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:”trebuchet ms”,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-azUa9yH16cRXQUxE :root{–mermaid-font-family:”trebuchet ms”,verdana,arial,sans-serif;}

<font color="#0FFconsequent on随之而来

文章目录

    • `定义变量`
    • `变量类型`
    • `特殊的数字值`

定义变量

Java 和 JavaScript不是同一个东西
Java:是一种静态类型的编译型语言,需要安装JRE或JDK来运行,主要应用于企业级应用、服务器端开发、移动设备等,是一种完全面向对象的编程语言。Java程序需要先编译成字节码,然后由JVM解释执行 JavaScript:是一种动态类型的解释型语言。直接在Web浏览器中运行,主要用于Web开发,如动态网页、前端交互等。JavaScript代码则是直接由浏览器中的JavaScript引擎执行。

<!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>
    // alert('你真棒!')

    //变量定义方式1:
    var name = "Aileen";
    console.log(name)

    //变量定义方式2:
    let age = 30;
    console.log(age)
    </script>
</body>
</html>

【前端寻宝之路】JavaScript初学之旅插图(1)

在变量定义中,let比var出现的晚,意味着避免了var这块定义变量的缺陷,如果使用let定义变量,此时变量生命周期,作用域,基本和Java类似
  • JS中定义一个变量时,无需对变量指定类型
  • 在JS中,数字只有一种类型:数值类型.

变量类型

强类型变量 :不同类型之前进行变量赋值时,需要进行强制类型转换.

  • 弱类型变量 :不同类型变量进行赋值时,可以直接赋值
<!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>
    
</body>
<script>
    a = 1
    b = "b"
    b = a
    console.log(b)
</script>
</html>

【前端寻宝之路】JavaScript初学之旅插图(2)

  • 动态类型变量:代码在执行过程中,变量类型可以随时发生改变
  • 静态类型变量:变量定义时是什么类型,在运行过程中就是什么类型
<!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>
    
</body>
<script>
    a = 1
    console.log(typeof(a))
    b = "b"
    a = b
    console.log(typeof(a))
</script>
</html>

【前端寻宝之路】JavaScript初学之旅插图(3)


特殊的数字值

<!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>
    
</body>
<script>
    // a = 1
    // console.log(typeof(a))
    // b = "b"
    // a = b
    // console.log(typeof(a))

    let a = 10;
    console.log(typeof(a))
    a = a/3
    console.log(a)
    console.log(typeof(a))
    console.log(10 / 0)
</script>
</html>

【前端寻宝之路】JavaScript初学之旅插图(4)
【前端寻宝之路】JavaScript初学之旅插图(5)

【前端寻宝之路】JavaScript初学之旅插图(6)

本站无任何商业行为
个人在线分享 » 【前端寻宝之路】JavaScript初学之旅
E-->