H5学习笔记15 js 变量 数据类型 命名规则 数据类型 转换 运算符 变量转换 赋值运算符 自增自减

JS三个组成部分
                ECMAScript      基础语法
                DOM             标签
                BOM             浏览器

 

JS的三种写法

 

 1 <body>
 2     <!-- script 双标签内 有一个src属性引入外部文件 -->
 3     <script src=""></script>
 4     <script>
 5         // 执行代码
 6     </script>
 7 
 8     <!-- a标签上的js -->
 9     <!-- alert() 警告框 -->
10     <a href="javascript:alert('您中奖了!');">点击</a>
11 
12     <!-- 非a标签 -->
13     <!-- on click  当 点击 -->
14     <input onclick="alert('嘿嘿嘿')" type="button" value="按钮">
15 </body>

 

变量
 1 <body>
 2     <script>
 3         // 变量
 4         // - 别名
 5         // - var 名字 = 值
 6         // - var是一个关键字,会去计算机内申请一块内存使用
 7 
 8         // var a = '张三'
 9         // var b = '李四'
10         // var n = 100
11 
12         // alert(b)
13     </script>
14 </body>
数据类型
 1 <body>
 2     <script>
 3          数据类型
 4          - string number boolean undefined null
 5 
 6          数据类型检测
 7          - typeof xxx
 8          - typeof(xxx)
 9 
10          string
11          - 字符串
12          var s = 'hello'
13          alert(typeof s)
14 
15          number
16          - 数字
17          var n = 100
18          alert(typeof n)
19 
20          boolean
21          - truefalse22          var b = true
23          alert(typeof b)
24 
25          undefined
26          - 未定义
27          - 定义了未赋值
28          var a
29          alert(a)
30 
31          null
32          -33         - null typeof 是object
34         var nu = null
35         alert(typeof nu)
36     </script>
37 </body>

js命名规则

 

<body>
    <script>
        命名规则
        - 不能使用关键字或者保留字
        var var = 12
        - 中文可以当做变量名,但是不建议使用
        var 二狗 = '张三'
        alert(二狗)
        - 不能数字开头命名
        var 1 = '张三'
        - 可以使用特殊符号 $ _
        var __ = 'abc'
        alert(__)
        var $_$ = 'hello'
        alert($_$)

        命名规范
        - 驼峰命名
        - 首字母小写,第二个单词首字母大写
    </script>
</body>

 

数据类型转换

 

 1 <body>
 2     <script>
 3         转数字
 4         - parseInt parseFloat Number
 5 
 6         整数
 7         var n = parseInt('12元')
 8         alert(n)
 9         alert(typeof n)
10 
11         小数
12         var n = parseFloat('12.5元')
13         alert(n)
14         alert(typeof n)
15 
16         纯数字
17         var n = Number('12.5元')
18         alert(n)
19 
20         NaN
21         - 非数字标识
22         - 数字类型
23         - 自己不等于自己
24         alert(NaN == NaN)
25 
26         转布尔值
27         - Boolean
28         - 真:非0数字 非空字符串 true
29         - 假:0 '' false undefined null NaN
30         var b = Boolean(null)
31         alert(b)
32 
33         转字符串
34         - toString
35         var str = 12 + ''
36         alert(str.toString())
37         alert(typeof str.toString())
38         alert(str)
39         alert(typeof str)
40         var n = 12
41         var str = '5'
42         alert(n + parseInt(str))
43     </script>
44 </body>
运算符
 1 <body>
 2     <script>
 3         // 运算符
 4         // + - * / %
 5         // +号 运算和连接的功能,都是数字进行运行
 6 
 7         // alert(12 % 5)        // 2
 8         // alert(11 % 3)        // 2
 9         // alert(19 % 5)           // 4
10 
11         // 比较运算符
12         // - < > <= >= == === != !==
13         // - =      赋值
14         // - ==     比较        只看内容不看数据类型
15         // - ===    比较        先看数据类型,然后再比较内容
16         // alert(12 === '12')
17         // alert(true != true)
18         
19         // 逻辑运算符
20         // - || && !
21         alert(!!!true)
22     </script>
23 </body>

变量交换

 

 1 <body>
 2     <script>
 3         var a = 12
 4         var b = 5
 5 
 6         // code..
 7         var c = null
 8         c = a
 9         a = b
10         b = c
11 
12         alert(a)        // 5
13         alert(b)        // 12
14     </script>
15 </body>

 

赋值运算符

 

 1 <body>
 2     <script>
 3         // var a = 100
 4         // a = 100 + 99
 5         // a = a + 99
 6         // a += 99
 7         // console.log(a)
 8 
 9         var res = 0
10         res += 10
11         res += 30
12         res += 17
13         console.log(res)
14     </script>
15 </body>

 

自增自减

 

 1 <body>
 2     <script>
 3         // var i = 0
 4         // i = i + 1
 5         // i += 1
 6         // 每次加一
 7         // i++
 8         // 每次减一
 9         // i--
10         // console.log(i)
11 
12         var i = 0
13         // 后:先输出后运算
14         // 前:先运算后输出
15         // console.log(i++)
16         //          0 + 2 = 2
17         // console.log(i++ + ++i)
18         //          0   + 1   + 2   +   4
19         // console.log(i++ + i++ + i++ + ++i)
20         //          0   + 1
21         console.log(i++ + i++)
22     </script>
23 </body>

 

 

 
 

 

posted @ 2021-05-06 20:49  一水州  阅读(158)  评论(0)    收藏  举报