美文网首页前端开发学习
前端JS基础知识点梳理(一)基础篇

前端JS基础知识点梳理(一)基础篇

作者: Alawaysonl_c839 | 来源:发表于2019-06-19 19:56 被阅读0次

    导读

    我相信有很多人和我一样都是半路出家的前端开发,当初就是找了一个培训机构培训个四五个月就出来找工作了,所以对于前端Js基础部分掌握的很薄弱,虽然工作是找到了,但是在日常工作中遇到的很多问题不知道怎么解决或者不知道如何产生的,都是基础不牢导致的,所以我想翻梳理一下前端JS的基础部分,也记录下来,记一记写一写可能会加深自己的理解和记忆,也希望可以帮助有需要的同学;

    我也是一边看视频一边梳理,看到哪里梳理到哪里,也会不断的慢慢完善。有不全的地方或者是不对的地方欢迎指出讨论。谢谢~


    1.创建变量方式的

    变量的定义是储存具体值的容器,储存的值可以随时改变;

    1、var name = 'name';创建变量
    2、let name = 'name'; 创建变量
    3、const name = 'name'; 创建常量
    4、function () {}; 创建函数
    5、import 导出的模块信息
    6、class 创建类
    (对于import 创建变量我理解的不是很深,应该是引入导出的模块,创建一个名来存储导入模块的信息;)


    2.数据类型

    基本数据类型:
    number(数字 NAN 是数字类型,但不是数字)
    string(字符串)
    boolean(布耳)
    null
    undefined

    引入数据类型:
    Object(普通对象、数组对象、时间对象、正则对象等)
    function(函数)

    Symbol(es6新的基础数据类型)唯一的值
    (我没用过,是单独的数据类型,是唯一性的值,类似于ID这样的)


    3.数字类型

    类型转换

    通过Number()方法进行转化
    基本类型的转化
    1、Number([字符串]);如果字符串中出现任意一个非有效数字,结果则为NAN;
    2、Number([布尔]); true = 1; false = 0;
    3、Number([null]) = 0;
    4、Number([undefined]) = NaN;

    引用类型
    先把引用类型的值.toString()转换为字符串,然后在把字符串Number()转换为数字;
    1、对象.toString() => [Object, Object] => NaN
    2、数组[1, 2].toString() => '1, 2' => NaN
    3、数组[1].toString() => '1' => 1
    4、数组[].toString() => '' => 0

    解析字符串数字

    从字符串最左侧字符开始查找有效数字,并转换成有效数字字符,遇到一个非有效数字字符就结束查找;
    parseInt: 把字符串整数部分解析出来 parseInt('1.5px') => 1
    parseFloat: 把字符串包含小数的部分解析出来 parseInt('1.5px') => 1.5

    NaN的比较

    NaN和谁都不相等,包括自己; if (NaN == NaN) => false;

    4.布尔类型

    true 和 false 只有两个值; true = 1 false = 0;
    js中只有 0、null、undefined、NaN、空字符串是false,其余都是true

    5.null && undefined

    null 代表空对象指针
    undefined 代表未定义

    6.数组常用方法

    1、push => 向数组最后一项添加新内容。 返回值是新增后数组的length;
    2、pop => 删除数组最后一项。返回值是被删除的那一项内容;
    3、shift => 删除数组第一项。返回值是被删除的那一项内容;
    4、unshift => 向数组开始位置添加新内容。返回值是新增后数组的length;
    5、splice
    删除 arr.splice(n, m)
    从索引n开始,删除m个内容。返回删除内容的新数组;如果没有传m 则从n开始删除至数组的末尾;
    新增 arr.splice(n, 0, m)
    从索引n开始,删除0项内容,把m项内容添加到索引n前面;返回空数组;
    修改 arr.splice(n , m , x)
    从索引n开始,删除m项内容,把x项内容插入到n前面;返回删除数组;
    6、slice
    slice(n, m) 从索引n开始,查找到索引m,不包括索引m;返回查找到的新数组
    7、concat
    拼接数组,可以拼值或数组;返回值是拼接的新数组

    let arr1 = [1, 2, 3], arr2 = [11, 22, 33];
    console.log((arr2)arr.concat(arr2)) = [1, 2, 3, 11, 22, 33];
    arr1.concat('hello', arr2) = [1, 2, 3, "hello", 11, 22, 33];
    [].concat(arr1, arr2) = [1, 2, 3, 11, 22, 33];
    空数组可以占位,后面的顺序可以自己排列
    
    

    8、toString && join

    toString把数组转为以逗号分割的字符串
    join把数组转为指定字符分割的字符串

    let arr = [1, 2, 3, 4];
    arr.toString() = "1,2,3,4,5,11";
    arr.join('、') = "1、2、3、4、5、11";
    

    9、reverse && sort

    排序
    reverse 是把数组倒过来排,返回新数组,原数组改变;
    sort 升序或者倒序,返回新数组,原数组改变;

    sort
    let arr = [1, 3, 6, 77, 11, 45, 71]; 
    arr.sort(function(a, b) {return a-b}) 
    console.log(arr) = [1, 3, 6, 11, 45, 71, 77];
    a-b 正序 b-a 倒序
    
    reverse
    arr = [22, 11, 4, 5,111, 55,68, 13];
    arr.reverse()
    console.log(arr) = [13, 68, 55, 111, 5, 4, 11, 22] 
    倒序排列
    

    10、indexOf && lastIndexOf
    检查数组中是否有某一项,如果有,返回对应的索引,如果没有对应项,返回-1;

    7.字符串的常用方法

    1、charAt && charCodeAt

    charAt 根据索引找到字符串对应的字符,并返回;
    charCodeAt根据索引找到字符,返回Unicode码。fromCharCode() 可以把Unicode码转回对应的字符;具体没用过。

    let str = 'hello word'
    str.charAt(1)
    "e"
    

    2、indexOf && lastIndexOf

    和数组一样,查找对应的字符,找到返回对应的所以,找不到对应的字符返回-1

    let str = 'hello word'
    str.indexOf("d")
    9
    

    3、slice && substring && substr

    str.slice(n, m) 从索引n开始查找到索引m,不包含m;返回新字符串;支持负数索引;
    str.substring(n, m) 从索引n开始查找到索引m,不包含m;返回新字符串;不支持负数索引;
    str.substr(n, m) 从索引n开始截取m个字符;

    str.slice(1,3)
    "el"
    str.substring(1,3)
    "el"
    

    4、toUpperCase && toLowerCase

    toUpperCase 字符串小写转大写;
    toLowerCase 字符串大写转小写;

    str.toUpperCase()
    "HELLO WORD"
    
    str.toLowerCase()
    "hello word"
    

    5、split

    和数组的join类似,split把字符串按照指定的分隔符拆分成数组中的每一项,也可以理解为字符串转数组;

    str.split(' ')
    ["hello", "word"]
    
    str.split('')
    ["h", "e", "l", "l", "o", " ", "w", "o", "r", "d"]
    

    6、replace

    替换字符串中原有的字符;

    str.replace('hello', 'hi')
    "hi word"
    

    相关文章

      网友评论

        本文标题:前端JS基础知识点梳理(一)基础篇

        本文链接:https://www.haomeiwen.com/subject/anjlqctx.html