对象、字符串大全

98 阅读15分钟

JavaScript对象的基本介绍 对象是JavaScript中一种数据类型 存储数据的集合 JavaScript中对象的索引是字符串类型, 以键值对的形式存储数据 键名:键值 / 键:值 / 属性:属性值 JavaScript语法 自变量 var 对象={键名:键值,键:值,属性:属性值}; 构造函数 var 对象=new Object({键名:键值......}); 浏览器显示对象内容时,按照键名的首字符顺序显示,是浏览器本身设定的显示效果,与js程序没有关系

对象的基本操作

       调用
         语法形式1
            对象.属性
            对象.键名
            对象.键
           获取对应的属性值/键值/值
         语法形式2
            对象['属性']
            对象['键名']
            对象['键']
           获取对应的属性值/键值/值
  点语法和[]语法的区别
        1,  键名/键/属性一般都是字符串形式 
             如果键名是数值类型,点击语法不支持,执行结果是报错,[]语法支持,可以获取对应的结果
       2,  通过变量中存储的键名/键/属性 获取对应的 数据
           点语法不能解析变量,会使用变量名称作为键名获取对应的数据
           []语法可以解析变量,会使用,变量中存储的数据作为键名获取对应的数据 
                    []语法中 写入的是 键名 要加 定界符  ,[]语法中 写入的是 变量 不要加 定界符
          
       修改
         对已经存在的键名/键/属性进行重复赋值操作
          后赋值的数据覆盖存储的原始数据,执行效果是修改对象中存储的数据

一定不会存储重复的属性

       新增
         对不存在的键名/键/属性进行赋值操作
                给对象新增数据单元设定键名和存储的键值

       删除
          delete( 对象.属性 )
          delete( 对象['属性'] )
          delete 对象.属性
          delete 对象['属性']
                删除对象中指定的单元

数组去重方法2 数组排序完成数组去重 1.将数组使用sort()方法进行排序 排序后相同的数值会相邻排序 2.循环遍历数组 如果循环的当前单元存储的数值和下一个单元存储的数值相同,删除数组的下一个单元

数组坍塌 定义:执行数组删除操作时,删除了数组单元,被删除单元之后的单元会前移,出现在删除单元位置上,造成数组长度减少的效果,称之为数组坍塌 数组坍塌会对数组的循环造成影响,触发删除操作之后,立即触发数组的坍塌,如果直接继续执行之后的程序,坍塌过来的新的单元,没有触发执行本来应该执行的比较判断 消除数组坍塌对于循环的影响,本质上是让触发删除的循环再次执行 触发删除的同时执行i--,通过控制循环变量的数值控制循环的进程。让触发删除操作的循环位置再次循环遍历 数组坍塌不能阻止,只能消除影响

对象的循环遍历 使用for...in循环遍历对象 for( var 变量 in 对象 ){} 变量中存储的是对象中每个单元的属性/键名/键 必须使用 []语法,也就是对象[变量] 调用对应的数据 实际项目中因为对象中存储的数据不是每一项都会使用,一般不会循环遍历整个对象 使用解构赋值的方式操作复杂的对象

字符串操作 又称为包装数据类型,支持[]语法和length属性的操作 可以通过[]语法设定索引下标获取字符串中的一个字符;可以通过length属性获取字符串长度,也就是字符串中字符的个数 字符串的索引下标也是从0开始的连续整数 不可以通过[]语法修改字符串中的字符

字符串的循环 可以通过for for…in for…of循环遍历字符串 for循环 生成第一个字符串到最后一个字符串的索引下标,0至字符串.length-1 for…in循环 变量中存储的每一个字符的索引下标 for…of循环 变量中存储的每一个字符 支持[]语法,可以通过索引下标获取字符串中的字符 支持length属性,可以获取字符串长度也就是字符个数 字符串索引下标范围是0至字符串.length-1

随机数值 在JavaScript中可以生成0-1的随机小数,生成的结果可以是0不可能是1 Math.random()

      生成指定范围内的随机整数
       随机数的范围是数值1至数值2
        对应公式:parseInt(Math.random()*(数值2+1-数值1)+数值1);
        需要的范围是 10 - 15
            随机数范围 是 0 - 0.9999...
            随机数 * 6 结果是 0 - 5.99999... 取整是 0 - 5 
            随机数 * 6 + 10 结果是 10 - 15.99999... 取整 是 10 - 15 

随机索引下标 字符串随机索引下标的范围是 parseInt( Math.random() * 字符串.length ); 数组随机索引下标的范围是 parseInt( Math.random() * 数组.length );

字符串操作

  1. 包装数据类型
  2. 字符串循环
  3. 字符串操作函数 (1) 字符串查询类(字符串查询函数) (2) 字符串截取 substr,substring,sslice (3) 字符串替换 (4) 字符串大小写 (5) 字符串=数组 (6) 字符串获取字符 (7) 字符串去除空格 (8) 字符串拼接

字符串查询函数 字符串.indexOf( '字符' ) 如果有匹配的字符,返回值是这个字符第一次出现位置的索引下标 如果没有匹配的字符,返回值是-1

        字符串.search( '字符' / 正则表达式 )
            执行效果 和 indexOf() 完全相同
            可以支持正则表达式作为搜索查询内容

        字符串.lastIndexOf( '字符' )
            如果有匹配的字符,返回值是这个字符最后一次出现位置的索引下标
            如果没有匹配的字符返回值是 -1

        字符串.includes( '字符' )
            如果有匹配的字符,返回值是true
            如果没有匹配的字符,返回值是false

        字符串.startsWith( '字符' )
            是不是以这个字符开始,是则返回值true,不是则返回值false

        字符串.endsWith( '字符' )
            是不是以这个字符结束,是则返回值true,不是则返回值false

字符串替换操作 使用新内容调换字符串原始内容 字符串.replace( 旧内容 , 新内容 ); 不会改变原始字符串内容,执行结果返回值是替换之后新字符串 默认执行懒惰模式,只会替换第一个符合的内容 实际项目中可以使用正则表达式替换所有符合的内容

字符串截取函数 不会改变字符串原始内容 字符串.substr(参数1,参数2) 参数1 截取起始位置的索引下标 0/正数 截取起始位置的索引下标 负数 从倒数第几个字符开始截取 参数2 截取字符的个数 没有设定 截取至字符串末位 0/正数 截取字符的个数 负数 截取结果是空字符串 字符串.substring(参数1,参数2) 参数1 截取起始位置的索引下标 0/正数 截取起始位置的索引下标 负数 没有作用,从字符串起始位置开始截取 参数2 截取结束位置的索引下标 没有设定 截取至字符串末位 0/正数 截取结束位置的索引下标 负数 向字符串起始反方向截取 截取内容不包括结束位置的数据

字符串函数_字符串统一大小写 字符串.toUpperCase() 所有字符大写 字符串.toLowerCase() 不会改变原始字符串内容 所有字符小写

字符串函数_获取字符 获取指定索引下标对应的字符 字符串.charAT(索引下标) 获取指定索引下标相对应的字符的SACII码 字符串.charCodeAT()

字符串函数_去除空格 字符串.trim() 去除字符串两侧的空格 字符串.trimStart() / 字符串.trimLeft() 去除左侧空格 字符串.trimEnd() / 字符串.trimRight() 去除右侧空格 实际项目中对于输入内容的验证往往是去除两侧空格之后在做验证

字符串函数 截取 拼接 字符串.slice(参数1,参数2); 参数1 截取起始位置的索引下标 0 正数 截取起始位置的索引下标 负数 截取结果是 空字符串

        参数2   截取结束位置的索引下标
            不设定         截取至字符串末位
            0 正数     截取结束位置的索引下标
             负数     从起始位置开始截取至字符串末位,负数是少截取的字符个数
        截取结果包括起始位置的字符 ,不包括结束位置的字符
       字符串.concat( 字符串1 , 字符串2 ... ); 
            将多个字符串拼接为一个字符串 
            不会改变原始字符串内容
            函数的执行结果返回值是拼接的新字符串

Math内置对象 内置对象是JavaScript已经定义好的对象,直接调用使用即可 Math就是js程序已经定义好的对象,其中存储了数据和函数方法,我们可以直接调用使用

Math内置对象中的属性属性值 Math.PI 圆周率 Math.SQRT2 根号2的数值

Math内置对象中的函数方法 Math.min( 数据1 , 数据2 , 数据3.... ) 返回 设定数据中的最小值 Math.max( 数据1 , 数据2 , 数据3.... ) 返回 设定数据中的最大值 Math.random() 0 - 1 的随机小数,可以是0不会是1 如果要生成数值1至数值2范围内的随机整数,并且包括数值1和数值2,公式是 parseInt( Math.random() * ( 数值2 + 1 - 数值1 ) + 数值1 ) ; 如果需要获取数组/字符串中任意一个字符 生成所有的索引下标中的随机数值 所有索引下标的范围是0 至 数组.length-1 / 字符串.length-1 套用公式的结果是 parseInt( Math.random() * 数组.length / 字符串.length ) Math.pow( 底数 , 指数 ) 乘方运算/幂运算 Math.round() 四舍五入取整 Math.floor() 向下取整 变小 Math.ceil() 向上取整 变大 Math.abs() 绝对值 Math.sqrt() 求平方根 变量.toFixed(小数位数) 将数据转化为字符串,同时四舍五入保留指定位数的小数

                保留指定位数的小数,不四舍五入
            parseInt(变量*100)/100
                  数值 * 100 
                  取整 parseInt() / Math.floor()
                  取整结果 / 100

时间对象 通过JavaScript内置构造函数创建时间对象 通过内置构造函数Date() 其中重要的函数方法有两类 get... 获取时间对象中存储的时间数据 set... 设定时间对象中存储的时间数据

创建时间对象的函数方法 语法1 没有参数,获取的是当前时间对象 var 变量=new Date(); 语法2 设定参数,获取的是设定时间对应的时间对象 var 变量=new Date('年-月-日 时:分:秒'); var 变量=new Date('年/月/日 时:分:秒'); var 变量=new Date('年 月 日 时:分:秒'); var 变量=new Date('年,月,日 时:分:秒'); 参数是一个字符串类型,年月日之间可以是多种间隔符号,年月日与时分秒之间必须有空格间隔,时分秒之间必须是冒号间隔 输入的时间数据,不能超出正常值范围 实际项目推荐使用字符串语法设定时间 var 变量=new Date(数值1,数值2,数值3,数值4,数值5,数值6) 参数是多个数值类型,分别是年月日时分秒 设定的数值可以超出正常值范围,会自动进位 输入的月份是0-11的数字对应1-12的月份,也就是设定9月输入的数值是8

获取时间对象数据 创建好时间对象之后,通过设定的函数方法,获取时间对象中存储的时间数据,使用的是get...()相关的函数方法 get...() 获取当前时区时间,有时差 getUTC...() 获取世界标准时间,没有时差 年份 时间对象.getFullYear() 获取4位年份 月份 时间对象.getMonth() 获取结果是0-11的数字对应1-12的月份 如果需要获取月份数字,获取结果+1是正确的月份 如果需要获取月份文字,设定数组单元是从1月-12月的文字,使用获取结果作为索引下标获取对应的月份文字 日期 时间对象.getDate() 直接获取 星期 时间对象.getDay() 获取结果是0-6的数字对应星期日-星期六 如果需要获取星期文字,设定数组单元存储的数据是星期日-星期六的文字,使用获取结果作为索引下标从数组中获取对应的星期文字 小时 时间对象.getHours() 分钟 时间对象.getMinutes() 秒 时间对象.getSeconds() 直接获取 时间结果输出时,往往需要前置补0/前导补0 设定时间对象数据 时间对象.set…() 设定时间是当前时区的时间 时间对象.setUTC…() 设定时间是世界标准时时间 时间对象.setMouth() 设定月份 月份数值是0-11的数字对应1-12的月份 星期不能设定 创建一个时间对象,通过制定的函数方法设定时间对象中存储的时间数据 设定的数值可以超出正常值范围好、,会自动计算进位 实际项目一般不使用 时间戳 距离格林尼治标准时间1970年1月1日0点0分0秒的时间差 在JavaScript中时间戳的单位是毫秒 1秒是1000毫秒 语法:时间对象.getTime() 在实际项目中,时间戳有非常重要的作用,用于计算时间差 终止时间对象的时间戳-起始/当前时间对象的时间戳,就是两个时间之间的时间差,单位是毫秒

定时器 JavaScript语言特有的执行程序方式,根据设定的时间间隔,循环往复执行程序 定时器执行效果和循环执行效果的区别 1.定时器是每间隔一段时间触发执行的程序 循环时一次性把所有的循环执行完成 2.定时器如果不终止/清除,会一直触发执行 循环如果是死循环,会造成程序执行崩溃 3.循环时一打开页面就会触发执行,定时器第一次触发是在设定的时间间隔之后触发执行 原因:定时器的执行原理遵守异步程序的执行原理 语法形式 setInterval(回调函数,间隔时间); 回调函数 可以赋值匿名函数/函数名称(变量名称) 回调函数本质是赋值一个函数的内存地址 间隔时间 单位是毫秒

document.write()执行的是直接向页面中写入内容,不是覆盖写入 DOM操作执行的是覆盖写入效果

    // 获取标签对象
    const oDiv=document.querySelector('div');

延时器 按照设定的时间间隔延迟执行程序 定时器会一直触发执行程序,除非清除定时器,延时器只会触发执行一次程序 语法: setTimeout(回调函数,时间间隔); 参数1 要执行的函数程序,以回调函数的语法形式设定的,可以是匿名函数/函数名称/存储函数内存地址的变量 参数2 时间间隔,单位是毫秒

清除定时器延时器 语法: clearInterval() clearTimeout() 两个函数方法都是既能清除定时器又能清除延时器,执行函数时,必须输入要清楚的定时器或者延时器的序号/编号 所谓的序号/编号就是定时器延时器的排序,从1开始的连续整数 整个程序中,所有定时器、延时器使用的是同一序列编号 定时器延时器函数程序的执行结果返回值就是这个定时器延时器的序号/编号,可以使用变量存储 实际项目中推荐使用变量存储定时器延时器的序号/编号

单线程、多线程 单线程:在计算机程序中同时只能触发执行一个程序,也就是所有程序都必须按照顺序一个一个的触发执行,上一个程序执行结束才会触发执行下一个程序 JavaScript php 是单线程程序

       多线程:在计算机程序中同时可以触发执行多个程序,也就是程序可以按照线程设定执行,同时可触发执行多个程序
       java Python 都是多线程

同步程序、异步程序 是JavaScript中代码的执行顺序 执行JavaScript程序时,先执行所有的同步程序,遇到异步程序,先存储到异步池中,等所有的同步程序都执行结束,同时触发执行异步池中存储的异步程序,时间间隔短的异步程序会先触发执行,时间间隔相同的异步程序会按照顺序执行 异步池:是内存中专门存储异步程序的存储空间,人为命名为异步池