JavaScript02

最新推荐文章于 2024-09-25 14:00:00 发布

Shahid_x

最新推荐文章于 2024-09-25 14:00:00 发布

阅读量466

点赞数

文章标签： javascript elementui vue.js

本文链接：https://blog.csdn.net/xx_052810/article/details/123040758

版权

一、数据类型转换

1.强制转换

 转字符串：
     toString() undefined/null 不能使用
     String()   等效于隐式转化
 转数字:
     ParseInt() 转为整型
     ParseFloat()  转为浮点型
     以上两种碰到非字符就停止
     Number() 等效于隐式转换
 转布尔：
     Boolean()  简化写法  !!str
     为false的6个值：0 "" undefined null NaN false
复制代码

2.隐式转换

    1. + 两边只要遇到了字符串，两边都会转换为字符串，再拼接
    2. - * / % 字符串会转换为数字，但是只有纯数字的字符串才可以，遇到非纯数字，结果为NaN 
    3. !isNaN（）判断是否为一个纯数字
复制代码

二、运算符与表达式

1.算数运算符

+ - * / %
复制代码

2.比较运算符

> < >= <= == != === !==
比较运算默认转换为数字再比较
复制代码

3.逻辑运算符

&& 与运算， || 或运算， ！ 非运算
短路逻辑：
    &&短路简化了简单的if(){}
    条件 && （操作） 条件满足时执行括号里面的操作
    ||短路 两个值二选一，后期可以做浏览器的兼容
    e = e || window.event
复制代码

4.位运算

左移 m << n 相当于m * 2的n次方；
右移 m >> n 相当于m / 2的n次方；
复制代码

5.赋值运算符

+= -= /= *=  %= ++ --
i++ 先运算，再递增
++i 先递增，再运算
复制代码

6.三目运算符 ?

条件1 ? 操作1 ： 条件2 ? 操作2 ：操作3;
条件1满足执行操作1，不满足，再判断条件2，条件2满足，执行操作2，不满足执行操作3
默认操作不能省略，尽量使用三目代替if else
复制代码

三、自定义functon

1.创建：

    1.声明方式：function 函数名(形参...){函数体}
    2.函数表达式：var 函数名=function(形参...){函数体}
复制代码

2.调用

函数名()
复制代码

3.作用域

1.全局作用域
    全局变量和全局函数在页面的任何位置都可以使用
2.局部作用域
    在当前函数调用时内部可用
使用规则：优先使用自己的，自己没有找全局，全局没有就报错
缺点：
    1.在函数中对为声明的变量直接赋值会造成全局污染
    2.局部可以用全局，全局不能用局部，可以使用return解决，
    return的本意是退出函数，如果return后跟着一个数据，会将数据返回，但不负责接收
    函数省略return会返回undefined
复制代码

4.声明提升

在程序正式执行之前，将var声明的变量和function声明的函数集中在当前作用域顶部定义，但是，赋值留在原地
复制代码

5.按值传递

如果传入的值是一个原始数据类型，修改一个变量，另一个变量不会受到影响。
如果传入的是一个应用类型的对象，修改一个变量，另一个变量也会受到影响。其实操作的是一个地址值。
复制代码

四、预定义的全局函数

1.编码、解码

问题：url中不允许出现多字节字符，会出现乱码，
编码 encodeURI(n) /  encodeURIComponent(n)
解码 decodeURI(n) /  encodeURIComponent(n)
复制代码

2.isFinite(n) 判断n是否为无穷大

true 说明n是一个有效数字   false 说明n为无穷大
为false的情况：NaN Infinity 分母为零
复制代码

3.ParseInt() PaeseFloat() isNaN() eval()

eval() 计算字符串  如果字符串为运算表达式，eval可以得出结果
复制代码

五、数组

1.关联数组（hash）：下标可以自定义的数组

创建:1.创建一个空数组
     2.为数组添加下标，并添加元素  arr["自定下标"] = 值
访问：
    arr["下标名"]
ps：
    关联数组的length为0
    遍历数组不能用for  要用for in
复制代码

2.数组API

1.join("自定义连接符") 将数组转为字符串并以自定义连接符拼接
2.concat() 添加元素
    arr.concat(元素...) 将数组arr复制一份，再添加元素。
    ps:1.concat不修改元素组，只会返回一个新的数组
       2.concat支持传入元素为一个数组，会自动吧数组拆分为单个元素
3.slice()截取
arr.slice(开始下标，结束下标)
ps：
    1.不修改原数组，返回一个新的子数组
    2.含头不含尾
    3.结束下标不写，会截取到末尾
    4.两个参数不写，从头截到尾，相当于深拷贝
    5.支持负数，从末尾数起
4.splice()删除，插入，替换
arr.splice(开始下标,n,新值...)  n为删除个数
ps:
    1.返回值为删除元素组成的数组
    2.不能插入数组，会导致一些数组为一维数组，一些为二维数组
5.reverse() 翻转数组
6.sort()排序 默认转为字符串，按位pk
    按数字排序：
        arr.sort(function(a,b){
            升序排列：return a-b;
            降序排列: return b-a;
        })
    ps:字符串只能升序排列，再用reverse()
    只要页面中有排序功能，底层一定是一个数组，只有数组具有排序功能
7.unshift() 从数组头部添加元素
8.shift() 从数组头部删除元素 返回值为删除的元素
9.push() 从数组尾部添加元素
10. pop() 从数组尾部删除元素 返回值为删除的元素
复制代码

3.二维数组

访问： arr[行下标][列下标]
    列下标越界：返回undefined
    行下标越界：报错
复制代码

五、String

1.和数组的相同之处

str.length
str[i]
遍历字符串
数组不修改原数组的API字符串都能使用
复制代码

2.String API 都不会修改原字符串

1.转义字符 \
    字符串中的特殊标点符号需要用转义字符
    \n 换行
    \t 制表符
    \u 输出Unicode编码的字符   \u4e00 - \u9fa5   汉字的unicode返回
2.大小写转换
    toUpperCase()  转为大写
    toLowerCase()  转为小写
3. 获取字符串指定位置的字符
    charAt(i)
4. 获取字符串指定位置的字符的ASCII码
    charCodeAt(i)
5. 将ASCII码转回原文
    String.fromCharCode(ascii码)
6. 检索字符串：获取关键字的下标  数组也有这个API
    str/arr.indexOf("关键字",开始下标)
    从开始下标开始，查找右侧关键字的位置，开始下标省略则从头开始找
    找到返回第一个关键字的下标，没找到返回-1，一般不关心返回多少，只关心是否返回-1
    ps：
        默认只返回第一个关键字的下标，怎样才能返回所有
        var str = "no zuo no die no can no bb"
        var index = -1
        while((index = str.indexOf("no",index + 1))!=-1){
            console.log(index)
        }
7. 截取字符串
    slice(开始下标,结束下标) 支持负数
    subString(开始下标,结束下标) 不支持负数
    subStr(开始下标，n) n为个数，支持负数
8. 字符串拼接
    concat()   不如用 + 运算
9. 替换字符串
    replace("关键字"/正则表达式，"新内容")
    高级替换
        replace(正则表达式，function(a,b,c){
            操作
        })
        a：匹配到的当前关键字
        b：关键字的下标
        c：原文
10.分割字符串
    split("自定义切割符")
    ps：
        切割后，切割符就不存在了
        返回的是一个数组
        "" 切割每一个字符
    
复制代码

扩展：

1.舍入误差： toFixed(n)   带有四舍五入的功能，可以保留n位小数
2.onchange事件： 元素内容改变就会触发
3.select专属属性： select.selectedIndex 获取option选中项的下标
4.周期性定时器： setInterval(function(){},1000)
    1000为间隔时间ms
5.鼠标移入移出事件  
    onmouseenter
    onmouseleave
    ps:
        不会产生冒泡
6.js创建空元素
    document.creatElement("标签名")
  为此元素添加必要属性
    ele.属性名 = "属性值"
  渲染到Dom树
    父元素.appendChild(元素)