JavaScript（JS）小白基础知识学习之路day01

这是小白学习JavaScript记录，总结了自己需要记住的知识点，可能不太全，往后还会继续完善，今后互相学习请教，还请多多包涵

---

1.JS样式

        可分为内联样式、内部样式和外部样式，外部样式需建立一个外部的js文件来供html文件引用

    <button onclick="alert('我是内联样式')"></button>

    <!-- 内部js -->
    <script>
        alert('hello javascript,我是内部样式')
    </script>

    <!-- 外部js -->
    <script src="js1.js"></script>

 

2.输入输出语法

        输出语句：document.write（''）在页面中打印输出

                         alert（''）输出弹出警示框

                         console.log（''）在控制台打印输出，主要用于调试

       输入语句：prompt（''）弹出警示框输入，可与输出语句搭配使用

  <script>
        // 1.Document 文档的意思 write 写
        document.write('JavaScript我来了')
        // 2.alert 弹出警示框
        alert('我是弹出警示框，你好js')
        // 3.控制台输出语法 程序员看的 调试用的
        console.log('我是用来调试的')
        // 4.输入语句prompt
        prompt('输入什么好呢')
  </script>

 

 

3.变量

        let：用来声明变量的

        age：为变量名，定义时需通俗易懂，规范

        =：为标识符，赋值的意思

        let age =18：初始化变量，为18；

 <script>
        // 1.let声明变量 age变量名=标识符 赋值：=
        let age
        age = 18
        age = 19
        console.log(age)

        // 2.变量的初始化 声明变量的时候直接赋值
        let age=18
        let age = 19
        console.log(age)
        
        let age = 19,uname='BOSS help me'
        console.log(age)
        console.log(uname)
    </script>

 注意：let 和 var 的区别

            let为了解决var的一些问题

            var声明：

                        可以先使用在声明（不合理）

                        var声明过的变量可以重复声明（不合理）

                        比如变量提升、全局变量、没有块级作用域等等

   <script>
    // 可以先使用在声明（不合理）
        age = 19
        var age
        console.log(age)

        age = 19
        let age
        console.log(age)

    // var声明过的变量可以重复声明（不合理）
        var age = 18
        var age = 19
        console.log(age)
    </script>

var 输出可先使用再声明                             let 需先声明在使用

 

 

4.字符串拼接

        利用 + 做拼接连接字符串

// 用户输入名字,页面输出的是：我的名字是xxx 

      let uname = prompt('请输入你的名字：')

        document.write('我的名字：'+ uname)

 

5.数据类型

        null （表示为 空）和 undefined 区别:

                1. undefined 表示没有赋值

                2. null 表示赋值了,但是内容为空null

           开发中的使用场景:

                官方解释:把null作为尚未创建的对象

                大白话:将来有个变量里面存放的是一个对象,但是对象还没创建好,可以先给个null

        // 检测数据类型用typeof 

console.log(typeof age) //输出为 number

6.隐式转换和显式转换

        ①隐式转换

                概念：某些运算符被执行时,系统内部自动将数据类型进行转换

                规则:  +号两边只要有一个是字符串,都会把另外一个转成字符串

                          除了+以外的算术运算符  比如-*/等都会把数据转成数字类型

                缺点:  转换类型不明确,靠经验才能总结

                小技巧: +号作为正号解析可以转换成Number

 

        ②显式转换

                概念:自己写代码告诉系统该转成什么类型

                      编写程序时过度依靠系统内部的隐式转换是不严谨的,因为隐式转换规律并不清晰,大                 多是靠经验总结的规律；为了避免因隐式转换带来的问题,通常根逻辑需要对数据进行显                 示转换。

                例：Number(数据)

                       转成数字类型

                       如果字符串内容里有非数字,转换失败时结果为NaN (Not a Number)即不是一个数字

                       NaN也是number类型的数据,代表非数字

<script>
        // 显式式转换知识点
        // let num = '10'
        // Number (数据)
        console.log(Number('10.01'))
        //转换为数字型,只保留整数,没有四舍五入
        console.log(parseInt('10'))
        console.log(parseInt('10.111'))
        console.log(parseInt('10.999px'))
        //转换为数字型,会保留小数
        console.log(parseFloat('10.999'))
       
        // 区别:
        // 1.Number() 只能放数字类型的字符,不能放abc这样的，否则返回的是NaN not A number
        console.log(Number('10.01abc'))
        // parseFloat 经常用于过滤px单位
        // console. log(parseFloat('10.0labc'))
        console.log(parseFloat('100px'))
        // console.log(parseFLoat('px100px'))

        // 显式转换为字符串
        console.log(String(10))
        let age=10
        console.log(age.toString())
        //括号里面如果是2 转换为二进制
        console.log(age.toString(2))
</script>

        parselnt(数据)只保留整数

        parseFloat(数据)可以保留小数

<script>
    // 输入2个数，计算两者的和，打印到页面中
    let first = parseInt(prompt('请输入第一个数：'))
    let three = parseInt(prompt('请输入第二个数：'))+first
    alert('输出的结果是：'+three)
</script>

今天就到此为止吧，明天依旧光芒万丈哦宝贝！！！！！！！！！！！！

后续附有案例。。。