JavaScript总结 BOM及DOM使用介绍

JavaScript

js代码引入

方式1: <script> // alert('澳门皇家赌场上线啦!!!') var a1 = 100; </script> 方式2: <script src='js文件路径'></script>

变量声明 var a = 10;

基础数据类型

数值类型 Number

整数,浮点数,NaN``` 字符串 var s1 = 'hello'; var s2 = 'world'; var ss = s1+s2 拼接字符串 **字符串的常用方法** ```javascript var s = 'hello'; var s2 = 'world'; s.length 长度 s.trim() 移除两端空白 s.trimLeft() s.trimRight() s.concat() 字符串拼接 s.concat(s2) s.indexOf() 通过元素找索引 s.indexOf('e') s.charAt(n) 通过索引找元素 s.charAt(1) -- 'e' s.slice() 切片 s.slice(1,3) s.split() 分隔 s.split('e',2) -- ['h','llo'] s.toLowerCase() 全部变小写 s.toUpperCase() 全部变大写

布尔值

var a = true; var b = false; 空的数据类型也是false,'',0,NaN,null,undefined..

null和undefined

null 空值,一般用来清空一个变量值来用 undefined var a; 声明了变量,还没有赋值,此时这个变量值为undefined 类型转化 parseInt('111') parseFloat('1.11')

复杂数据类型

数组

var a = [11,22,33]; var a = new Array([11,22,33]); typeof a; --- object类型

数组常用方法

a[1] -- 1是索引,索引取值 a.length -- 数组长度 a.push() 尾部追加 a.push('aa') a.pop() 尾部删除 a.unshift() 头部追加 a.unshift('aa') a.shift() 头部删除 a.sort() 排序 function sortNumber(a,b){ return a - b; } 升序 a.sort(sortNumber) a.slice() 切片 a.splice() 删除元素 a.splice(索引,删除几个,新值) a.splice(1,2,'aa','bb') a.reverse() 反转 -- 原数组上反转 a.join('+') 元素拼接 a.concat() var b = ['aa','bb'] a.concat(b) -- 类似python的extend

自定义对象 （我理解成字典）

var a = {'name':'chao',age:18} a.name\a['name'] 取值 for (var i in a){ console.log(i,a[i]) }

算数运算符

+ - * / % ++ – a ++ 和 ++a的区别,a++ 先执行后面的逻辑,在执行加一操作.++a相反 a-- --a都是减一操作

比较运算符

= < <= != !== == === （==意思是弱等于） 逻辑运算符 && || ! 与 或 非 赋值运算符 += -= *= /=

流程控制

if

var a = 10; if (a>5){ console.log(11) } else{ ... } 多条件判断 if (a>5){ console.log(11) } else if (a===5){ ... } else{ ... }

switch 切换

var a = 10; switch (a){ case 10: ... break; case 11: ... break; default: do something! } switch (a){ case 10: console.log('bbbb') case 10成立的话,执行case 10后面的内容,和case 10: case 11:两个条件共同要执行的那段代码,条件成立一个就行 case 11: console.log('aaaa') break; default: console.log('do something!') }

while

var a = 0; while (a<10){ console.log(a); a++; }

三元运算符

var a = 1; var b = 2; var c = a > b ? a : b;

for

for (var i=0;i<10;i++){ console.log(i); } var d = [11,22,33]; 循环遍历数组 方式1 for (var i in d){ // i是索引,python中的 for i in [11,22,33]:print(i) i都是元素 console.log(i,d[i]); } 方式2 for (var i=0;i<d.length;i++){ console.log(i,d[i]); } 循环遍历自定义对象 var a = {'name':'dazhuang',age:18} for (var i in a){ console.log(i,a[i]); }

函数

function f1(){ console.log('红旭!'); } function f1(a,b){ console.log('红旭!'); return '红旭妹妹!' } f1(1,2) 执行 匿名函数 var sum = function(a,..){ console.log('红旭妹妹想唱歌!') }; sum(1,...) 自执行函数 (function (a,..){...})(1,...)

闭包

function outer(){ var o = 10; function inner(){ console.log(o); } return inner; } var ret = outer(); ret()

面向对象

function Person(a,b){ this.a = a; this--python 的 self this.b = b; } Person.prototype.f1 = function (c,d){return c+d;} var p = new Person('aa','bb') p.a -- 'aa' p.f1(1,2) Date对象 var d = new Date(); 当前时间日期对象 d.toLocaleString(); -- 2019/7/4 上午9:32 var d = new Date('2019/7/2 12:00'); d.toLocaleString(); -- 2019/7/2 中午12:00 data 对象常用方法 d.getDate() -- 4 d.getDay() ---4 //getMonth () 获取月（0-11,0表示1月,依次类推） //getFullYear () 获取完整年份 //getHours () 获取小时 //getMinutes () 获取分钟 //getSeconds () 获取秒 //getMilliseconds () 获取毫秒 //getTime () 返回累计毫秒数(从1970/1/1午夜),时间戳 json对象 序列化 var d = {'xx':'xx'}; var dStr = JSON.stringify(d) -- '{"xx":"xx"}' 反序列化 var d = '{"xx":"xx"}'; var dd = JSON.parse(d) -- {"xx":"xx"} 正则 var s = 'hello'; var s2 = 'alex a'; var a = /^a/; var a = new RegExp("^a") a.test(s) -- false a.test(s2) -- true a.test() -- 不写参数,里面默认放一个"undefined"字符串 s2.match(/a/g) --['a','a'] s2.split(/a/g) 字符分隔 s2.replace(/a/gi,'sss'); s2.search(/a/) -- 找索引位置 math 内置模块 Math.abs(-1) -- 1 exp(x) 返回 e 的指数。 floor(x) 小数部分进行直接舍去。 log(x) 返回数的自然对数（底为e）。 max(x,y) 返回 x 和 y 中的最高值。 min(x,y) 返回 x 和 y 中的最低值。 pow(x,y) 返回 x 的 y 次幂。 random() 返回 0 ~ 1 之间的随机数。 round(x) 把数四舍五入为最接近的整数。 sin(x) 返回数的正弦。 sqrt(x) 返回数的平方根。 tan(x) 返回角的正切。