• JavaScript基础一


    一、ECMA Script和JavaScript

    ECMA Script是一个标准,JavaScript是一种实现规则的版本。

     

    二、JavaScript的导入方式

    ① 直接将js代码写到页面上的script标签中

    ② 把代码写到单独的JS文件中,然后通过script标签的src属性导入

    <!--JS的导入-->
    <script src="jsdome.js"></script>
    <body>
    <script>
        alert('haha')
    </script>
    </body>
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            alert('haha')
        </script>
    </head>

     

    三、JavaScript的语言规范

    JavaScript的语句要以分号为结束符;

    注释:
    // 单行注释
    /*多行注释
    多行注释
    多行注释*/

     

    四、JavaScript变量的声明

    ① JavaScript的变量名可以使用下划线_,数字,字母,$,组成,不能以数字开头

    ② 声明变量使用var 变量名 来声明

    注意:

    1.变量名是区分大小写

    2.推荐使用驼峰式命名规则

    3.保留字不能用做变量名

     

    补充:

    ES6新增了let命令,用于声明变量。其用法类似于var,但是所声明的变量只在let命令所在的代码块内有效。例如:for循环的计数器就很适合使用let命令。

    ES6新增const用来声明常量。一旦声明,其值就不能改变。

     

     

    五、JavaScript的数据类型

    ①.数值Number

    不区分整型和浮点型,只有一种数字类型

    NaN是数字类型,表示不是一个数字

    // 字符串转换为整型
    parseInt('123')     
    123
    
    // 字符串转换为浮点型
    parseFloat('123.789');
    123.789
    
    // 字符串转换为整型,无法转换返回NaN,NaN是数字类型
    parseInt('abc');
    NaN

     

    ②.字符串String

    // 字符串拼接+
    var s1 = 'Good ';
    var s2 = 'morning';
    s1+s2
    "Good morning"
    // 字符串常用方法
    var s2 = '   Hello   '      //定义字符串
    s2.length;                  //字符串获取长度
    11
    s2.trim();                  //移除字符串两端空格,形成新的字符串
    "Hello"
    s2.trimLeft();              //移除字符串左端空格,形成新的字符串
    "Hello   "
    s2.trimRight();             //移除字符串右端空格,形成新的字符串
    "   Hello"
    
    //定义字符串
    var s1 = 'When you think you’re not happy with ' +
        'your life, always remember that someone is happy simply ' +
        'because you exist.';
    s1.charAt(10)               //获取第10个字符
    "h"
    
    var s2 = 'hello';
    s2.concat(' boy');          //字符串拼接,形成新的字符串
    "hello boy"
    
    var s1 = 'Good morning'
    s1.indexOf('o',5);          //获取字符在字符串的索引
    6
    
    s1.substring(-5,4);         //字符串切片,不支持负数,负数会变0
    "Good"
    s1.substring(0,-5);         //字符串切片,不支持负数,负数会变0,获取不到返回空字符串
    ""
    
    s1.slice(0,-3);             //字符串切片,支持负数
    "Good morn"
    
    s1.toLowerCase();           //字符串所有字符变为小写,形成新的字符串
    "good morning"
    s1.toUpperCase();           //字符串所有字符变为大写,形成新的字符串
    "GOOD MORNING"
    
    s1.split(' ',1);            //字符串以空格分割,可加参数(返回结果的个数),返回的是数组
    ["Good"]
    
    s1.split(' ',3);            //字符串以空格分割,可加参数(返回结果的个数),返回的是数组
    ["Good", "morning"]

    补充:

    ES6中引入了模板字符串。模板字符串(template string)是增强版的字符串,用反引号(`)标识。它可以当做普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。

    // 普通字符串
    `这是普通字符串!`
    // 多行文本
    `这是多行的
    文本`
    // 字符串中嵌入变量
    var name = "xiaoming", time = "today";
    `Hello ${name}, how are you ${time}?`

    ③.布尔值Boolean

    True和False

    ""(空字符串)、0、null、undefined、NaN都是false

    ④.null

    null表示值是空,可以手动指定

    ⑤.undefined

    undefined表示当声明一个变量但未初始化时,变量的默认值是undefined

    函数没有明确指定返回值,默认返回的就是undefined

    ⑥.对象Object

    JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...此外,JavaScript 允许自定义对象。

    JavaScript 提供多个内建对象,比如 String、Date、Array 等等。

    对象只是带有属性和方法的特殊数据类型。

    数组(Array)

    数组对象的作用是:使用单独的变量名来存储一系列的值。类似于Python中的列表。

    //数组常用方法:
    var li = ['a','b','c','d','e','f']      // 定义数组
    li.length;                              // 获取数组的长度
    6
    li.push('k');                           // 数组末尾追加元素
    7
    li                                      // 数组
    (7) ["a", "b", "c", "d", "e", "f", "k"]0: "a"1: "b"2: "c"3: "d"4: "e"5: "f"6: "k"length: 7__proto__: Array(0)
    li.pop();                               // 删除数组末尾的元素并返回
    "k"
    li
    (6) ["a", "b", "c", "d", "e", "f"]
    li.unshift('z');                        // 数组头部插入元素
    7
    li.shift();                             // 删除数组头部的元素并返回
    "z"
    li                                      // 数组
    (6) ["a", "b", "c", "d", "e", "f"]
    
    li.slice(2,5);                          // 数组的切片
    (3) ["c", "d", "e"]
    li.reverse();                           // 翻转数组,在数组的基础上改变
    (6) ["f", "e", "d", "c", "b", "a"]
    
    li.join('+');                           // 将数组的元素拼接成字符串,数组的元素必须字符串类型
    "f+e+d+c+b+a"
    
    li.sort();                              // 数组的排序,在数组的基础上改变
    (6) ["a", "b", "c", "d", "e", "f"]
    
    li.concat('z','x','c');                 // 数组的连接,类似列表的expend,形成新的数组,不改变原来数组
    (9) ["a", "b", "c", "d", "e", "f", "z", "x", "c"]
    
    li.splice(1,3,'z','x','c','v','n');     //删除元素,并向数组添加元素,参数(下标,删除的个数,插入的值),在原数组上
    (3) ["b", "c", "d"]
    li
    (8) ["a", "z", "x", "c", "v", "n", "e", "f"]

    关于sort()需要注意:

    如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

    如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

    若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
    若 a 等于 b,则返回 0。
    若 a 大于 b,则返回一个大于 0 的值。

    function sortNumber(a,b){
        return a - b
    }
    var arr1 = [11, 100, 22, 55, 33, 44]
    arr1.sort(sortNumber)

    自定义对象(类似于python中的字典)

    var dic = {name:'xiaoming',age:20};
    
    dic
    {name: "xiaoming", age: 20}

    六、类型查询

    // 字符串的判断
    typeof 'abc'
    "string"
    typeof 123.456;
    "number"
    typeof null;            // object类型
    "object"
    typeof undefined;       // undefined类型
    "undefined"
    typeof NaN              // number类型
    "number"

    七、运算符

    ① 算术运算符

    +、-、*、/、%、++、--

    ② 比较运算符

    >  、 <  、 <=  、  >=   、  !=   、  ==    、=== 、 !==

    != :判断两边的值是否不相等

    !==:判断两边的值和类型是否不相等

    1 != '1';                  //false
    1 !== '1';                 //true

    ==:弱等于,判断两边的值是否相等

    ===:强等于,判断两边的值和类型是否相等

    1 == '1';               //true
    1 === '1';              //false

    ③ 逻辑运算符

    &&  与

    ||      或

    !       非

    ④ 赋值运算符

    = 、 +=  、 -=  、*=  、 /=

  • 相关阅读:
    连接服务器时通时不通的问题
    二进制包搭建k8s集群
    2、带着问题学习JVM_对象存活_垃圾回收的内容_理论_收集算法
    四、redis事务_真正实现分布式Lua_分布式锁
    四、Spring 框架中接入单机Redis的两种方式
    3、通过zkCli⼯具命令和zk 的java API两种方式创建⼀个主从模式示列
    1、带着问题学习JVM_Java为什么属于编译型+解释型的高级语言_Class类文件结构理解
    2、zookeeper安装、常用命令、API说明及简单示列(创建ZK会话及对节点进行操作、创建分布式锁、创建全局唯一ID)
    1、zk的产生、优劣、基础知识
    十三、Spring容器的原理及源码分析
  • 原文地址:https://www.cnblogs.com/st-st/p/9778236.html
Copyright © 2020-2023  润新知