JS是基于对象的语言。当然此时都说是面向对象的语言。
类:模板,原型对象 对象:具体的实例
原型对象:
var user = {
name:"xiaoxiao",
age:5,
run:function(){
console.log(this.name + "running");
}
};
var xiaozhang = {name:"xiaozhang"};
xiaozhang.__proto__ = user;
xiaozhang.run();//xiaozhang running
xiaozhang.age;//5
var bird = {
fly:function(){ console.log(this.name + "fly");}
};
xiaozhang.__proto__ = bird;
xiaozhang.fly();//xiaozhang fly
原型链:始终指向object java里叫继承
class对象 ES6 引入的
//定义一个学生的类,属性,方法
class Student{
constructor(name){ this.name = name; }
hello(){ alert('hello'); }
}
var zhangsan= new Student("zhangsan");
var lisi = new Student("lisi");
zhangsan.hello();//hello
//继承
class smallStudent extends Student{
constructor (name,grade){
super(name);
this.grade = grade;
}
myGrade() { alert("一名小学生"); }
}
var xiaowang = new smallStudent("xiaowang",2);
console.log(xiaowang);//name:"xiaowang",grade:2
xiaowang.myGrade();//一名小学生
JS提供了大量的内置对象,这些内置对象,不需要你创建就可以直接使用。比如document。
内置对象:所谓内置对象就是在JS中已经创建好,可以直接使用;其他对象。
内部对象:
标准对象:
var x = 10;
var name = "tom";
var f = false;
var p = {};
console.log(typeof x);// number
console.log(typeof name);//string
console.log(typeof f);// boolean
console.log(typeof p);// object
typeof NaN//number typeof []//object
typeof Math.abs//function typeof undefined//undefined
案例:
<script>
// 下面都是包装类型。
var xx = new Number(10);
var username = new String("jerry");
var ff = new Boolean(true);
console.log(typeof xx);// object
console.log(typeof username);// object
console.log(typeof ff);// object
</script>
var x = 10与 var y = new Number(10);
var x = 10;
var y = new Number(10);
console.log(x == y);// true 比较数值
console.log(x === y);// false 比价数值和类型
String
String 全局对象是一个用于字符串或一个字符序列的构造函数。
String是一个数据类型,表示所有的字符串和字符。
我们可以通过new String();创建一个字符串对象。 当然很明显''和""会来的更简单一点。但是有啥区别?
看案例:
<script>
console.log(String); // 构造函数
// 使用引号创建
var name = "卡卡西"; // 字符串
// 使用new关键字创建
var name1 = new String("卡卡西"); // 对象
console.log(name == name1);// true
console.log(typeof name); // string
console.log(typeof name1);// object
</script>
String赋值的内存分析:
var name = "卡卡西";
var name1 = "卡卡西";
var name2 = new String("卡卡西");
name1和name2指向同一块内存,如果修改name1,name是否一起修改?
var name = "卡卡西";
var name1 = "卡卡西";
var name2 = new String("卡卡西");
console.log("name="+name); // 卡卡西
console.log("name1="+name1);// 卡卡西
name1="鸣人" // 重新赋值
console.log("name="+name);// 卡卡西
console.log("name1="+name1);// 鸣人
我们会发现,修改name1不影响name。是因为String是常量。不能修改。我们之前做的所有的修改都是重新给变量赋值。 但是对象的属性是可以被修改的。
看例子:
var p = {};
p.name = "卡卡西";
var p1 = p;
console.log(p.name); //卡卡西
console.log(p1.name);//卡卡西
p1.name="鸣人"
console.log(p.name);//鸣人
console.log(p1.name);//鸣人
Math
Math 是一个内置对象,它拥有一些数学常数属性和数学函数方法。Math 不是一个函数对象。
Math的属性:
Math.E 欧拉常数,也是自然对数的底数,约等于 2.718。
Math.LN2 2 的自然对数,约等于 0.693。
Math.LN10 10 的自然对数,约等于 2.303。
Math.LOG2E 以 2 为底的 E 的对数,约等于 1.443。
Math.LOG10E 以 10 为底的 E 的对数,约等于 0.434。
Math.PI 圆周率,一个圆的周长和直径之比,约等于 3.14159。
Math.SQRT1_2 二分之一 ½ 的平方根,同时也是 2 的平方根的倒数 ,约等于 0.707。
Math.SQRT2 2 的平方根,约等于 1.414。
方法
Math.abs(x) 返回一个数的绝对值。
Math.acos(x) 返回一个数的反余弦值。
Math.acosh(x) 返回一个数的反双曲余弦值。
Math.asin(x) 返回一个数的反正弦值。
Math.asinh(x) 返回一个数的反双曲正弦值。
Math.atan(x) 返回一个数的反正切值。
Math.atanh(x) 返回一个数的反双曲正切值。
Math.atan2(y, x) 返回 y/x 的反正切值。
Math.cbrt(x) 返回一个数的立方根。
Math.ceil(x) 返回大于一个数的最小整数,即一个数向上取整后的值。
Math.clz32(x) 返回一个 32 位整数的前导零的数量。
Math.cos(x) 返回一个数的余弦值。
Math.cosh(x) 返回一个数的双曲余弦值。
Math.exp(x) 返回欧拉常数的参数次方,Ex,其中 x 为参数,E 是欧拉常数(2.718...,自然对数的底数)。
Math.expm1(x) 返回 exp(x) - 1 的值。
Math.floor(x) 返回小于一个数的最大整数,即一个数向下取整后的值。
Math.fround(x) 返回最接近一个数的单精度浮点型表示。
Math.hypot([x[, y[, …]]]) 返回其所有参数平方和的平方根。
Math.imul(x, y) 返回 32 位整数乘法的结果。
Math.log(x) 返回一个数的自然对数(㏒e,即 ㏑)。
Math.log1p(x) 返回一个数加 1 的和的自然对数(㏒e,即 ㏑)。
Math.log10(x) 返回一个数以 10 为底数的对数。
Math.log2(x) 返回一个数以 2 为底数的对数。
Math.max([x[, y[, …]]]) 返回零到多个数值中最大值。
Math.min([x[, y[, …]]]) 返回零到多个数值中最小值。
Math.pow(x, y) 返回一个数的 y 次幂。
Math.random() 返回一个 0 到 1 之间的伪随机数。
Math.round(x) 返回四舍五入后的整数。
Math.sign(x) 返回一个数的符号,得知一个数是正数、负数还是 0。
Math.sin(x) 返回一个数的正弦值。
Math.sinh(x) 返回一个数的双曲正弦值。
Math.sqrt(x) 返回一个数的平方根。
Math.tan(x) 返回一个数的正切值。
Math.tanh(x) 返回一个数的双曲正切值。
Math.toSource() 返回字符串 "Math"。
Math.trunc(x) 返回一个数的整数部分,直接去除其小数点及之后的部分。
案例:
<script>
console.log(Math);
console.log(Math.E);
console.log(Math.PI);
// 向上取整
console.log(Math.ceil(12.2));// 13
console.log(Math.ceil(-12.2));// -12
// 向下取整
console.log(Math.floor(12.2));// 12
console.log(Math.floor(-12.2));// -13
console.log(Math.fround(12.2));// 12.199999809265137
// 取出最大的数
console.log(Math.max(1,3,45,67,2,43));
var arr = [2,5,5,3,2,6,6,343,4,6,65,54,5]
console.log(Math.max(
Date
创建一个 JavaScript Date
实例,该实例呈现时间中的某个时刻。Date
对象则基于 Unix Time Stamp,即自1970年1月1日(UTC)起经过的毫秒数。
案例:
<script>
// 日期函数
// 创建一个当前的系统时间
var now = new Date();
console.log(now);//Fri Jan 21 2022 11:41:38 GMT+0800 (中国标准时间)
// 根据毫秒数创建一个指定的时间 (1h = 60mi = 3600mm = 3600*1000)
var date1 = new Date(1321365464560);
console.log(date1);
// date提供的一些API
// 将上面的日期转换为我们需要的格式
var year = now.getFullYear();//年
var month = now.getMonth()+1; // 0~11
var day = now.getDate();//日
now.getDay();//星期几
var hours = now.getHours();// 24 小时制
var minutes = now.getMinutes();
var seconds = now.getSeconds();
console.log(year+"年"+month+"月"+day+"日 "+hours+":"+minutes+":"+seconds);
// 获取当前的毫秒数
console.log(now.getTime());
now.getTime();//时间戳,全世界统一 从1970.1.1 0:00:00到现在的毫秒数
//时间戳转为时间
new Date(1643982353862);//Fri Feb 04 2022 21:45:53 GMT+0800 (中国标准时间) {}
//获取本地时间
now.toLocaleString();//'2022/2/4 下午9:45:53'
</script>
Array
JavaScript的 Array
对象是用于构造数组的全局对象。
数组的一些API:
Array.prototype.at() 根据指定的索引,取出数组中的元素。如果是负数,则从右边开始计算。
Array.prototype.concat() 用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组
Array.prototype.copyWithin() 浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度
Array.prototype.entries() 返回一个新的 Array Iterator 对象,该对象包含数组中每个索引的键/值对
Array.prototype.every() 测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值
Array.prototype.fill() 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素
Array.prototype.filter() 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素
Array.prototype.find() 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined
Array.prototype.findIndex() 返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1
Array.prototype.flat()---- 按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
Array.prototype.flatMap()--- 使用映射函数映射每个元素,然后将结果压缩成一个新数组
Array.prototype.forEach()--- 对数组的每个元素执行一次给定的函数
Array.prototype.includes() 判断一个数组是否包含一个指定的值,如果包含则返回 true,否则返回 false
Array.prototype.indexOf() 返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回 -1
Array.prototype.join() 将一个数组的所有元素连接成一个字符串并返回这个字符串
Array.prototype.keys() 返回一个包含数组中每个索引键的 Array Iterator 对象
Array.prototype.lastIndexOf() 返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1
Array.prototype.map() 返回一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值
Array.prototype.pop() 从数组中删除最后一个元素,并返回该元素的值
Array.prototype.push() 将一个或多个元素添加到数组的末尾,并返回该数组的新长度
Array.prototype.reduce() 对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值
Array.prototype.reduceRight() 接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值
Array.prototype.reverse() 将数组中元素的位置颠倒,并返回该数组。该方法会改变原数组
Array.prototype.shift() 从数组中删除第一个元素,并返回该元素的值
Array.prototype.slice() 提取源数组的一部分并返回一个新数组
Array.prototype.some() 测试数组中是不是至少有一个元素通过了被提供的函数测试
Array.prototype.sort() 对数组元素进行原地排序并返回此数组
Array.prototype.splice() 通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容
Array.prototype.toLocaleString() 返回一个字符串表示数组中的元素。数组中的元素将使用各自的 Object.prototype.toLocaleString() 方法转成字符串
Array.prototype.toString() 返回一个字符串表示指定的数组及其元素。数组中的元素将使用各自的 Object.prototype.toString() 方法转成字符串
Array.prototype.unshift() 将一个或多个元素添加到数组的头部,并返回该数组的新长度
Array.prototype.values() 返回一个新的 Array Iterator 对象,该对象包含数组每个索引的值
<script>
var arr = [9,5,2,7];
var arr1 = new Array();
console.log(typeof arr);// object
console.log(typeof arr1);// object
var x = arr.at(-1);
console.log(x);// 7
// 合并数组
var arr2 = [1,2,3,4,5]
var arr3 = [3,4,5,6,7]
var arr4 = arr2.concat(arr3);
console.log(arr2);
console.log(arr3);
console.log(arr4);
// copyWithin
var arr5 = [1,2,3,4,5,6,7,8,9];
// 从索引为3的元素开始复制到索引为5的元素的前一个。将这些内容从索引为2的开始填充,产生新的数组
var arr6 = arr5.copyWithin(2,3,5);
console.log(arr5);
console.log(arr6);
// every()
var arr7 = [3,4,5,6,7]
var result = arr7.every(function(curr){
// 这里的curr表示遍历中的每一个元素
return curr > 3;
});
console.log(result);
// fill
var arr8 = new Array(10);
arr8.fill("鸣人");
console.log(arr8);
// filter();
var arr9 = [1,2,5,4,7,23,6,5,43,64,34];
// 取出所有的偶数放在一个新数组中
var arr10 = arr9.filter(function(curr){
return curr % 2 == 0;
});
console.log(arr10);
// find 和 filter差不多,但是只返回第一个
var num = arr9.find(function(curr){
return curr % 2 == 0;
});
console.log(num);
// forEach
var arr11 = [1,5,9,3,4,7,2,6,8,5];