数据类型
String //字符串
Number //数字
Null //空
Undefined //未定义
Boolean //布尔
Array //数组
当获取的是class时,获取到的是复数,并且存在多个class,所以需要给class后加上位置索引值
document.getElementsByClassName("demo")[0].innerHTML
数组
1 var arry = [] //创建新的数组
2 var arry = new Array()//创建新的数组
.push(); //按顺序给数组添加内容,加在后面
.unshift(); //加在第一位
.pop(); //得到数组最后一个值,并从数组中删除
.shift(); //得到数组第一个,并从数组中删除
.splice();//删除指定位置的值,按照索引值顺序 array.splice(index,howmany,item1,.....,itemX)
.sort(); //将数组内的简单数字默认按从小到大排列,字符串也可以
.sort (function (ele1, ele2) {
if (ele1 > ele2) return 1;
-1 0 1 返回-1在前,0不变,1在后
else if (ele1 < ele2) return -1;
else return 0;
});
.join(); //根据指定的字符串连接
循环
1.break //语句可用于跳出循环。
2.break //所在的循环体已经结束。
1.continue //语句中断循环中的迭代,如果出现了指定的条件,然后继续循环中的下一个迭代。
2.continue //所在的循环体并没有结束。
获取函数类型
Object.prototype.toString.apply(); //可以使用Object.prototype.toString.apply(obj)来判断数据类型,返回字符串规则为"[object .......]";
typeof(); //用于判断基本的,但是typeof不能判断出数组和null,而且对于通过new操作符生成的对象,也无法判断类型。
符号
= //(得到或者赋值)
== //(相等),用来检测两个操作数是否相等,这里的相等定义的非常宽松,可以允许进行类型转换,转化成同一类型后的值”看“值”是否相等
=== //(严格相等)用来检测两个操作数是否严格相等,如果类型不同,其结果就是不等
|| //(逻辑或)
&& //(逻辑与)
! //取反 x = 2 y = 6 !(x = y) === true
!= //不等于,在表达式两边的数据类型不一致时,会隐式转换为相同数据类型,然后对值进行比较.
!== //不会进行类型转换,在比较时除了对值进行比较以外,还比较两边的数据类型, 它是恒等运算符===的非形式.
转换
string -0变成数字
number + " "变成字符串
查看属性
querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。仅仅返回匹配指定选择器的第一个元素
querySelectorAll() 返回所有的元素
parseInt()取整数
configurable //能否使用delete、能否需改属性特性、或能否修改访问器属性、,false为不可重新定义,默认值为true
writable //对象属性是否可修改,flase为不可修改,默认值为true
enumerable //对象属性是否可通过for-in循环,flase为不可循环,默认值为true
value //对象属性的默认值,默认值为undefined
数组
// var arr = [1, 2, 3, true]; // 一维数组
// var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]; // 二维数组
// arr[4] = 4; // 数组的动态添加,之前学了push方法
// arr[arr.length] 等价于 arr.push
// var arr = [1,,,2,,] // 最后一个逗号后如果没有值,会被忽略
// arr.length -= 1; // 表示删除最后一个元素
// arr.length = 0; // 表示清空数组
// delete arr[2]; // 这个并不是彻底删除元素,只是简单的把该位置的值变为undefined
// arr.forEach // 用来遍历数组的元素,接受一个函数对象的参数,arr有多少个元素,函数就执行多少次
// 范例:
// arr.forEach(function (ele) {
// console.log(ele);
// });
// 补充说明:
// 1. 侵入式方法是指调用完该方法之后,源数组也被改变
// 2. 非侵入式方法是指调用完该方法之后,源数组不变
// arr.map // (侵入式) 用来映射数组里面的元素,并返回一个新的数组
// 范例:
// var newArr = arr.map(function (ele) {
// return ele + 100;
// });
// reverse // (非侵入式) 用来逆序
// slice // (非侵入式) 切片,接收两个参数,第一个是开始下标(包含该元素),第二个是结束下标(不包含该元素)
// filter // (非侵入式) 过滤
// 范例:
// 要求过滤掉数组里面的偶数
// var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// arr.filter(function (ele) {
// /*
// var result = (ele % 2 === 0);
// if (result) {
// return false;
// }
// else {
// return true;
// }
// */
// // 和上面被注释的代码是等价的
// return ele % 2 !== 0;
// });
// concat // 合并数组
// 范例:
// var arr1 = [1, 2, 3], arr2 = [4, 5, 6];
// var arr3 = arr1.concat(arr2); // [1, 2, 3, 4, 5, 6]
/*
every // 用来判断数组中的每一个元素是否都满足某个条件,类似于逻辑与(且)
范例:
// 判断所有学生是否都及格了。
var arr = [56, 60, 80, 90, 100];
arr.every(function (e) {
return e >= 60;
});
some // 用来判断数组中是否有某个元素满足条件,类似于逻辑或
范例:
// 判断是否有满分的学生
var arr = [56, 60, 80, 90, 100];
arr.some(function (e) {
return e === 100;
});
reduce // 用来将数组中的元素归纳为一个值
范例:
// 计算学生总分
var arr = [56, 60, 80, 90, 100];
arr.reduce(function (a, b) {
return a + b;
});
reduceRight // 同reduce唯一的区别就是从右往左拿,其他功能保持一致
Array.isArray // 判断某个对象是否为数组,true:是, false:否
范例:
var arr = [1, 2, 3, 4, 5];
Array.isArray(arr); // 返回true
var str = "abc";
Array.isArray(str); // 返回true
indexOf // 用来查找某个元素在该数组中的下标,从左往右,找到第一个为止,若找不到则返回-1
范例:
var arr = ["a", "b", "c", 3, "b", 2, 1, "b", 3, 5,"b", 6];
arr.indexOf("b"); // 返回1
arr.indexOf("b", 2); // 返回4
arr.indexOf("b", -7); // 返回7
lastIndexOf // 同indexOf唯一的区别就是从右往左找,其他功能保持一致
*/
{}.toString.apply() 相当于Object.prototype.toString.apply()
String常用方法:
1. indexOf(someStr[, startIndex]) // 获取从startIndex下标开始(包括)查找someStr第一次出现的下标,类似数组的indexOf
范例:
var str = "hello world";
str.indexOf("o"); // 返回4
str.indexOf("o", 5); // 返回7
// 补充说明:这里第二个参数是指从哪个下标开始查找
str.indexOf("wo"); // 返回6
str.indexOf("abc"); // 返回-1
2.charAt(index) // 获取下标为index的字符
范例:
var str = "hello world";
str.charAt(1); // 返回"e"
str.charAt(8); // 返回"r"
str.charAt(100); // 返回""
3. substring(startIndex[,endIndex]) // 截取从startIndex下标开始(包括)至endIndex下标结束(不包括)的字符串
范例:
var str = "hello world";
str.substring(1, 5); // 返回"ello"
str.substring(6); // 返回"world"
// 补充说明:若第二个参数省略,则截取至最后
4. substr(startIndex[, count]) // 截取从startIndex开始(包括)的count个字符串
范例:
var str = "hello world";
str.substr(6, 2); // 返回"wo"
str.substr(2); // 返回"llo world"
// 补充说明:若第二个参数省略,则截取至最后
5.split() 方法用于把一个字符串分割成字符串数组。
"2:3:4:5".split(":") //将返回["2", "3", "4", "5"] "|a|b|c".split("|") //将返回["", "a", "b", "c"]
addEventListener() 方法用于向指定元素添加事件句柄。
target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
【this】
都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域。
一般来说,this总是指向调用某个方法的对象,但是使用call()和apply()方法时,就会改变this的指向。
apply() 接收两个参数,一个是函数运行的作用域(this),另一个是参数数组。
call() 第一个参数和apply()方法的一样,但是传递给函数的参数必须列举出来
【classList】
属性返回元素的类名,作为 DOMTokenList 对象。该属性用于在元素中添加,移除及切换 CSS 类
实例
为 <div> 元素添加 class:
document.getElementById("myDIV").classList.add("mystyle");
add(class1, class2, ...) 在元素中添加一个或多个类名。如果指定的类名已存在,则不会添加
contains(class) 返回布尔值,判断指定的类名是否存在。
可能值:
true - 元素包已经包含了该类名
false - 元素中不存在该类名
item(index) 返回类名在元素中的索引值。索引值从 0 开始。如果索引值在区间范围外则返回 null
remove(class1, class2, ...) 移除元素中一个或多个类名。
内存模型:
栈:用来存放变量
堆:用来存放实例对象
常量池:用来存放常量,如:“abc”“aaa” 1 2 3
代码区:用来存放代码
我们一般的函数对象都会有一个预设的prototype属性