1<保姆教程>》JavaScript基础(三种书写位置,输入输出语句,变量,数据类型,运算符、表达式、返回值)

155 阅读3分钟

JavaScript基础

三种书写位置

    <!-- 行内 -->
    <input type="text"  onclick="alert('1')">
    <!-- 内嵌 -->
    <script>
        alert('1')
    </script>
    <!-- 外部 -->
    <script src="./index.js"></script>

输入输出语句(常用)

    // 浏览器弹出警示框 
    alert('1')
    // 浏览器控制台打印输出信息
    console.log('1')
    // 浏览器弹出输入框,用户可以输入
    prompt('1')

变量

    // 是什么
    变量是程序在内存中申请的一块用来存放数据的空间
    // 使用
    var num=1
    console.log(num)//1

数据类型

为什么有

    变量是用来存储值的所在处,他们有名字和数据类型。变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型,在程序运行过程中,类型会被自动确定

分类

简单数据类型
  1. 数字型 Number、字符串型 String、布尔型 Boolen、null、undefined
    // 数字型 
    - 数字型的常见进制:八进制0开头,十六进制0x开头,还有十进制
    - 最大值Number.MAX_VALUE,最小值Number.MIN_VALUE,无穷大Infinity,非数字NaN 
    - isNaN() 判断一个变量是否是数字,会出现数据类型自动转换的情况,如下:
    var a=123,b='123',c='123x'
    console.log(isNaN(a)) //false
    console.log(isNaN(b)) //false
    console.log(isNaN(c)) //true
    // 字符串型
    - 字符串转义字符(常见)
    \n 换行
    \\ 斜杠\
    \' 单引号'
    \ " 双引号
    \t tab缩进
    \b 空格
  1. typeof检测变量的数据类型
    let a = 1,
            b = '1',
            c = null,
            d = true,
            f;
    console.log(typeof a);//number
    console.log(typeof b);//string
    console.log(typeof c);//object
    console.log(typeof d);//boolean
    console.log(typeof f);//undefined
  1. 数据类型转换
    let num = 1,
        num13 = 0,
        num14 = NaN,
        str = 'xx',
        str4 = '2.3233',
        str5 = '2.3233x',
        str6 = 'x2.3233',
        str7 = '',
        str8 = 'false',
        n = null,
        bl = true,
        un;
    // 其他类型转字符串
    let str1 = num.toString(),
        str2 = n + '',
        str3 = String(bl)
    console.log(str1) //1
    console.log(str2) //null
    console.log(str3) //true
    // 其他类型转数值
    let num1 = +str4,
        num2 = parseInt(str4),
        num3 = parseFloat(str4),
        num4 = Number(str4),
        num5 = +str5,
        num6 = parseInt(str5),
        num7 = parseFloat(str5),
        num8 = Number(str5),
        num9 = +str6,
        num10 = parseInt(str6),
        num11 = parseFloat(str6),
        num12 = Number(str6)
    console.log(num1) //2.3233
    console.log(num2) //2
    console.log(num3) //2.3233
    console.log(num4) //2.3233
    console.log(num5) //NaN
    console.log(num6) //2
    console.log(num7) //2.3233
    console.log(num8) //NaN
    console.log(num9) //NaN
    console.log(num10) //NaN
    console.log(num11) //NaN
    console.log(num12) //NaN
    // 其他类型转布尔 Boolean(val),或者隐式转换,
    let bl1 = Boolean(num),
        bl2 = Boolean(num13),
        bl3 = Boolean(num14),
        bl4 = Boolean(n),
        bl5 = Boolean(un),
        bl6 = Boolean(str7),
        bl7 = Boolean(str8);
    console.log(bl1) //true
    console.log(bl2) //false
    console.log(bl3) //false
    console.log(bl4) //false
    console.log(bl5) //false
    console.log(bl6) //false
    console.log(bl7) //true
复杂数据类型(后面会发,小年轻得一步一步来)

运算符、表达式、返回值

运算符

    // 1.算术运算符: +(加) 、-(减) 、*(乘) 、/(除) 、 %(取余)
    // 2.关系运算符 >、< 、>= 、<= 、==(只比较值,不看类型,会有隐式转换) 、!=(只比较值,不看类型) 、===(不单止比较值,还比较类型) 、!==(不单止比较值,还比较类)
    // 3.逻辑运算符:&&(与)、||(或)、!(非)
    - 逻辑中断
    let shortCircuit1 = 1 || 2 
    let shortCircuit2 = 0 || 2
    let shortCircuit3 = 1 && 2
    let shortCircuit4 = 0 && 2
    console.log(shortCircuit1)//1
    console.log(shortCircuit2)//2
    console.log(shortCircuit3)//2
    console.log(shortCircuit4)//0
    - 逻辑或:如果表达式1为真则返回表达式1,如果表达式1为假,则返回表达式2
    - 逻辑与:如果表达式1为真则返回表达式2,如果表达式1为假,则返回表达式1
    // 4.赋值运算符 = 、+= 、 -= 、*= 、/= 、%=
    let a = 1
    let b = 1
    a = a + 1
    b += 1
    console.log(a)//2
    console.log(b)//2
    // 5.运算符优先级
    () > 一元运算符(++/--/!) > 算术运算符(先乘除后加减) > 关系运算符 > 逻辑运算符(先&&后||) > 赋值运算符 > 逗号运算符(,)
    // 6.递增++和递减--
    - 前置递增(先加后返回值)、后置递增(先返回值后加)
    let num = 1
    let num1 = 1
    let num3 = 1
    console.log(++num + 10) //12
    console.log(num1++ + 10) //11
    console.log(num3++) //1
    console.log(++num3) //3
    - 单独使用都一样
    let num2=1
    let num4=1
    num2++
    ++num4
    console.log(num2)//2
    console.log(num4)//2

表达式、返回值

    // 表达式是由数字、运算符、变量等组成的式子;如:1 + 1
    // 返回值是表达式运行之后把返回的值 如:let num = 1 + 1;就会把1+1=2,这个2返回给num