每日作业-JavaScript第01天

一、获取用户信息

- 题目描述：

         依次询问并获取用户的姓名、年龄、性别，收集数据之后在控制台依次打印出来。

- 具体表现如下图：

 - 题目提示

        - 通过prompt来弹出提示框，收集用户信息
        - 通过变量保存数据

 - 解题代码

<script>
    let name = prompt("请输入您的姓名: ")
    let age = prompt("请输入您的年龄: ")
    let sex = prompt("请输入您的性别: ")
    console.log(`用户的姓名：${name}`)
    console.log(`用户的年龄：${age}`)
    console.log(`用户的性别：${sex}`)
</script>

 - 实现效果

---

二、增加年龄

- 题目描述

  1、询问用户年龄，用户输入年龄后，把用户输入的年龄增加5岁

  2、增加5岁后，通过弹出框提示用户 “ 据我估计，五年后，你可能XX岁了”

- 题目提示

        - 通过prompt来弹出提示框，收集用户信息
        - 通过变量保存数据
        - 转换数据类型

- 解题代码

    <script>
        let age = +prompt("你现在多少岁了？") + 5
        console.log(`据我估计，五年后，您可能${age}岁了`)
    </script>

- 实现效果

---

三、 计算银行卡余额案例

- 题目描述

  1、用户输入总的银行卡金额，依次输入本月花费的电费，水费，网费。

  2、页面打印一个表格，计算出本月银行卡还剩下的余额。

  ​

- 题目提示

  - 思路：

    1.我们需要5个变量：银行卡总额、水费、电费、网费、银行卡余额

    2.银行卡余额= 银行卡总额 – 水费 –电费  - 网费  

    3.第一步准备5个变量接受输入的数据

    4.第二步计算银行卡余额 

    5.第三步页面打印生成表格，里面填充数据即可。

    6.当然可以提前把html页面搭好。

- 解题代码

<script>
        let water = +prompt('请输入水费：')
        let electricity = +prompt('请输入电费：')
        let internet= +prompt('请输入网费：')
        let rest = 1000 - water - electricity - internet
        document.write(`
        <table>
        <caption>
            <h1>订单付款确认页面</h1>
        </caption>
        <tr>
            <th>银行总余额</th>
            <th>水费</th>
            <th>电费</th>
            <th>网费</th>
            <th>银行卡余额</th>
        </tr>
        <tr>
            <th>1000元</th>
            <th>${water}</th>
            <th>${electricity}</th>
            <th>${internet}</th>
            <th>${rest}</th>
        </tr>
    </table>
        `) 
</script>

body{
    margin: 0;
    padding: 0;
}
h1{
    text-align: center;
}
table{
    margin: auto;
    padding: 0;
    width: 700px;
    height: 100px;
    border-collapse: collapse;
}
td,th{
    border: solid 1px black;
    padding: 10px;
}
table caption{
    margin: 15px 0;
}

- 实现效果

---

四、检测题

1. 下列定义的变量名中，不合法的是 (A)

    A： 2age

    B： newClass

    C： userName

    D： _age

2. 下列有关字符串变量定义正确的是（AB） 注意多选~~~  

   A： let strMsg = "我爱北京天安门"

   B： let strMsg2 = '我爱吃猪蹄'

   C： let strMsg3 = 我爱大肘子

   D： let strMsg4 = '我是'高帅富'程序猿'

3. 下面那些是字面量？（ABD）

   A:  123

   B:  '大肘子'

   C:  ture    

   D:   []

4. 下面代码输入结果是？ （） 请自习阅读

   let num = 10
   console.log( num + 11)
   console.log( num + '11')
   console.log( num +  +'11')

答案是：

21

1011

21

5. 下面代码输入结果是？ （） 请自习阅读

let num = 10
console.log( typeof num + '11')
console.log( typeof (num + '11'))
console.log( typeof (num +  +'11'))

答案是：

number11

string

number

6. 请说出变量的使用场景？

我们使用变量的时候，一定要声明变量，然后赋值 ,声明变量本质是去内存申请空间。

7. 请说出我们为什么需要转换数据类型？

在 JavaScript 中数据被分成了不同的类型，如数值、字符串、布尔值、undefined，在实际编程的过程中，不同数据类型之间存在着转换的关系。JavaScript是弱数据类型，JavaScript也不知道变量到底属于那种数据类型，只有赋值了才清楚。

8. 请说出基本数据类型有哪5种？

number、string、boolean、undefined、null

9. 请说出转换为数字型，字符串型的方法？

数字型：number()、parseInt()、parseFloat()

字符串型：String()、.toString()

10. 请说出模板字符串使用方法？

使用反引号包含数据，用${变量名}使用变量。

11. 加号上下文（要求背诵~~~同桌相互提问）

    1.  如果+号左右只有一个值，解析的结果是正号，可用于隐式转换
    2.  如果两边都是数值(Number)类型，则是+号运算符
    3.  +号的左右如果有一个数据是字符串数据类型的话，那么这个+号会被解析成连接符

    4.  数字相加，字符相连