首页 > 技术文章 > JavaScript基础知识

LucasBlog 2020-03-13 11:32 原文

JavaScript基础知识

JavaScript的基本知识大部分和Java的类似,这里是学习JavaWeb过程中学的JS,并未深入学习!

  1. js的引入方式

    • 内部js

      与html结合,定义<script>,标签内写js代码

    • 外部js

      外部js文件,使用<script>标签,通过src属性引入外部js文件

    注意:

    • <script>可以定义在HTML任意位置,但是位置会影响执行顺序,一般都是定义在body标签里面的最后。

    • <script>标签可以定义多个。

  2. js的注释方式

    与Java一样,单行注释使用//,多行注释使用/* */

  3. 基本语法

    • js基本语法与java相似,语句以分号;结尾,但js并不强制要求每个语句加分号,js的引擎会自动给每个语句补上分号,但这种情况下有时候会改变程序的语义,导致运行结果有问题。

      建议每一句js语句都加上分号。

    • js严格区分大小写。

  4. JS的数据类型

    JS数据类型包括原始数据类型和引用数据类型,使用typeof运算符可以获取变量的类型(null运算后得到的是object)

    • JS中定义了以下几种原始数据类型:

      1. number

        数字类型,不区分整数和浮点数,统一用number表示。

        number包含整数,浮点数和NaN(Not a Number,表示不是数字的数字类型)

      2. string

        字符串类型,可以用单引号或双引号

      3. boolean

        布尔类型,只有true和false两种值

      4. null

        表示空值,是一个对象为空的占位符

      5. undefined

        未定义,如果一个变量没有初始化值,就会被默认赋值为undefined

    • 引用数据类型:对象

  5. JS变量

    JS是一门弱类型语言

    定义变量使用var关键字,比如var 变量名 = 初始化值

  6. 运算符

    • 一元运算符

      ++:自增

      --:自减

      +(-):正负号

    • 算数运算符

      +,-,*,/,%

    • 赋值运算符

      =,+=,-=

    • 比较运算符

      >,<,=, ==,===(全等)

      比较规则:

      1. 类型相同:直接比较,对于字符串,按照字典的顺序,按位逐一比较,直到得出大小为止。

      2. 类型不同:先进性类型转换,再比较

        其中对于全等于===:先判断类型,类型不同直接返回false

    • 逻辑运算符

      &&,||,!

      其他类型转为boolean:

      1. number:0或NaN为false,其他为true
      2. string:除了空字符串"",其他为true
      3. null和undefined:都是false
      4. 对象:所有对象都为true
    • 三元运算符

      ?:表达式

  7. 流程控制语句

    • if...else...

    • switch

      可以接受任意的原始数据类型

    • while

    • do...while

    • for

  8. JS基本对象

    • Function:函数(方法)对象

      1. 有三种创建方式(一般只有后面两种)
        • var fun = new Function(形式参数列表,方法体)
        • function 方法名称(形参列表) { }
        • var 方法名 = function(形参列表) { }
      2. 属性:length,代表形参的个数
      3. 特点:
        • 方法定义时,形参类型不需要写,返回值类型也不需要写
        • 方法是一个对象,如果定义相同名称的方法,则会覆盖前面定义的方法
        • 方法的调用只与方法名称有关,跟传递参数多少个无关
        • 方法声明中有一个隐藏的内置对象(其实就是数组)arguments,保存了所有的实际参数。
    • Array:数组对象

      1. 创建方式:
        • var arr = new Array(元素列表)
        • var arr = new Array(默认长度)
        • var arr = [元素列表]
      2. 内置方法(列举常用的)
        • join(参数):将数组中的元素按照给定的分隔符拼接为字符串
        • push():向数组末尾添加一个或更多元素,并返回新的长度
      3. 属性:length,数组的长度
      4. 特点
        • JS中的数组,元素类型是可变的
        • JS中的数组,数组长度是可变的
    • Boolean

      boolean类型的包装类

    • Date:日期对象

      1. 创建方式

        var date = new Date()

      2. 方法

        • toLocaleString():据本地时间格式,把 Date 对象转换为本地字符串。
        • getTime():返回 1970 年 1 月 1 日至今的毫秒数。
    • Math:数学对象

      1. 创建

        Math对象不用创建,直接使用,使用方式:Math.方法名()(类似Java静态方法调用)

      2. 方法

        • random():返回 0 ~ 1 之间的随机数。含0不含1
        • ceil(x):对数进行上舍入。
        • floor(x):对数进行下舍入。
        • round(x): 把数四舍五入为最接近的整数。
      3. 属性:PI,圆周率

      4. 取随机整数

        /**
        * 取 1~100之间的随机整数
        *      1. Math.random()产生随机数:范围 [0,1)小数
        *      2. 乘以 100 --> [0,99.9999] 小数
        *      3. 舍弃小数部分 :floor --> [0,99] 整数
        *      4. +1 -->[0,99] 整数 [1,100]
        */
        var number =  Math.floor((Math.random() * 100)) + 1;
         /* 
            返回一个在myMin(包括myMin)和myMax(包括myMax)之间的随机数。
         */
        function randomRange(myMin, myMax) {
            return Math.floor(Math.random() * (myMax - myMin + 1)) + myMin; 
        }
        
    • Number

      Number 对象是原始数值的包装对象。

    • String

      String 对象用于处理文本(字符串)。

    • RegExp:正则表达式对象

      1. 创建

        • var reg = new RegExp("正则表达式","修饰符")

          当使用构造函数创造正则对象时,需要常规的字符转义规则(在前面加反斜杠 \)。比如,var reg = new RegExp("\\w")

        • var reg = /正则表达式/修饰符

      2. 正则表达式规则详看java部分的正则介绍

        这里的修饰符有三种:

        • i:忽略大小写
        • g:执行全局匹配(查找所有匹配而非在找到第一个匹配后就停止)
        • m:执行多行匹配
      3. 方法

        • test(参数):检索字符串中指定的值。返回 true 或 false。
        • exec():检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。
        • compile():编译正则表达式
        var patt1=new RegExp("e"); 
        document.write(patt1.exec("The best things in life are free")); // 输出:e
        
    • Global:全局对象。能够不用对象名就可以直接调用方法。方法名()

      1. 方法

        • encodeURI():url编码

        • decodeURI():url解码

        • encodeURIComponent():把字符串编码为 URI 组件。(编码的字符更多)

        • decodeURIComponent():解码一个编码的 URI 组件。

        • parseInt():将字符串转为数字

          逐一判断每一个字符是否是数字,直到不是数字为止,将前边数字部分转为number

        • isNaN():判断一个值是否是NaN

          NaN六亲不认,连自己都不认。NaN参与的==比较全都为false

        • eval():计算 JavaScript 字符串,并把它作为脚本代码来执行。

推荐阅读