Web前端-JavaScript基础

　　JavaScript基础概念:客户端脚本语言

　　基本概念

　　客户端:这里的客户端就是浏览器

　　脚本语言:不需要编译,直接就可以被浏览器解析执行

　　功能:

　　可以增强用户和html页面的交互过程,可以控制html元素,让页面有一些动态效果,提高用户体验

　　js的组成结构

　　ECMAScript:基础语法

　　BOM:浏览器对象模型

　　DOM:文档对象模型

　　4.js的引入方式:

　　-行内式

　　-内联式

　　定义

　　-注意:

　　一旦引入了一个script,在标签内不可以再写任何js代码,否则内部代码不生效

　　script标签可以定义在任意位置

　　script标签可以定义多个

　　html的加载顺序:从上到下,从里到外

　　ECMAScript

　　基本语法

　　注释

　　单行注释://

　　多行注释:/**/

　　数据类型

　　1).原始数据类型(基本类型)

　　-number:数字 //整数/小数/NaN(not a number)

　　-string:字符串 //字符/字符串

　　-boolean:布尔 //true/false

　　-null:一个对象为空的占位符

　　-undefined:未定义 //如果一个对象没有给初始化值,则被默认赋值为undefined

　　2).引用数据类型(对象)

　　变量

　　1).JavaScript是弱类型语言

　　强类型:在开辟变量存储空间时,定义了空间将来存储的数据的数据类型,只能存储固定类型的数据

　　弱类型:在申请变量内存空间时,不定义空间将来的存储类型,可以存放任意类型的数据

　　2).语法

　　var 变量名 = 初始化值;

　　在创建时可以不定义初始化值.

　　运算符

　　1).一元运算符: //自增(++)/自减(--)/正号(+)/负号(-)

　　正负号: 会引起数据类型转换(如果+/-后面跟的不是number类型)

　　2).算数运算符: //和java一样 加减乘除

　　3).赋值运算符 //和java一样 =

　　4).比较运算符 //和java一样 ===(全等) !==(不全等)

　　类型不同进行比较:先进行类型转换

　　字符串比较-->按照字典逐位比较,直到得出结果

　　===:在比较之前先判断类型,如果类型不一样则直接返回false

　　!==:只有值和类型全相等时候为false;

　　5).逻辑运算符 //和java一样 与或非

　　6).三元运算符 //和java一样 条件? 值1:值2

　　!!!注意:在js中如果运算数不是运算符所要求的类型,那么js的引擎会自动将运算数进行类型转换

　　*string-->number:按照字面量转化,如果字面量不是数字,则转为NaN;

　　*boolean-->number:true转为1,false转为0;

　　*null/undefined-->number:NaN

　　*number-->boolean:0为假,非0为真

　　*string-->boolean:""为假,其他为真

　　*null/undefined-->boolean:都为假

　　*对象-->boolean:所有对象都为真

　　if(obj) 对象不为空,字符串长度>0

　　流程控制语句

　　1).if...else... //和java一样

　　2).switch

　　在java中,switch语句可以接受的数据类型:byte short int char,枚举(1.5) String(1.7)

　　在js中,switch语句可以接受任意类型的数据

　　3).while

　　4).do...while

　　5).for

　　JS特殊语法(不建议使用)

　　1).语句以分号结尾,如果一行只有一条语句,则;可以省略

　　2).变量的定义使用var关键字,也可以不使用

　　-使用var定义的变量是局部变量

　　-不使用var定义的变量时全局变量

　　注:什么是变量???

　　一小块存储数据的内存空间

　　基本对象

　　Function:函数对象

　　Funciton对象的创建

　　1).创建:以方法2/3为主,方法1了解即可

　　-方式1:var fun = new Function(形参列表,方法体) 了解即可

　　-方式2:function 方法名(形参列表){函数体}

　　-方式3:var 方法名 = function(参数列表){函数体}

　　2).属性

　　-length:代表形参的个数

　　3).特点****

　　-在创建函数对象时,参数类型不用写,返回值类型

　　-函数是一个对象,如果定义名称相同的函数则会覆盖之前定义的函数

　　-在JS中函数的调用只与方法名称有关,与参数列表无关

　　例:定义了 function fun(a,b,c){函数体}

　　调用时可以使用 fun();/fun(1);/fun(1,2);/fun(1,2,3)/fun(1,2,3,4)

　　-在JS中存在内置参数arguments,它是一个数组

　　例:求任意个数的和

　　function add(){

　　var sum=0;

　　for(vari=0;i

　　return sum;

　　}

　　Function对象的调用

　　var result = 函数名(参数...);

　　var s = 函数名; 将函数对象赋给s;

　　Array:数组对象

　　数组对象的创建

　　- var arr = new Array(元素列表)

　　var arr = new Array(1,2,3);

　　- var arr = new Array(默认长度)

　　var arr = new Array(5);

　　- var arr = [元素列表]

　　var arr = [1,2,3,4];

　　方法

　　- join(参数)***:将数组中的元素按照指定的分隔符(传入的参数)拼接为字符串

　　- push();向数组的尾部添加一个或更多个元素

　　属性

　　length

　　特点

　　在JS中数组的元素类型是可变的

　　在JS中数组的长度是可变的,访问某个角标,如果没有数据则返回undefined;

　　Date:日期对象

　　创建:

　　var Date = new Date();

　　方法:

　　toLocalString():返回当前date对象对应的时间本地字符串格式

　　getTime():返回1970年1月1日零点至今的毫秒值

　　Math:数学

　　创建: Math对象不用创建,可以直接使用

　　方法:(知道有哪些功能即可)

　　random():返回0~1之间的随机数,左开又闭

　　ceil()/floor()/round():向上/向下/四舍五入取整

　　属性:

　　PI

　　RegExp:正则表达式对象

　　正则表达式:定义字符串匹配规则

　　组成规则

　　1).单个字符:[]

　　如:[a][ab][a-zA-Z0-9];

　　2).特殊符号代表特殊含义的单个字符

　　\d:单个数字

　　\w:单个字符

　　3).量词符号

　　?: 出现0次或1次 例:\w?字符出现0或1次

　　*: 表示出现0次或多次

　　+: 出现1次或多次

　　{m,n}:表示数量>=m,<=n

　　创建:(常用第二种方式)

　　- 方式1:var reg = new RegExp("正则表达式"); 在这里\需要用\\转义

　　- 方式2:var reg = /正则表达式/; 这里不需要转义

　　方法

　　test(校验对象):用来验证指定的字符串是否符合正则定义的规范

　　常用写法/正则表达式/.test("字符串");

　　常用的正则表达式:

　　https://www.cnblogs.com/fozero/p/7868687.html

　　Global:全局对象

　　特点:是一个全局对象,其中封装的方法不需要对象就可以直接调用.

　　方法

　　- encodeURI():URL编码

　　- decodeURI():URL解码

　　- encodeURIComponent():URL编码,编码的字符更多,对特殊符号也进行编码

　　- decodeURIComponent():URL解码,解码的字符更多,对特殊符号也进行编码

　　- parsInt(str):注意判断每一个字符是否为数字,直到不是数字为止并将前面的数字转为number

　　- isNaN():判断一个变量是否为NaN;

　　注意:NaN参与的比较全部为false,所以不能用==判断

　　- eval():将JavaScript的字符串转成脚本来执行

　　例:var jscode = "alert(123)";

　　eval(jscode);会解析片段,并弹出123.

　　- 注:

　　URL编码:

　　HTTP协议不支持中文,需要浏览器进行编码和解码

　　将1个字节的前4个bit转换为16进制后4个bit转换成16进制,得到一个二位数,用%隔开

　　如在UTF-8下, "传智播客"= %E4%BC%A0%E6%99%BA%E6%92%AD%E5%AE%A2

作者：黑马程序员JavaEE培训学院
首发：http://java.itheima.com/