JavaScript思维导图

JavaScript基础学习知识点分享！一张图学会，一小时了解，一天写代码！本思维导图包含JavaScript的循环、流程控制、作用域、运算符、书写位置、输入输出语句、变量、数组、函数、对象等基础知识，详细全面，带你轻松入门！

JavaScript

• 循环
  • for（var i=1；i<=1000;i++){}
  • while(i<1000){}
  • do{}while(i<1000)
  • break退出循环
  • contine跳出当前的循环
• 流程控制
  • 分支流程控制if(){}
  • if(){}else{}双分支语句
  • if(){} else{} elseif(){}多分支语句
  • 三元表达式；a？b：c
    • eg：1？0：2，，0
  • 分支流语句switch
• 作用域
  • 全局变量；
  • 局部变量；
  • 没有块级作用域
  • 作用域链
    • 就近原则
• 运算符
  • 算术运算符+ - * / %
  • 自增自减++ --
    • 前置++num；num=num+1
    • 后置num++；先返回原值再加1
  • 比较运算符>= ,=<,==,!=,===全等（类型，数值）
  • 逻辑运算符 &&，||，！
  • 赋值运算符+=，-=，*=，/=，%=
• 书写位置
  • 行内式
    • 直接卸载标签内
  • 注释
    • 单行注释
      • //
    • 多行注释
      • /*。。。*/
  • 内嵌式
  • 外部
  • 标签：<script>……</script>双标签
• 输入输出语句
  • alert=浏览器弹出警示框
  • console.log=控制台输出
  • prompt=浏览器弹出输入框
• 变量
  • var=生成变量，eg：var age;
  • 遵循驼峰命名法，eg：myFirstName
• 数组
  • var num[]
  • 遍历数组
    • for(var i =0;i<=num.length);i++){ }
    • 数值长度num.length
  • 数组转换为字符串
    • for（var i=0；i<num.length;i++){ str += num[i];}
  • 添加到数组
    • 修改length长度添加元素
      • num.length=5
      • num[i]=str
• 函数
  • function name(num1,num2){}构造函数；表达格式1
    • 表达格式2；var 变量名 = function（）{}
  • 函数的返回值return
  • 没有返回值则返回undefined
  • 预解析
    • 把函数放到作用域的最前面
    • 代码运行顺序，至上而下
  • arguments（伪数组），使用方法在函数体内直接读取实参{ str=arguments}
    • eg：function NAME(){ str=arguments;} NAME(1,2,3) out：可以读取到123
    • 伪数组
      • 具有数组的length属性
      • 按照索引的方式进行存储
      • 没有pop（），push（）功能
• 对象
  • 利用{}创建对象方法一 ； var obj = { name :'zhangsan', age:18, say:functon(){ console.log(hello); } }
  • 创建方法二： var obj = new Object(); obj.name='zhangsan'; obj.age = 18;
  • 调用对象
    • ①obj.name调用对象属性
    • ②obj['name']调用对象属性
    • ③obj.say()调用对象函数
  • 遍历对象
    • eg：for(var i in obj){ console.log(i); console.log(obj[k]); }
      • 第一个输出的是属性名
      • 第二输出的是属性值
• 构造函数
  • 构造需要new，对象不需要new
  • 创建方法三，利用构造函数； function 构造函数名称 (){ this.属性 = 值； this.方法 = function(){ } } 调用方法： new 构造函数名();
    • 构造函数名首字母要大写
    • 不需要return
  • new可以在内存中创建一个空的内存， this全部指向内存， 给空对象添加属性和方法
• 内置对象
  • MDN；开放网络技术， 包括html，css等
    • utl：https：//developer.mozilla.org/zh-CN/
    • Math数学对象， 使用不需要new
      • Math.max（）= 寻找最大值
      • Math.random()=返回0-1之间的随机小数
      • Math.abs()=绝对值
    • Date日期对象， date为构造函数， 需要使用new
    • Array数组对象， eg：var arr = new Array（length）；
      • 判断是否为数组， eg：arr instanceof Array； ture为是，反之
      • Array.isArray
      • push()=在数组末尾添加一个或多个元素
      • unshift（）=向数组开头添加元素
      • pop（）=删除数组最后一个元素， 删除那个元素，就返回那个元素
      • shift（）=删除第一个元素， 返回的是删除的元素
      • arr.reverse()=翻转数组，返回一个新数组
      • arr.sort()=对数组进行排序
        • eg：var arr = [12,15,19,25,155]; arr.sort(function(a,b){ return a-b; });
      • arr.indexOf(数据)=返回对应的索引号
      • 转为字符串；arr.join(分隔符)
    • String字符串对象 eg：var str = new String('str')
      • 字符串的不可变，改变内容只是计算机在内存中新开辟了一个内存空间
      • str.indexOf()=返回索引地址
      • charAt（索引地址）=返回字符
      • charCodeAt(index)=返回ASCII码
      • concat（str1,str2）=拼接字符串
      • substr（start，length）=从start开始，去length个数字符串
      • slice（strat,end)=从strat位置开始，截取end位置，但end不算
      • substring(start,end)=和slice功能一样，区别是不能接受负
      • replace（str1，str2）=把str1替换为str2
      • str2.split(分隔符)=将字符串变为数组
• 数据类型
  • 简单数据类型
    • Number
      • 前面加0表示8进制
      • 前面加0x表示16进制
      • Number.MAX_VALUE(MIN)显示最大值和最小值
      • isNaN()=判断是否 非数字，eg：isNaN(20)，，false
    • Boolean
      • 布尔值，ture，false
    • String
      • 建议为单引号‘ooos’
      • 转义符 \
      • length=判断字符串长度,eg:'sssa'.length
      • 字符串的拼接 +,数值相加，字符相连
    • Undefined
      • 未定义类型
    • Null
      • 空值
  • 复杂数据类型
  • typeof=检测变量类型
  • 数据类型的转换
    • 转为字符串
      • toString()=转换字符串
      • Sting()=强制转换
    • 转换为数字
      • parseInt()=转换为整数
      • parseFloat()=转换为浮点数
      • Number()=强制转换
    • 转换为布尔类型
      • Boolean()=强制转换