JS基础–万物皆对象

一、JS相关知识介绍
　　1.JS主要用途：轮播图、Tab栏（选项卡）、地图、表单验证
　　2.三层结构：W3C规范
　　（1）结构层 HTML 从语义化的角度，描述页面结构
　　（2）样式层 CSS 从审美的角度，美化页面
　　（3）行为层 Javascript 从交互的角度，提升用户体验
　　3.JS的发展历史
　　布兰登.艾奇1995年在网景公司发明了Javascript，起初叫livescript，由于Java当时非常火，就改名为Javascript。同时期还有其他的网页语言，如：VBscript、JScript等后来都被Javascript所取代，因此现在的浏览器中只运行一种脚本语言–Javascript。

二、JS基础
　1.js代码书写
　　（1）javascript中的注释
　　　　a.//:注释一行代码
　　　　b./* */：注释多行代码
　　(2)JS代码虽然对空格、换行、缩进不敏感，但是代码结束部分如果没有换行就必须加上分号
　　　　–建议：书写代码时既要换行又要加分号，有助于书写规范，可读性强
　2.js常用语句
　　（1）弹框：页面上出现弹出框后，页面的位置不能改变，并且不能关闭。（此时浏览器的进程已经被暂停）
　　　　–在任务栏右击选择任务管理器，结束进程
　　（2）调试：console.log(“”);用来进行代码的调试
　　　　–在控制台里可以看到百度的招聘信息
　　　　–在页面上右键单击–>审查元素–>点击小红叉–>控制台–>点击链接–>到Sources里查看错误代码
　　（3）接收信息：prompt(“”);
　　　　–弹出一个输入框，给用户提供输入信息的位置
　3.变量：用来存储数据的一块内存，内存是电脑的一个存储位置（断电以后会清空）
　　　　–直接量：直接拿来使用的量
　　（1）变量命名规则
　　　　a.只能由数字、英文字母、下划线以及$符号组成，并且数字不能放在名称开头（如果是_123也可以，但是id、class的命名里不能这样）
　　　　b.变量的命名不能使用javascript中的关键字和保留字
　　　　　　–关键字：已经被javascript内部使用过的
　　　　　　–保留字：还未被javascript内部使用，备用
　　　　c.区分大小写
　　（2）变量类型:变量中存储的什么数据类型，变量就是什么类型
　　　　a.字符串–string
　　　　　　–常用的转译符：
　　　　　　\’:单引号 \”:双引号
　　　　　　\n:换行 \t:缩进
　　　　　　\b:空格 \r:回车 \\:斜杠
　　　　b.数值类型–number
　　　　　　+的作用：有字符串参与表示连接，全是数值类型表示运算符
　　　　　　typeof();判断数据类型
　　　　　　–NaN是number的一种，用于表示数值的一种不正常的状态，not a number即非数字
　　　　　　（判断当前的数据是否是NaN的关键字：isNaN）
　　　　c.boolean类型：取值 true、false
　　　　　　作用：用于判断条件的结果
　　　　d.undefined：声明了变量但没有赋值，在页面上不会报错
　　　　c.Null:空的对象
　　（3）Math对象
　　　　a.Math.pow(a,b)得到a的b次方
　　　　b.Math.round()四舍五入
　　　　c.Math.ceil()向上取整
　　　　d.Math.floor()向下取整
　　　　e.Math.random()生成一个>=0&<1的伪随机数
　　　　f.Math.max(x,y,z)返回最大值 Math.min(x,y,z)返回最小值
　　　　　　–方法：在调用时后面有括号
　　（4）运算
　　　　a.自增自减
　　　　　　–i++;(后置++，先运算再自+)，++i;（前置++，先自+再运算）
　　　　b.逻辑运算符：用来连接两个判断条件
　　　　　　–&&与 ||或 ！非
　　　　　　[注]逻辑运算符的优先级：!>&&>||
　　　　c.比较运算符
　　　　　　–==判断的仅仅是数据的内容，没有判断数据的类型
　　　　　　（注:boolean在内存中会将true转化成1，将false转化成0）
　　　　　　–===（判断是否全等）既会关心内容也会关心类型
　　　　　　（注：有一个比较特殊的数字NaN，它特殊到自己都不等于自己，包括== ===）
　　　　　　–!=不等于（比较的是内容，不关心类型）
　　　　　　–!==不全等（判断全等）
　　　　d.赋值运算符=
　　　　　　作用：将等号右边的结果赋值给等号左边（顺序是从右向左）
　4.数据类型的转换
　　通过prompt(“”)输入数据的类型：不管在输入框中输入什么样的内容，浏览器都会把它当作string
　　【强制转换】
　　（1）转Number：
　　　*Number(“要转的内容”)
　　　　a.如果转换的内容可以转成数字，就直接返回这个内容对应的数字；
　　　　b.如果不可以转换那么返回NaN；
　　　　c.如果内容中出现小数，保留小数；
　　　　d.如果内容为空，转换成0
　　　*parseInt将内容转成Number
　　　　a.如果转换的内容可以转成数字，就直接返回这个内容对应的数字；
　　　　b.如果不可以转换那么返回NaN；
　　　　c.如果带有小数，会去掉小数，而不是四舍五入；
　　　　d.如果第一个字母是数字，则继续解析直至字符串解析完毕或者遇到一个非数字符号为止；
　　　*parseFloat():转数字；
　　　　与parseInt一样，唯一区别是可以保留小数；
　　（2）转string
　　　　a.直接调用这个变量的.toString方法可以将内容转成字符串。（包装类）
　　　　b.直接将要转的内容放在String后的括号中，就可以将内容转成字符串。
　　　　第一个方法是直接调用这个变量对象中的方法，第二个就是直接使用强制转换的方法。
　　（3）boolean转换
　　　　Boolean();
　　　　–注意：除了false、0、””、NaN、Undefined在转换的时候转成false以外，其它的都会转成true（包括”false”）
　　【隐式转换】
　　不通过程序员去写固定的代码转，浏览器可以直接进行转换
　　（1）隐式转换成Number
　　　　直接在要转换的内容前加上“+”；
　　　　–var a=”123″;===>a==+a;
　　　　–var a=”123″;===>var b=a*2;===>246
　　　　（可以使用+、-、*、/、%都可以将字符串转成Number）
　　（2）隐式转成字符串
　　　　–var a=123;===>a=a+””;
　　（3）隐式转换成Boolean
　　　　–var a=123;===>a=!!a;
　5.流程控制
　　（1）if_else结构
　　　判断条件，执行相应的代码块
　　【注意】
　　　　a.else if后面必须要带条件，else if中的else if可以无数个，else可以不写
　　　　b.从上到下判断条件，只要找到满足条件的判断，就会执行对应得代码，其它代码不执行
　　　　c.所有条件都不满足则执行else中的代码
　　　　d.else if在存放结构的时候最好小范围的条件放在最前面
　　　　e.110>pj>100,连写110>pj&&pj>100
　　（2）代码调试
　　　　a.打开开发人员工具
　　　　b.找到sources，并且找到要调试的代码，点击打开
　　　　c.打断点(点击行号)–>刷新页面(程序命中这个断点,高亮)–>鼠标悬停查看存储的值–>点击继续，监听程序
执行过程。
　　（3）switch case
　　作用与if_else if_else一样，用于判断多个条件中的哪一个条件是否满足要求
　　【注意】
　　　　a.case的变量值后面加的冒号
　　　　b.default可写可不写，如果不写都不满足条件代码直接结束
　　（4）三元运算符（三目运算符）
　　　　结构：boolean表达式？操作一：操作二；
　　　　判断条件是否成立，成立执行操作一，不成立执行操作二
　　（5）循环语句
　　　　a.while(条件语句/boolean){
　　　　　　重复执行的代码块；
　　　　}
　　　　b.执行：
　　　　　　程序运行到while时判断括号内容，true执行代码false不执行代码，跳过继续执代码行下面
　　　　c.注意：
　　　　　　一定要有循环结束的条件，否则会是一个死循环
　　　　d.终止循环：
　　　　　　break；
　　　　e.结束本次循环：
　　　　　　continue；
　　（6）do while先执行一次代码，条件满足继续执行，不满足则结束循环
　　（7）*for循环
　　　使用最多，先声明变量并赋值，然后进行判断，条件成立则执行循环体并自增，不成立则跳出循环
　6.数据类型分类
　　（1）string、number、boolean、undefined、null、object、Array、Function
　　（2）总结：在js中数据类型分为两大类
　　简单数据类型（基础数据类型）：string、number、boolean、undefined
　　复杂数据类型：null、object、Array、Function
　　【注】
　　　　堆和栈都是电脑内存，一般情况下简单数据类型是存储在栈里面的；复杂数据类型是存储在堆里面的（在栈中会存储堆对应的内在地址）
　　　　简单数据类型–>值类型
　　　　复杂数据类型–>引用类型
　7.object对象
　　（1）对象的创建：var a=new Object();
　　（2）对象属性的添加：a.xingming=”zhansan”;//给了对象一个名称
　　　　a.chengji=99;//给了对象一个成绩
　　（3）对象属性的取值：alert(a.chengji);
　8.数组（字符串也可以看成是一个数组）
　　（1）创建数组：var a=new Array();
　　（2）给数组赋值：a[0]=”91″;
　　（3）数组的取值：alert(a[2]);
　　（4）数组遍历：
　　　　for(var i=0;i<a.length;i++){
　　　　　　console.log(a[i]);
　　　　}
　　【注】
　　　　a.js中的数组定义好了之后就是一个无穷大的容器
　　　　b.元素可以任意添加：数量不限制，数据类型不限制（弱语言）
　　　　c.元素下标以0开始
　9.函数
　　（1）作用：用来封装一些经常要用到的代码
　　（2）结构：
　　　　function 函数名(){
　　　　　　//要封装的代码
　　　　}
　　（3）函数的定义
　　（4）函数的调用（使用）
　　函数名();
　　【注】函数定义好了之后就可以想到哪里调用就到哪里调用
　　（5）函数的参数—就是放在函数名后面括号中的内容
　　　　当创建函数的时候函数名后面的参数叫做形参（形式参数）
　　　　当调用函数的时候函数名后面的参数叫做实参（实际参数）
　　（6）函数的返回值—跟在return后面的数据
　　　一般情况下函数如果没有return，那么这个函数默认返回：undefined