前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >重新撸一遍javascript (二)

重新撸一遍javascript (二)

作者头像
lilugirl
发布2020-04-24 14:52:12
3110
发布2020-04-24 14:52:12
举报
文章被收录于专栏:前端导学前端导学

对象

探索对象的key

key必须是字符串,如果不是js会自动转为字符串,比如对象作为key会转化成 字符串[object Object]

代码语言:javascript
复制
var obj = {};
obj[1] = 1;
obj['1'] = 2;
obj; // Object {1: 2}

obj[{}] = true;
obj[{x : 1}] = true;
obj; // Object {1: 2, [object Object]: true}

创建对象的方式

用字面量创建
代码语言:javascript
复制
var obj1 = {x : 1, y : 2};
var obj2 = {
    x : 1,
    y : 2,
    o : {
        z : 3,
        n : 4
    }
};
使用new构造器的方式创建
使用Object.create创建

属性操作

属性读写
属性删除

变量和函数都不能被删除,但是隐式创建的全局变量可以被删除,另外在eval里定义的变量可以被删除

属性检测
属性枚举

getter setter方法

get/set与原型链

属性标签

对象标签

[[proto]]标签
[[class]]标签
[[extensible]]标签

序列化

key的值如果是undefined则不会出现在序列化中

自定义

toString和valueOf对象方法

数组

数组是值的有序集合。每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引。JS中的数组是弱类型的,数组中可以含有不同类型的元素。数组元素甚至可以是对象或其它数组。

创建数组的方式

使用字面量
代码语言:javascript
复制
var BAT = ['Alibaba', 'Tencent', 'Baidu'];
var students = [{name : 'Bosn', age : 27}, {name : 'Nunnly', age : 3}];
var arr = ['Nunnly', 'is', 'big', 'keng', 'B', 123, true, null];
var arrInArr = [[1, 2], [3, 4, 5]];

var commasArr1 = [1, , 2]; // 1, undefined, 2
var commasArr2 = [,,]; // undefined * 2

数组长度size from 0 to 4,294,967,295(2^23 -1 )

使用 new Array
代码语言:javascript
复制
var arr = new Array(); 
var arrWithLength = new Array(100); // undefined * 100
var arrLikesLiteral = new Array(true, false, null, 1, 2, "hi");
// 等价于[true, false, null, 1, 2, "hi"];

数组元素的读写

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5];
arr[1]; // 2
arr.length; // 5


arr[5] = 6;
arr.length; // 6


delete arr[0];
arr[0]; // undefined

数组元素的增删

代码语言:javascript
复制
var arr = [];
arr[0] = 1;
arr[1] = 2;
arr.push(3);
arr; // [1, 2, 3]

arr[arr.length] = 4; // equal to arr.push(4);
arr; // [1, 2, 3, 4]

arr.unshift(0);
arr; // [0, 1, 2, 3, 4];


delete arr[2];
arr; // [0, 1, undefined, 3, 4]
arr.length; // 5
2 in arr; // false

arr.length -= 1;
arr; // [0, 1, undefined, 3, 4],  4 is removed

arr.pop(); // 3 returned by pop
arr; // [0, 1, undefined], 3 is removed

arr.shift(); // 0 returned by shift
arr; // [1, undefined]

数组迭代

稀疏数组

稀疏数组并不含有从0开始的连续索引。一般length属性值比实际元素个数大。

代码语言:javascript
复制
var arr1 = [undefined];
var arr2 = new Array(1);
0 in arr1; // true
0 in arr2; // false
arr1.length = 100;
arr1[99] = 123;
99 in arr1; // true
98 in arr1; // false

var arr = [,,];
0 in arr; // false

数组方法

代码语言:javascript
复制
{}   =>  Object.prototype
[]   =>  Array.prototype
Array.prototype.join

将数组转为字符串

代码语言:javascript
复制
var arr = [1, 2, 3];
arr.join(); // "1,2,3"
arr.join("_"); // "1_2_3"

function repeatString(str, n) {
     return new Array(n + 1).join(str);
}
repeatString("a", 3); // "aaa"
repeatString("Hi", 5); // "HiHiHiHiHi"
Array.prototype.reverse

将数组逆序

代码语言:javascript
复制
var arr = [1, 2, 3];
arr.reverse(); // [3, 2, 1]
arr; // [3, 2, 1] 原数组也被修改
Array.prototype.sort

排序

代码语言:javascript
复制
var arr = ["a", "d", "c", "b"];
arr.sort(); // ["a", "b", "c", "d"]

arr = [13, 24, 51, 3];
arr.sort(); // [13, 24, 3, 51]
arr; // [13, 24, 3, 51] 原数组被修改

arr.sort(function(a, b) {
     return a - b;
}); // [3, 13, 24, 51]


arr = [{age : 25}, {age : 39}, {age : 99}];
arr.sort(function(a, b) {
     return a.age - b.age;
});
arr.forEach(function(item) {
     console.log('age', item.age);
});
// result:
// age 25
// age 39
// age 99
Array.prototype.concat

数组合并

代码语言:javascript
复制
var arr = [1, 2, 3];
arr.concat(4, 5); // [1, 2, 3, 4, 5]
arr; // [1, 2, 3] 原数组未被修改

arr.concat([10, 11], 13); // [1, 2, 3, 10, 11, 13]   数组被拉平

arr.concat([1, [2, 3]]); // [1, 2, 3, 1, [2, 3]]  只拉平一次
Array.prototype.slice

返回部分数组

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5];
arr.slice(1, 3); // [2, 3] 原数组未被修改
arr.slice(1); // [2, 3, 4, 5]
arr.slice(1, -1); // [2, 3, 4]
arr.slice(-4, -3); // [2]
Array.prototype.splice

数组拼接

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5];
arr.splice(2); // returns [3, 4, 5]
arr; // [1, 2]; 原数组被修改

arr = [1, 2, 3, 4, 5];
arr.splice(2, 2); // returns [3, 4]
arr; // [1, 2, 5];

arr = [1, 2, 3, 4, 5];
arr.splice(1, 1, 'a', 'b'); // returns [2]
arr; // [1, "a", "b", 3, 4, 5]
Array.prototype.forEach

数组遍历

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
    console.log(x + '|' + index + '|' + (a === arr));
});
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true
Array.prototype.map

数组映射

代码语言:javascript
复制
var arr = [1, 2, 3];
arr.map(function(x) {
     return x + 10;
}); // [11, 12, 13]
arr; // [1, 2, 3]  原数组未被修改
Array.prototype.filter

数组过滤

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr.filter(function(x, index) {
     return index % 3 === 0 || x >= 8;
}); // returns [1, 4, 7, 8, 9, 10]
arr; // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 原数组未被修改
Array.prototype.every & some

数组判断

代码语言:javascript
复制
var arr = [1, 2, 3, 4, 5];
arr.every(function(x) {
     return x < 10;
}); // true

arr.every(function(x) {
     return x < 3;
}); // false


var arr = [1, 2, 3, 4, 5];
arr.some(function(x) {
     return x === 3;
}); // true

arr.some(function(x) {
     return x === 100;
}); // false
Array.prototype.reduce&reduceRight
代码语言:javascript
复制
var arr = [1, 2, 3];
var sum = arr.reduce(function(x, y) {
     return x + y
}, 0); // 6
arr; //[1, 2, 3]原数组未被修改

arr = [3, 9, 6];
var max = arr.reduce(function(x, y) {
     console.log(x + "|" + y);
     return x > y ? x : y;
});
// 3|9
// 9|6
max; // 9


max = arr.reduceRight(function(x, y) {
     console.log(x + "|" + y);
     return x > y ? x : y;
});
// 6|9
// 9|3
max; // 9
Array.prototype.indexOf&lastIndexOf

数组检索

代码语言:javascript
复制
var arr = [1, 2, 3, 2, 1];
arr.indexOf(2); // 1
arr.indexOf(99); // -1
arr.indexOf(1, 1); // 4
arr.indexOf(1, -3); // 4
arr.indexOf(2, -1); // -1
arr.lastIndexOf(2); // 3
arr.lastIndexOf(2, -2); // 3
arr.lastIndexOf(2, -3); // 1
Array.isArray

判断是否为数组

代码语言:javascript
复制
Array.isArray([]); // true

[] instanceof Array; // true
({}).toString.apply([]) === '[object Array]'; // true
[].constructor === Array; // true

字符串与数组

字符串是类数组

代码语言:javascript
复制
var str = "hello world";
str.charAt(0); // "h"
str[1]; // e

Array.prototype.join.call(str, "_");
// "h_e_l_l_o_ _w_o_r_l_d"
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 对象
    • 探索对象的key
      • 创建对象的方式
        • 用字面量创建
        • 使用new构造器的方式创建
        • 使用Object.create创建
      • 属性操作
        • 属性读写
        • 属性删除
        • 属性检测
        • 属性枚举
      • getter setter方法
        • get/set与原型链
      • 属性标签
        • 对象标签
          • [[proto]]标签
          • [[class]]标签
          • [[extensible]]标签
        • 序列化
          • 自定义
        • toString和valueOf对象方法
        • 数组
          • 创建数组的方式
            • 使用字面量
            • 使用 new Array
          • 数组元素的读写
            • 数组元素的增删
              • 数组迭代
                • 稀疏数组
                  • 数组方法
                    • Array.prototype.join
                    • Array.prototype.reverse
                    • Array.prototype.sort
                    • Array.prototype.concat
                    • Array.prototype.slice
                    • Array.prototype.splice
                    • Array.prototype.forEach
                    • Array.prototype.map
                    • Array.prototype.filter
                    • Array.prototype.every & some
                    • Array.prototype.reduce&reduceRight
                    • Array.prototype.indexOf&lastIndexOf
                    • Array.isArray
                  • 字符串与数组
                  相关产品与服务
                  文件存储
                  文件存储(Cloud File Storage,CFS)为您提供安全可靠、可扩展的共享文件存储服务。文件存储可与腾讯云服务器、容器服务、批量计算等服务搭配使用,为多个计算节点提供容量和性能可弹性扩展的高性能共享存储。腾讯云文件存储的管理界面简单、易使用,可实现对现有应用的无缝集成;按实际用量付费,为您节约成本,简化 IT 运维工作。
                  领券
                  问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档