JavaScript高级程序设计—第五章(引用类型)

前端之家收集整理的这篇文章主要介绍了JavaScript高级程序设计—第五章(引用类型)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1.对象的创建和对象属性的访问:在创建一个对象时可以通过字面量创建,访问对象的属性时,可以通过obj.属性名或则obj["属性名"]两种方式访问,例如:

属性名可以写成这样
  "how-old": 18,// 属性名可以是字符串
  5: 15,// 属性名自已是数字,解析时自动被解析成字符串
}
console.log(obj.name);          // 访问属性可以使用点运算符(.)
console.log(obj["5"]);          // 也可以使用方括号([])取属性值,使用中括号的好处是可以通过变量来访问属性值
console.log(obj["how-old"]);  // 属性名中有特殊字符(. 空格)时需要使用方括号取值

2.创建一个数组有两种方法

函数创建一个长度为20的数组,数组中每个元素之都是undefined
let array3 = new Array(20,21,22)    // 创建一个长度为3的数组,数组元素分别是20,23

3.数组的length属性表示数组中元素的个数,值得注意的是length属性并不是只读的,我们可以通过改变length属性移除数组元素:

4.instanceof操作符检测数组的局限性:instanceof操作符只能检测同一个全局执行环境中的的数组,假如在浏览器中包含多个框架,那么两个框架实际上是不同的全局执行环境,当把一个数组由一个框架传递到另一个框架时,实际上两者的数组的构造函数是不同,则不能用instanceof操作符来检测。这时可以使用Array.isArray()方法来判断。

5.转换方法
(a)join():使用join()方法可以轻松的将数组转化成字符串,该方法接受一个参数,给每个元素之间加上该参数,并将最终结构以字符串形式放回。
(b)其他方法:toString()、toLocaleString()方法,这两个个方法默认都会返回以逗号分隔的字符创形式。array.valueOf()返回的就是数组本身。

5.数组排序方法:reserve()方法和sort()方法
(a)reserve()方法的作用是对数组逆序。
(b)sort()方法的作用是按照一定的规则对数组进行排序,默认情况下是按照升序规则进行排序,在比较两个元素时先将调用元素的toString()转换成字符串之后在进行字符串的比较:

为了解决这种问题,sort()函数可以接受一个函数作为参数,这个函数接受两个需要比较的值作为参数(value1,value2),如果value1应该在value2之前则返回-1,如果value1在value2之后则返回1,如果相等则返回0,这样我们就可以自定义排序规则了。

 0) {
    return 1;
  }
  else {
    return 0;
  }

// return value1 - value2;
})
console.log(array) // [1,101]

6.数组操作方法:concat()、slice()、splice()。位置方法:indexOf()、lastIndexOf()。
(a)concat()方法可以接受多个任意类型的参数,并创建一个数组副本,将参数依次放入副本数组的后面,并返回此副本数组。值得注意的是concat()方法返回的是一个新的数组,对原数组没有影响。
(b)slice()方法可以从数组中截取某些元素,该方法接受两个参数,开始截取数组的位置和结束截取数组的位置(结束位置省略时默认截取剩下的所有元素),返回截取区间内的新的数组,该方法同样对原数组没有影响。
(c)splice()方法可以删除添加、替换数组元素,该方法可以接受三个参数,删除元素的开始位置、删除元素的长度(省略则删除开始位置后面所有元素)、要插入元素(可选)。该方法会返回删除的元素,注意的是该方法是直接在元素组上进行操作,会影响原数组。
(d)indexOf()和lastIndexOf()方法都可以返回数组中某个元素的位置,若没有找到该元素则返回-1,两者不同之处在于搜索的顺序不同,indexof()从前往后搜索,lastIndexOf()从后往前搜索

方法后,array1不改变
console.log(array3.slice(1,5));                    // [2,5],返回从[1-5)之间的元素
console.log(array3);                            // [1,6],执行slice()方法后,array3不改变
console.log(array3.splice(1,"apple","pear")); // [2,返回删除的[1-4]之间的元素
console.log(array3);                            // [1,"pear",执行splice()方法后array3数组发生改变

7.数组迭代方法:every(),some(),forEach(),filter(),map()。这几种方法接受的参数都可以接受三个参数(当前元素、元素下标、整个数组)
every():数组每一项运行给定函数,若每一项都返回true,则返回true。
some():数组每一项运行给定函数,只要有一项返回true,则返回true。
filter():数组每一项运行给定函数,得到该函数会返回true的的所有元素组成的数组。
forEach():数组中的每一项运行给定函数函数可接收3个参数(当前元素、当前元素下标、所属数组对象),值得注意的是forEach只是简单的遍历数组,没有返回值。
map():数组中的每一项运行给定函数,并返回按照函数运算之后的结果数组(相当于返回一个新数组,新数组和元素组是一一映射关系)。

console.log(array.every(function(item) {        // true
return item > 0;
}))
console.log(array.some(function(item) { // true
return item > 4;
}))
console.log(array.filter(function(item) { // [3,5]
return item >= 3;
}))
console.log(array.map(function(item) { // [1,9,16,25]
return item * item;
}))
array.forEach(function(item) {
console.log(item); // 1,5
})

8.缩小方法:reduce()和reduceRight()。
两种方法都会迭代数组中所有的元素,唯一的区别就是迭代的顺序不同,reduce()方法是从头到尾开始迭代,而reduceRight()则相反。以reduce()方法为例,该方法接受四个参数分别是(前一个值,当前元素、当前元素下标、数组对象),其中前一个值时上一次计算的结果。

9.函数表达式和函数声明的区别:两则在作用上没有任何区别,都能定义一个函数,但是函数声明存在函数提升的情况,而函数表达式不存在函数提升,例如:

let sayHi = function(name) {            // 变量sayHi被提到作用域的最前面,但是并没有赋值
console.log(hi ${name}!);
}
function sayHello(name) { // 函数声明被提到作用域的最前面,因此可以调用sayHello()
console.log(hello ${name}!);
}

10.函数属性方法。js中函数也是对象,因此函数也有其对应的属性方法。每个函数都包含两个属性:length属性和prototype属性,其中length属性函数期望接受的参数个数,而prototype属性则是一个指针,指向该函数的原型对象,函数所有的实例方法(toString()、valueOf()等)都保存在原型对象中,值得注意的是prototype上的属性是不可枚举的,因此使用for-in无法遍历。

11.apply方法和call方法:每个函数都有非继承而来的方法apply和call,这两个方法的作用类似,都可以改变函数的执行环境,让函数在特定的作用域中执行。两者唯一的区别在于接受的参数不同,apply只能接受一个数组作为参数,call可以接受任意多个参数,例如:

person1.getName();                // dayday
person1.getName.apply(person2) // huahua

上面例子中,第一次调用person1.getName()时,getName()方法的执行环境时person1,因此得到的name属性就是person1的name属性,而第二次调用person1.getName()时,我们通过apply方法动态的将getName()方法绑定到person2上执行,因此得到的name属性就是person2的name属性

12.基本包装类型:String、Number、Boolean。比如new String("hello word!")方法创建的数据也属于引用类型,实际上每一次我们操作基本类型的数据时,后台都会创建一个包装类型的对象。比如:

// 后台进行的操作是:
let str1 = new String("hello word!");
let str2 = str1.subString(2);
str1 = null; // 销毁临时创建的字符串对象

13.Number类型的toFixed()方法:此方法会按照指定的小数位返回数值的字符串表示,其接收一个参数指明需要保留几位小数,需要注意的是该方法在舍去时会根据四舍五入的原则进行舍去。
toExponential()方法:此方法会按照指定小数位返回数值的指数表示法。
toPrecision()方法:此方法会返回一个数的最合适格式(可能是小数表示,可能是指数表示),该方法接受一个数字,表示所有整个的位数

14.String类型方法:concat()、slice()、substr()、substring()方法,这些方法都不会改变原字符串,而是返回一个基本类型的字符串。concat()方法和数组的concat方法类似,用于连接字符串,可以接收多个参数。slice()方法和substr()方法接受一个或两个参数,第一个参数时字符串的起始位置,第二个参数表明字符串的结束位置,当第一个参数是负数时,两个方法会将负数与字符串的长度相加得到一个正数,当第二个参数是负数时,slice()方法会将负数转换成整数,而substr()方法会将负数转化为0(即该方法会返回一个空字符串)。substring()方法接收两个参数,第一个参数是字符串的起始位置,第二个参数是返回字符的个数,当参数中有负数时,该方法自动把参数转化为0,并且以较小的参数作为起始位置,较大的一个数作为字符串长度。

15.字符串其他方法:charAt()、charCodeAt()、trim()、toUpperCase()、toLowerCase()、split()。charAt()方法返回指定的位置的一个字符,charCodeAt()返回指定位置字符的字符编码。trim()方法返回一个新的去掉了首尾空格的字符串。toUpperCase()方法可以将字符串小写英文字符转换为全大写,与toLowerCase()方法作用相反。split()方法可以从指定的字符出分割字符串,该方法返回一个数组,数组中元素是分割得到的字符串。需要注意的是,以上方法都不会影响原字符串。

console.log(string.charAt(1));            // e
console.log(string.charCodeAt(1)); // 101
console.log(string.charCodeAt(1)); // HELLO WORLD MY NAME IS DAYDAY
console.log(string.split(" ")); // ["hello","world","my","name","is","dayday"]
console.log(string) // hello world my name is dayday

16.Global全局对象:在浏览器中Global对象属于window对象的一部分,所有的全局变量和全局函数都是这个对象的属性,例如isNaN()、parseInt()等方法都是Global对象的属性,除此之外,Global对象还有一些其他的属性
URI编码方式:encodeURI()以及encodeURIComponent()方法。这两种方法可以对uri地址进行编码,两者的区别在于encodeURI()方法不会对地址中的? : # /等符号进行编码,但是encodeURIComponent()会对所有非标准字符进行编码。
URI解码方法:decodeURI()、decodeURIComponent()方法。这两种方法分别与encodeURI()方法和decodeURIComponent()方法对应。

console.log(encodeURIString);                    // http://www.baidu.com?name=%E5%A4%A9%E5%A4%A9
console.log(decodeURI(encodeURIString)); // http://www.baidu.com?name=天天
console.log(encodeURIComponentString); // http%3A%2F%2Fwww.baidu.com%3Fname%3D%E5%A4%A9%E5%A4%A9
console.log(decodeURIComponent(encodeURIComponentString)); // http://www.baidu.com?name=天天

17.Math对象是保存数学公式和信息的公共对象,提供了一些数学计算方法
max()、min()方法:用来计算一组数值中最大值和最小值,可以接收任意多个数值类型的值作为参数,如果传入的参数为非数值类型,会先尝试将其转化为数值类型,只要有一个参数不能转换成数值类型就返回NaN。
舍入方法ceil()、floor()、round()。其中ceil()方法向上舍入,floor()方法是向下舍入,round()方法遵循四舍五入。
随机数产生方法:random()方法,该方法可以产生一个0和1之间的随机数(不包括0、1)。在使用时套用下面公式可以从某个范围内产生一个随机整数:Math.floor(Math.random() * 可能值的总数 + 第一个可能的值)

随机生成一个整数
原文链接:https://www.f2er.com/js/416193.html

猜你在找的JavaScript相关文章