创建对象
ECMA变量
- 用‘var’关键字来定义变量,并可以将其初始化为任意值
- 变量中存储的值可以改变
关键字及保留字
关键字
保留字
ECMAJscript运算符
- 运算符是指完成操作的一系列符号,也称为操作符
- 运算符用于江一个或多个指进行运算并返回结果。
- 使用运算符的值称为操作数
- 运算符和操作数的组合称为表达式
运算符的类型
1 算术运算符
分别是 : + - * / % ++ –
2 比较(关系)运算符
分别是 : > < <= >= == === !=
!==
比较运算符的返回结果一定是布尔值(true,false)
3 逻辑运算符
分别是 && || !
逻辑运算符的结果一定为 Boolean值
在逻辑运算符中,逻辑非( !)占着一定的比例,在一定程度上会减少代码的开发量
逻辑非
在表达式 中 逻辑非 表示 true的值分别为
!’ '非字符串—注意和空格符的区别,由于空格符有着占位,所以算成是非空字符串, !0 !null !NaN !undefined;
猜想:由上述的五个特殊的返回值 true,是否可以这样认为
只要表示没有任何东西或者是除对象外不占用任何的位置,返回都是true,
或者是 只要是上述的五个特例,返回都是true
console.log(!{}); //false
console.log(!' ') //false
console.log('任意非字符'); //false
console.log(!'') //true
console.log(!1) //false
console.log(!0) //true
console.log(!null); //true
console.log(!NaN); //true
console.log(!undefined) //true
逻辑与&&
[外链图片转存失败(img-XBYhXmAW-1566134937139)(C:\Users\Don\AppData\Roaming\Typora\typora-user-images\1565969237850.png)]
4 赋值运算符
= += -= *= /= %=
5 连接运算符
- 只要 “ + ” 任意一边的操作数为字符串型数据,则不再执行加法运算
- 连接后的结果为字符串型数据
console.log(12 + '12'); //1212
console.log(12 - '12') //0
特别注意
只有 + 才能进行默认的字符拼接,同时,默认删除数字之间的Number类型 转换
算术运算符中 * - / % 都会默认发生 Number隐式转换。
运算符优先级
小括号 > 算术运算符 > 比较运算符 > 逻辑运算符 > 赋值运算符
创建对象的方法
通过构造函数 Object() 创建普通对象
new 作用: 实例化对象
new 构造函数() ----> 实例化对象
构造函数 可以是js 自带的,可以是我们自定义的
var student = new Object();
var liuMing = "刘明",
var liuJuan = "刘娟",
对象增与取
通过构造函数 Object() 创建普通对象
new 作用: 实例化对象
new 构造函数() ----> 实例化对象
构造函数 可以是js 自带的,可以是我们自定义的
对象取值,对象增加 key:value
1.对象增加key:value
如果是构造函数创建对象,可以通过传参形式增加 key:value
//方式一、传参添加 key:value
var person = new Object({
'a':'刘明',
'b':'刘明1',
'c':'刘明2',
});
// 方式二、打点添加 key:value
// 语法: object.key = value
person.d = "刘明3";
var liuMing4 = "刘明4";
person.e = liuMing4;
获取
取值方式一、打点取值,并使用变量接受取值结果
var one = person.a
console.log(person.d)
//取值方式二、
// 语法:object['属性'],有且仅有左右获取值的函数
// 获取到值如何处理 要么直接使用,要么直接输出
var d1 = person['d'];
console.log(d1,'wer');
var a = {
e:"sd",
b:{
}
}
总结: 最后一个 点 左边的一律是对象,右面为任意数据类型
布尔对象
var bool = new Boolean({
a :false,
//Boolean() 作用:将其他类型数据转化为布尔类型
// 创建(构造)布尔对象,
// 添加 了一个 bool属性,内置由空变为 有值有结构,所以为 true
});
//实例
var boolstr1 = new Boolean('aaa'); //true
var boolstr2 = new Boolean('true'); //true
var boolstr3 = new Boolean('false'); //true
var boolstr4 = new Boolean(true); //true
var boolstr5 = new Boolean(0); //false
var boolstr6 = new Boolean(NaN); //false
var boolstr7 = new Boolean(null); //false
var boolstr8 = new Boolean(23); //true
var boolstr9 = new Boolean([]); //true
var boolstr10 = new Boolean(' '); //true
var boolstr11 = new Boolean(''); //false
var boolstr12 = new Boolean(false);
总结:在Boolean() 中转换,如果为 空, null ‘’ 0 等代表没有的值的时候,输入结果为false,但是,[]空数组除外。
如果里面有实质的值,转化为true。但false 除外
字符串对象
字符串使用基类 String来构造对象。
var str = '香港是中国的一部分';
console.log(str); //香港是中国的一部分
var str2 = '转义\'字符\'';
console.log(str2) //转义'字符'
var str3 = "123.13.23";
console.log(Number(str3)) //NaN
console.log(Number('')) //0
console.log(parseInt(true)) //true
console.log(parseInt("")) //NaN
console.log(parseInt('')) //NaN
console.log(parseFloat('13.123香港')) //13.123
console.log(parseFloat('')) //NaN
console.log(Math.round('123.343香港') ) //NaN
console.log(Math.round(true) ) //1
console.log(Math.round(false) ) //0
console.log(Math.round("12321.943") ) //12322
console.log( Math.round("true") ) //NaN
console.log(Number("12321.香港") ) //NaN
console.log(Number("true") ) //NaN
字符串转换为Number() ,有值为NaN,无值 为 0;
数字对象
日期对象
使用 Date();
getTime() 1565766812786 timestamp 时间戳,具有唯一性, 时间戳就是当前时间的 总time毫秒数
一秒等于 1000 毫秒
在使用时间时,一定要注意时间的api,
创建日期对象 new Date() ,可以简写为 new Date().getTime();
星期中的某一天,使用本地时间。返回值是 0(周日) 到 6(周六) 之间的一个整数。
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var day = date.getDate();
var hours = date.getHours();
var m = date.getMinutes();
var s = date.getSeconds();
var ms = date.getMilliseconds();
var timeX = date.getTime();
var a = new Date().getTime();
console.log(date)
1. 创建一个日期对象,Date();
星期一 Monday Tuesday Wednesday Thursday Friday Saturday Sunday
古巴比伦人创立的星期制,首先传到古希腊、古罗马等地。古罗马人用他们自己信仰的神的名字来命名1周7天:Sun’s-day(太阳神日),Moon’s-day(月亮神日),Mars’s-day(火星神日),Mercury’s-day(水星神日),Jupiter’s-day(木星神日),Venus’-day(金星神日),Saturn’s-day(土星神日)。
这7个名称传到英国后,盎格鲁-撒克逊人又用他们自己的信仰的神的名字改造了其中4个名称,以Tuesday 、Wednesday、Thursday、Friday 分别取代Mars’s-day 、Mercury’s-day 、Jupiter’s-day 、Venus’-day。 Tuesday来源于Tiu,是盎格鲁-撒克逊人的战神;Wednesday来源于Woden,是最高的神,也称主神;Thursday来源于Thor,是雷神;Friday来源于Frigg,是爱情女神。这样就形成了今天英语中的1周7天的名称。
数组对象
-
数组特点
-
有序 有索引值(index),索引值可以是从【0】 开始到【length -1】结束
-
数组中数据:可以为任意数据类型,数据可重复
-
未来数据结构,数组中都是i对象,对象中有数组
-
-
数组中取值
- 数组名字【索引值】
- 取最有一个数据 array[array.length -1]
-
数组长度
- 表示数组中数据的总个数
- 获取 var len = array.length
-
创建数组
方式一、构造函数方式--- Array 数组的构造函数 作用 ,创建数组
数组,参数未数组中的数据
数组特点
1. 有序,从 0 开始 ,
2. 0~n 是数组的[索引值]
注意: 索引值具有唯一性,有序性
3. 数组中数据,可以为任意数据类型
4. 数组中数据可重复
注意:以后遇见的数据结构,数组中全是对象,对象中有数组
var arr = new Array(1,'Hello',true,{name:'黄顺飞'},'');
console.log(arr)
/**
创建数组方式二
*/
var arr1 = [1,2,3,4,5,{name:'黄顺飞'},[1,2,3[245,465,7632,432,657,6,53,42],4,5]];
console.log(arr1)
/*
数组中取值,语法 array[index] array-数组名 index 索引值
获取数组的最后一个元素 length - 1
*/
var arr2 = arr1[arr1.length - 1];
console.log(arr2)
/*
更改数组元素的内容
*/
arr1[2] = {mes:'我爱中国'};
console.log(arr1[2])
- 创建数组二
数组内部的API
slice
返回数组中一部分并组成新的数组,不会影响原来数组对象。
参一: 从第几个索引值开始 截取
参二: 从第几个索引值结束,不包括这个索引值
截取数据区间: start <= x < end
var arr = [1,2,3,'刘明','刘明2',4];
var res = arr.slice(3,5);
console.log(res); //(2) ["刘明", "刘明2"]
console.log(arr); //(6) [1, 2, 3, "刘明", "刘明2", 4]
点名器
求随机索引值
var arr = ['刘明','王','刘一','woqu','雪峰'];
/*
求随机索引值
*/
var i = Math.round(Math.random()*4);
// 需求:在页面中输出被点到
// document.write(arr[i]);
document.write("<h1>" + "点名点到"+ arr[i] + "</h1>");
split
split() 将字符串切割成数组,并返回一个新的数组
数组转成字符串
var className = 'icon,icon2';
var arr = className.split(',');
console.log(className); // icon,icon2
console.log(arr); // (2) ["icon", "icon2"]
/*
数组内容添加
*/
arr[2] = 'icon3';
arr[3] = 'icon4';
arr[4] = 'icon5';
console.log(arr); //(5) ["icon", "icon2", "icon3", "icon4", "icon5"]
var str = arr.toString();
console.log(str) //icon,icon2,icon3,icon4,icon5
var str1 = arr.join(' ');
/*
空格分开每个数据,转化为字符串
*/
console.log(str1) //icon icon2 icon3 icon4 icon5
document.write(' <div class=" '+ str1+' "> '+ '我是数组类加成'+' </div>');
类的添加,涉及到 数组添加 小节,其中,有 数组拼接 join, 数组转化为字符串 toString 。
数组删除
数组元素内容删除
delete删除数组里面的内容,相当于重置内容,但是数组长度不变,相当于该为止数据处于为负值状态
var arr = [1,2,3,4,5,6];
var arr1 = delete arr[2];
console.log(arr1) //true
console.log(arr); //(6) [1, 2, empty, 4, 5, 6]
console.log(arr.constructor); //ƒ Array() { [native code] }
pop
删除数组的最后一个元素,会对原数组 进行 删除修改。
语法: arr.pop()
解释: arr 表示要删除元素 的 目标数组,
没有参数,参数无效,一次只能删除一个数组元素,且是排在最后的元素
有默认返回值,返回的是 删除的元素
var arr = [1,2,3,4,5,6,7,'走了'];
var arr1 = arr.pop(2);
console.log(arr1); //走了
console.log(arr); //(7) [1, 2, 3, 4, 5, 6, 7]
console.log(arr.pop()); //7
console.log(arr); //(6) [1, 2, 3, 4, 5, 6]
shift
删除 目标数组 的第一个 元素,改变原数组的内容。
语法:arr.shift();
arr 表示的是修改的目标数组,
没有参数,且参数无效,
有默认返回值,返回的是删除目标数组中的原第一个元素。
var arr = ['我在前面位置',1,2,3,4,5,6,7];
var arr1 = arr.shift(2);
console.log(arr1); //我在前面位置
console.log(arr); //(7) [1, 2, 3, 4, 5, 6, 7]
console.log(arr.shift()); // 1
console.log(arr); //(6) [2, 3, 4, 5, 6, 7]
splice
对数组进行删除,会改变原来数组的内容
语法:arr.splice(参数1,参数2);
// 语法:arr.splice(参数1,参数2, 参数3,。。。); 这里不考虑参数3及多余的参数,如果有就变成替换了,不符主题
解释:arr 是 删除操作的目标数组,
参数1 表示 arr数组 的 元素索引值,【索引值】
参数2 表示 截取元素的个数
有返回值,默认返回的是 截取的数组
var arr = ['我在前面位置',1,2,3,4,5,6,7];
var arr1 = arr.splice(1,2);
console.log(arr1); //(2) [1, 2]
console.log(arr); //(6) ["我在前面位置", 3, 4, 5, 6, 7]
console.log(arr.splice(1,2)); //(2) [3, 4]
console.log(arr); //(4) ["我在前面位置", 5, 6, 7]
数组添加
在实际运用中,可以通过数组添加 来完成 添加选择器 构建 样式层叠。参考 split小节
push
在数组的最后位置添加元素,会对原数组进行修改。
***语法:***arr.push(参数1,参数2,。。。)
解释:push 是数组的API
其中 arr 表示 目标参数 添加到 这个 arr数组中,
参数1,参数2,。。。 表示需要添加的目标元素,可以为任意的类型值。
有返回默认值,值是修改后的数组长度
var arr = [1,2,3,4,5,6,7];
var arr1 = arr.push('我是第一个push','我是第二个push');
console.log(arr1); //9
console.log(arr.push('我是第三个push')) // 10
console.log(arr); //(10) [1, 2, 3, 4, 5, 6, 7, "我是第一个push", "我是第二个push", "我是第三个push"]
unshift
在数组的最前一个元素的前面,添加 n 个元素,会对原数组进行修改。
特点
添加元素到 数组 的第一个元素之前,占据第一个元素的位置,原来的元素位置依次向后移一位。
语法: arr.unshift(参数1,参数2,。。。);
解释:unshift 是数组的API,
其中 arr 表示 目标参数 添加到 arr 数组中;
参数n 表示需要添加的元素,如果 需要添加的参数数量大于1,则依次有序的排列添加到上一个添加数组元素之后,
参数可以为任意值,
有默认的返回值,返回值是添加后的数组的长度
var arr = [1,2,3,4,5,6,7];
var arr1 = arr.unshift('我是第一个','我是第二个',{},[''],null,undefined,);
console.log(arr1) //8
console.log(arr) //(8) ["我是第一个", 1, 2, 3, 4, 5, 6, 7]
concat
合并一个或多个 数组,并【返回】一个新数组。
特点:
concat 数组之间 进行拼接 ,不会影响数组参数的值,同时 在完成方法后 返回一个新的数组,
语法:数组1.concat(拼接的数组参数2,拼接的数组参数2.。。)
解释:这个 API 将 数组1 与 拼接的数组参数2、拼接的数组参数3.。。 等进行拼接,不会改变原来任何数组,并返回一个 拼接后的数组。
原理是默认复制 数组1,然后进行数组拼接,最后将这个新的数组返回。
var arr = [1,2,3,4,5,6,7];
var arr1 = ['我是arr1',2,33,44,55,77];
var arr2 = ['arr2',3,4,5,1];
var arr3 = arr1.concat(arr,arr2);
console.log(arr3) //(18) ["我是arr1", 2, 33, 44, 55, 77, 1, 2, 3, 4, 5, 6, 7, "arr2", 3, 4, 5, 1]
console.log(arr1.concat(arr,arr2)) //(18) ["我是arr1", 2, 33, 44, 55, 77, 1, 2, 3, 4, 5, 6, 7, "arr2", 3, 4, 5, 1]
console.log(arr1) //(6) ["我是arr1", 2, 33, 44, 55, 77]
数组修改
splice
对数组进行删除,会改变原来数组的内容
语法:arr.splice(参数1,参数2, 参数3,。。。); 这里不考虑只有两个的参数,如果有就变成替换了,不符主题
解释:arr 是 删除操作的目标数组,
参数1 表示 arr数组 的 元素索引值,【索引值】
参数2 表示 截取元素的个数
参数3以及后面的参数 表示 在该位置上替换的元素,
有返回值,默认返回的是 截取的数组
var arr = ['我在前面位置',1,2,3,4,5,6,7];
var arr1 = arr.splice(1,2,'我是替换splice',{},'我是替换2');
console.log(arr1); //(2) [1, 2]
console.log(arr); //(9) ["我在前面位置", "我是替换splice", {…}, "我是替换2", 3, 4, 5, 6, 7]
console.log(arr.splice(1,2)); //(2) ["我是替换splice", {…}]
console.log(arr); //(7) ["我在前面位置", "我是替换2", 3, 4, 5, 6, 7]
总结:
splice() 作用: 删除 添加 替换
参数可以有多,但注意参数表示:
参一:表示从该数组的第【index】索引值开始【查找】
参二: 表示从 【index】的位置开始 删除 参数个 元素
参三及以后的参数: 表示占用该 【index】的索引 添加的元素,可以有多个数
数组排序
sort
sort() 排序步骤
ASCII 码排序
1. 将每个元素转成 字符串类型,
2. 检索第一个字符,然后将该字符转化伪ASCII 码 值
3. 用转化后的 ASCII 码值,进行大小排序,通过 ASCII 码 进行升序排列
注意:函数有返回值,返回的是 修改排列顺序后的数组,会改变原来的数组排序,
有必要的化可以背一些常用的 ASCII 码 和 Unicode 码
var arr = [1,3,6,2,7,44,11];
arr.sort();
console.log(arr.sort()) //(7) [1, 11, 2, 3, 44, 6, 7]
console.log(arr) // [1, 11, 2, 3, 44, 6, 7]
// 注意: 1 11 111 2 23 2444 5 51 6 的排列顺序
reverse
颠倒数组中的元素排序,从以前的顺序 改为 倒序
注意:函数有返回值,返回 的是操作后的数组,会影响原来的数组顺序。
var arr = [1,3,6,2,7,44,11];
arr.reverse();
console.log(arr.reverse()) // [1, 3, 6, 2, 7, 44, 11]
console.log(arr) //[1, 3, 6, 2, 7, 44, 11]
数组和字符串之间的相互转换
数组转换为字符串
toString
*toString 将数组中所有字段转换为字符串,返回一个新的字符串,*不会改变原数组的内容。
var arr = [1,2,3,4,5];
var str1 = arr.toString(); //1,2,3,4,5 字符串
console.log(arr1) //(5) [1, 2, 3, 4, 5]
join
join: 将数组里面的内容拼接为字符串,不会改变原数组的原有内容,返回一个新的字符串
如果内容为空,和 toString 效果一样
如果内容为空格字符串,表示将数组中所有的字段拼接成一个新字符串。
参数:作用代替逗号的字符,默认逗号
console.log(str1);
var str2 = arr.join();
console.log(str2);
var str3 = arr.join("");
console.log(str3) //12345
var str4 = arr.join(" ");
console.log(str4) //12345