javescript循环(for…in…/Map和Set/函数/apply()与call()/map()/reduce()/filter()/sort())

来源:互联网 发布:mac定妆喷雾 编辑:程序博客网 时间:2024/06/06 08:35

1、for…in…循环,可以把一个对象的所有属性依次循环出来

var o = {    name: 'Jack',    age: 20,    city: 'Beijing'};for (var key in o) {    alert(key); // 'name', 'age', 'city'}
要过滤掉对象继承的属性,用hasOwnProperty()来实现

var o = {    name: 'Jack',    age: 20,    city: 'Beijing'};for (var key in o) {    if (o.hasOwnProperty(key)) {        alert(key); // 'name', 'age', 'city'    }}
var a = ['A', 'B', 'C'];for (var i in a) {    alert(i); // '0', '1', '2'    alert(a[i]); // 'A', 'B', 'C'}

2、map和set

Map是一组键值对的结构,具有极快的查找速度。

var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);m.get('Michael'); // 95
var m = new Map(); // 空Mapm.set('Adam', 67); // 添加新的key-valuem.set('Bob', 59);m.has('Adam'); // 是否存在key 'Adam': truem.get('Adam'); // 67m.delete('Adam'); // 删除key 'Adam'm.get('Adam'); // undefined

Set和Map类似,也是一组key的集合,但不存储value。在Set中,没有重复的key。add(key)方法可以添加元素到Set中

var s = new Set([1, 2, 3, 3, '3']);s; // Set {1, 2, 3, "3"}s.delete(3);s; // Set {1, 2, "3"}

3、对类型判断实例typesof

function abs(x) {    if (typeof x !== 'number') {        throw 'Not a number';    }    if (x >= 0) {        return x;    } else {        return -x;    }}
利用arguments,可以获得调用者传入的所有参数,arguments.length获得参数的个数

4、函数写法

var xiaoming = {    name: '小明',    birth: 1990,    age: function () {        var y = new Date().getFullYear();        return y - this.birth;    }};xiaoming.age; // function xiaoming.age()xiaoming.age(); // 今年调用是25,明年调用就变成26了

var xiaoming = {    name: '小明',    birth: 1990,    age: function () {        var that = this; // 在方法内部一开始就捕获this        function getAgeFromBirth() {            var y = new Date().getFullYear();            return y - that.birth; // 用that而不是this        }        return getAgeFromBirth();    }};xiaoming.age(); // 25


5、apply()与call()区别

apply()把参数打包成Array再传入;
call()把参数按顺序传入。
比如调用Math.max(3, 5, 4),分别用apply()和call()实现如下:

Math.max.apply(null, [3, 5, 4]); // 5Math.max.call(null, 3, 5, 4); // 5


6、map()

map()方法定义在JavaScript的Array中,我们调用Array的map()方法,传入,就得到了一个新的Array作为结果

function pow(x) {    return x * x;}var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9']


7、Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算

var arr = [1, 3, 5, 7, 9];arr.reduce(function (x, y) {    return x + y;}); // 25

8、filter(),根据返回值是true还是false决定保留还是丢弃该元素。

var arr = [1, 2, 4, 5, 6, 9, 10, 15];  //输出奇数arr.filter(function (x) {    return x % 2 === 1;}); // [1, 5, 9, 15]
var arr = ['A', '', 'B', null, undefined, 'C', '  '];  //删空字符串arr.filter(function (s) {    return s && s.trim(); // 注意:IE9以下的版本没有trim()方法}); // ['A', 'B', 'C']

9、sort()排序

// 看上去正常的结果:['Google', 'Apple', 'Microsoft'].sort(); // ['Apple', 'Google', 'Microsoft'];// apple排在了最后:a的<span style="color: rgb(102, 102, 102); font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; white-space: pre-wrap;">ASCII码靠后</span>['Google', 'apple', 'Microsoft'].sort(); // ['Google', 'Microsoft", 'apple']// 无法理解的结果:[10, 20, 1, 2].sort(); // [1, 10, 2, 20]
var arr = [10, 20, 1, 2];arr.sort(function (x, y) {    if (x < y) {        return -1;    }    if (x > y) {        return 1;    }    return 0;}); // [1, 2, 10, 20],一般排序










0 0
原创粉丝点击