高程笔记
0 Views 前端 with
本文字数:2,261 字 | 阅读时长 ≈ 9 min

高程笔记

0 Views 前端 with
本文字数:2,261 字 | 阅读时长 ≈ 9 min

本节主要讲述高程笔记

按值访问

Undefined,Null,Boolean,Number,String

引用类型

引用类型的值是保留在内存中的对象,不允许直接访问内存中的位置,在操作对象时,实际上是在操作对象的引用而不是实际的对象

基本类型

不能给基本类型的值添加属性,报错(undefined)

只能给引用类型值动态的添加属性

复制变量值的不同

基本类型值的复制

1
2
var num1=5;
var num2=num1;

num2中的5和num1的5是完全独立的,该值只是num1中5的一个副本,此后,这两个变量可以参与任何操作而不相互影响。

引用类型值的复制

1
2
3
4
var obj1=new Object();
var obj2=obj1;
obj1.name = "Nick";
alert(obj2.name); /* Nick */

当从一个变量向另一个变量复制引用类型的值时,同样也会将存储在变量对象中的值复制一份放到为新分配的空间中

不同的是,这个值的副本实际上是一个指针,而这个指针只想存储在堆中的一个对象。

复制结束后,两个变量实际上将引用同一个对象。

因此,改变其中一个变量,就会影响另一个变量

检测数组

问题:instanceof

它假定只有一个全局执行环境。如果网页中包含多个框架,那实际上就存在两个以上不用的全局执行环境,从而存在两个以上不同版本的Array构造函数。

解决办法 Array.isArray()

1
2
3
4
var arr = [1, 2, 3, 3];
if (Array.isArray(arr)) {
alert(arr) /* 1,2,3,4 */
}

数组转字符串方法

toString()

返回由数组中每个值的字符串形式拼接而成的一个以逗号分割的字符串

1
2
3
4
var arr=[1,2,3,3];
if(Array.isArray(arr)){
console.log(arr.toString()) /* 1,2,3,4 */
}

join()

1
2
3
4
5
6
var arr = [1, 2, 3, 3];
if (Array.isArray(arr)) {
console.log(arr.toString()) /* 1,2,3,4 */
console.log(arr.valueOf()) /* [1,2,3,4] */
console.log(arr.join('-')) /* 1-2-3-3 */
}

slice()

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

console.log(arr.slice(1)) /* 2,3,4*/
console.log(arr.slice(1, 2)) /* 2,3,4 */

splice()

1
2
3
4
5
6
7
var arr = [1, 2, 3, 4];

var arr1 = arr.splice(1, 1, 'ok');


console.log(arr1) /* 2 */
console.log(arr) /* [1, "ok", 3, 4] */

数组的归并方法reduce和reduceRight

1
2
3
4
5
6
7
var arr = [1, 2, 3, 4];

var sum = arr.reduce(function(pre, next, index, array) {
return pre + next
})

console.log(sum)

日期格式化方法

1
2
3
4
5
6
7
8
9
10
11
var time = new Date();

console.log(time.toDateString()) /* 日、月、年 Sat Sep 22 2018*/
console.log(time.toTimeString()) /* 时分秒 13:11:01 GMT+0800 (中国标准时间) */
console.log(time.toLocaleDateString()) /*以特定地区的格式显示日,月,年 2018/9/22 */
console.log(time.toLocaleTimeString()) /*以特定地区的格式显示 时分秒 下午1:12:29 */
console.log(time.toUTCString()) /*完整的UTC日期 Sat, 22 Sep 2018 05:13:02 GMT */


console.log(time.toString()) /*完整日期 Sat Sep 22 2018 13:13:39 GMT+0800 (中国标准时间) */
console.log(time.toLocaleString()) /*完整日期 2018/9/22 下午1:13:58 */

call()和apply()

扩展函数赖以运行的作用域

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
window.color = 'red';
var o = {
color: 'blue'
}

function sayColor() {
console.log(this.color)
}
sayColor(); /* red */

sayColor.call(this); /* red */

sayColor.call(window) /* red */

sayColor.call(o) /* blue */

sayColor.call(this)和sayColor.call(window),是两种显示得在全局作用域中调用函数的方式,结果当然都会显示red

当运行sayColor.call(o)时,函数的执行环境不一样,因为此时函数体内的this对象指向了o,于是结果显示的是blue

使用call()和apply()来扩充作用域的最大好处,就是对象不需要与方法有任何耦合关系

bind()方法

创建一个函数的实例,其this值会被绑定到传给bind()函数的值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
window.color = 'red';
var o = {
color: 'blue'
}

function sayColor() {
console.log(this.color)
}
sayColor(); /* red */

sayColor.call(this); /* red */

sayColor.call(window) /* red */

sayColor.call(o) /* blue */


var objectSayColor = sayColor.bind(o);
objectSayColor();

基本包装类型

特殊的引用类型

BooleanNumberString

案例解析

1
2
var s1 = 'some text';
var s2 = s1.substring(2);
1
2
3
4
5
6
7
8
/* 创建String类型的一个实例 */
var s1 = new String('some text');

/* 在实例上调用指定的方法 */
var s2 = s1.substring(2);

/* 销毁这个实例 */
s1 = null;

经过此番处理,基本的字符串值就变得跟对象一样了。

区别

主要的区别:——>对象的生存期

1
2
3
var s1 = 'some text';
s1.color = 'red';
alert(s1.color)

返回类型

Object构造函数也会像工厂方法一样,根据传入值的类型返回基本包装类型的实例

1
2
var obj = new Object("some text");
alert(obj instanceof String) //true

Number类型检测的不同

1
2
3
4
5
6
7
8
var numObj = new Number(10);
var numValue = 10;

console.log(typeof numObj); /*引用类型 object */
console.log(typeof numValue); /*基本类型 number */

console.log(numObj instanceof Object); /* true */
console.log(numValue instanceof Number) /* false */
方法 用处 第一个参数 第二个参数 第三个参数
charAt() 返回给定位置的字符 索引
charCodeAt() 返回给定位置的字符编码 索引
concat() 拼接字符串 字符串1 字符串2 字符串3
slice() 剪切字符串 起始位置 结束位置
substr() 剪切字符串 起始位置 结束位置
substring() 剪切字符串 起始位置 结束位置
indexof() (从开头向后搜索子字符串)返回子字符串的位置(没有就返回-1)
lastIndexOf() (从结尾向前搜索子字符串)返回子字符串的位置(没有就返回-1)
trim() 删除前置及后缀的所有空格
toLowerCase() 字符串转大写
toLocaleLowerCase() 字符串转大写
toUpperCase() 字符串转大写
toLocaleUpperCase() 字符串转大写

单体内置对象

定义:

Global对象

Math()对象

案例

1
2
3
4
5
var max = Math.max(3, 54, 32, 16);
console.log(max); /* 54 */

var min = Math.min(3, 54, 32, 16);
console.log(min); /* 3 */
1
2
3
4
5
var values = [1, 2, 3, 4, 5, 6, 7, 8];

var max = Math.max.apply(this, values);

console.log(max); /* 8 */

舍入方法

方法 说明
Math.ceil() 向上舍入
Math.round() 四舍五入
Math.floor() 向下舍入
Math.random() 返回>=0 && < 1的随机数
Math.abs 返回num的绝对值
Math.exp(num) 返回Math.E的num次幂
Math.log(num) 返回num的自然对数
Math.pow(num,power) 返回num的power的次幂
Math.sqrt(num) 返回num的平方根
Math.acos(x) 返回x的反余弦值
Math.asin(x) 返回x的反正余弦值
Math.atan(x) 返回x的反正切值
Math.atan2(y,x) 返回y/x的反正切值
Math.cos(x) 返回x的余弦值
Math.sin(x) 返回x的正弦值
Math.tan(x) 返回x的正切值