js学习中的三种对象(1)——内置对象

内置对象:

~通俗来说,内置对象就是js系统自带的对象~

那么。。。。。。。。。

如何验证变量是不是对象:

console.log(Array instanceof Object)   //true
复制代码

~可见,数组也是对象呢~

接下来,我推荐大家一个特别特别特别好的学习网站,以下案例多是来自该网站,铛铛铛铛~~~~~MDN-在线的帮助文档

我们还需要弄明白以下几个概念:

  • 实例对象:通过构造函数创建出来,实例化的对象
  • 实例方法必须通过实例对象调用
  • 静态对象:不需要创建,直接就是一个对象,方法(静态方法)直接通过这个对象名字调用
  • 静态方法必须通过大写的对象调用

弄清楚以上概念之后,我们需要知道内置对象包含哪些?什么属于内置对象?

  • Math
  • Date
  • String
  • Array

接下来我便开始结合例子让大家更简单的理解,当然,在这里我只是举比较常用的例子,具体大家可以参考MDN,哪里不会点哪里哦!(笑脸)

Math:

是一个内置对象, 它具有数学常数和函数的属性和方法。不是一个函数对象。

描述: 与其它全局对象不同的是, Math 不是一个构造器. Math 的所有属性和方法都是静态的. 你用到的常数pi可以用 Math.PI 表示。JavaScript中的常数, 是以全精度的实数定义的.

Math.abs(x) 函数返回指定数字 “x“ 的绝对值。

例子:

Math.abs('-1');     // 1
Math.abs(-2);       // 2
Math.abs(null);     // 0
Math.abs("string"); // NaN
Math.abs();         // NaN
复制代码

注意:传入一个非数字形式的字符串或者 undefined/empty 变量,将返回 NaN。传入 null 将返回 0。

Math.ceil() 函数返回大于或等于一个给定数字的最小整数(向上取整)。

例子:

Math.ceil(.95);    // 1
Math.ceil(4);      // 4
Math.ceil(7.004);  // 8
Math.ceil(-0.95);  // -0
Math.ceil(-4);     // -4
Math.ceil(-7.004); // -7
复制代码

Math.floor() 返回小于或等于一个给定数字的最大整数(向下取整)。

例子:

Math.floor( 45.95);     // 45 
Math.floor( 45.05);     // 45 
Math.floor( 4 );        // 4 
Math.floor(-45.05);     // -46 
Math.floor(-45.95);     // -46
复制代码

Math.max(value1[,value2, ...]) 函数返回一组数中的最大值。

例子:

Math.max(10, 20);   //  20
Math.max(-10, -20); // -10
Math.max(-10, 20);  //  20
复制代码

Math.min(value1[,value2, ...]) 返回零个或更多个数值的最小值。

例子:下例找出 x 和 y 的最小值,并把它赋值给 z:

var x = 10, y = -20;
var z = Math.min(x, y);
Math.min() 返回零个或更多个数值的最小值。
复制代码

Math.sqrt() 函数返回一个数的平方根

例子:

Math.sqrt(9); // 3
Math.sqrt(2); // 1.414213562373095
Math.sqrt(1);  // 1
Math.sqrt(0);  // 0
Math.sqrt(-1); // NaN
复制代码

Math.pow(base, exponent) 函数返回基数(base)的指数(exponent)次幂,即 baseexponent。

例子:

function raisePower(x,y) {
   return Math.pow(x,y)
}
复制代码
如果 x 是 2 ,且 y 是 7,则 raisePower 函数返回 128 (2 的 7 次幂)。
复制代码

Math.random() 函数返回一个浮点, 伪随机数在范围[0,1),也就是说,从0(包括0)往上,但是不包括1(排除1),然后您可以缩放到所需的范围。实现将初始种子选择到随机数生成算法;它不能被用户选择或重置。

例子:随机产生一个十六进制(0-9,a-f)的颜色值,封装成一个函数

function randomColor(){
    var str="#";
    var arr=["1","2","3","4","5","6","7","8","9","0","a","b","c","d","e","f"];
    for(var i=0;i<6;i++){
        var num=parseInt(Math.random()*16);
        str+=arr[num];
    }
    return str;
}
var btn = document.getElementById('btn');
var box = document.getElementsByClassName('box')[0];
btn.onclick=function(){
    var result= randomColor();
    box.style.background=result
}
复制代码

说了这么多,可能有些同学还不知道如何遍历对象:

for (var key in 对象){
    //key为键,即属性名
    //obj[key]就可以拿到每个属性的值啦
}
复制代码

Date:

语法:

  • new Date();
  • new Date(value);
  • new Date(dateString);
  • new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]]);

注意:只能将 Date 作为构造函数调用,才能实例化(instantiate) Date 对象:若将它作为常规函数调用(即不加 new 操作符),则将会返回一个字符串,而非 Date 对象。另外,不像其他的 JavaScript 对象类型,Date 对象没有字面量语法(literal syntax)。

方法:

  • Date.parse() 解析一个表示日期的字符串,并返回从 1970-1-1 00:00:00 所经过的毫秒数。

  • get​Full​Year() 返回指定日期的年份

  • get​Month() 返回指定日期的月份(0表示一年中的第一月)。

  • getDate() 返回一个指定的日期对象为一个月中的哪一日(从1--31)

  • getDay() 返回一个具体日期中一周的第几天,0 表示星期天

  • getHours() 方法根据本地时间,返回一个指定的日期对象的小时

  • getMinutes() 方法根据本地时间,返回一个指定的日期对象的分钟数

  • getSeconds() 方法根据本地时间,返回一个指定的日期对象的秒数

注意:在实际应用中,我们往往是对时间进行格式化

转换格式:

function showTime(){
    var myDate=new Date();
    var year=myDate.getFullYear();
    var month=myDate.getMonth()+1;
    var day=myDate.getDate();
    var week=myDate.getDay();
    var h=myDate.getHours();
    var m=myDate.getMinutes();
    var s=myDate.getSeconds();
    var weekday=[];
    weekday[0]="星期日";
    weekday[1]="星期一";
    weekday[2]="星期二";
    weekday[3]="星期三";
    weekday[4]="星期四";
    weekday[5]="星期五";
    weekday[6]="星期六";
    month=month<10?'0'+month:month;
    day=day<10?'0'+day:day;
    h=h<10?'0'+h:h;
    m=m<10?'0'+m:m;
    s=s<10?'0'+s:s;
    return year+'-'+month+'-'+day+' '+h+':'+m+':'+s+' 今天是'+weekday[week];
}
var result1=showTime();
console.log(result1)    //2019-05-06 19:25:44 今天是星期一
复制代码

将20190506103921 -> 2019-05-06 10:39:21

var str="20190505142935";
var newStr=str.slice(0,4)+'-'+str.slice(4,6)+'-'+str.slice(6,8)+' '+str.slice(8,10)+':'+str.slice(10,12)+':'+str.slice(12,14);
console.log(newStr);    //2019-05-06 10:39:21
复制代码

总结:万变不离其宗,需要转换转换即可~

String对象:

是一个用于字符串或一个字符序列的构造函数

注意:以下两点是有区别的

  • string ----> 字符串类型 ----> 基本类型
  • String ----> 字符串类型 ----> 引用类型

var str="hello";
for(var i=0;i<str.length;i++){
    console.log(str[i]);   //h e l l o
}
复制代码

注意:字符串可以看成是一个字符数组,可以用循环来遍历

字符串有一个特性:不可变性

var str="hello";
str[1]="q";
console.log(str)   //hello
复制代码

注意:字符串可以通过索引访问字符串中的某个值,但是,是可以访问,只读,不可以改变

var str="梦云";
str="秀秀";
console.log(str)   //秀秀
复制代码

注意:字符串的值之所以看起来改变了,那是因为指向改变了,并不是真的值改变了

字符串的常用属性:

  • .length —— 字符串的长度
  • .charAt(索引) —— 从一个字符串中返回指定的字符
  • .fromCharCode() —— 返回由指定的UTF-16代码单元序列创建的字符串
  • .concat() —— 将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回
  • .indexOf(要找的字符串,从某个位置开始的索引) 返回调指定值的第一次出现的索引; 如果没有找到 返回-1。
  • lastIndexOf() 方法返回指定值在调用该方法的字符串中最后出现的位置,如果没找到则返回 -1。
  • replace() 返回一个由替换值(replacement)替换一些或所有匹配的模式(pattern)后的新字符串。模式可以是一个字符串或者一个正则表达式,替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。原字符串不会改变。
  • slice() 提取一个字符串的一部分,并返回一新的字符串。
  • split() 方法使用指定的分隔符字符串将一个String对象分割成字符串数组,以将字符串分隔为子字符串,以确定每个拆分的位置。
  • substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。
  • substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。

str.length:

var str="hello";
console.log(str.length)     //5
复制代码

str.charAt(index):

index 一个介于0 和字符串长度减1之间的整数。 (0~length-1) 如果没有提供索引,charAt() 将使用0。 如果指定的 index 值超出了该范围,则返回一个空字符串。

var str = "Brave new world";
console.log(str.charAt(0));     //B
console.log(str.charAt(1));     //r
console.log(str.charAt(2));     //a
console.log(str.charAt(3));     //v
console.log(str.charAt(4));     //e
console.log(str.charAt(999));   //空
复制代码

String.fromCharCode(num1, ..., numN):

该方法返回一个字符串,而不是一个 String 对象。

由于 fromCharCode() 是 String 的静态方法,所以应该像这样使用:String.fromCharCode(),而不是作为你创建的 String 对象的方法。

String.fromCharCode(65, 66, 67);  // returns "ABC"
String.fromCharCode(0x2014)       // returns "—"
String.fromCharCode(0x12014)      // also returns "—"; the digit 1 is truncated and ignored

复制代码

str.concat(string2, string3[, ..., stringN]):

concat 方法将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。注意, concat 方法并不影响原字符串。

var str = "Hello, ";
console.log(str.concat("Kevin", " have a nice day.")); // Hello, Kevin have a nice day. 
复制代码

str.indexOf(searchValue[, fromIndex])

searchValue:一个字符串表示被查找的值。

fromIndex: 可选。表示调用该方法的字符串中开始查找的位置。可以是任意整数。默认值为 0。如果 fromIndex < 0 则查找整个字符串(如同传进了 0)。如果 fromIndex >= str.length,则该方法返回 -1。

"Blue Whale".indexOf("Blue");     // returns  0
"Blue Whale".indexOf("Blute");    // returns -1
"Blue Whale".indexOf("Whale", 0); // returns  5
"Blue Whale".indexOf("Whale", 5); // returns  5
"Blue Whale".indexOf("", 9);      // returns  9
"Blue Whale".indexOf("", 10);     // returns 10
"Blue Whale".indexOf("", 11);     // returns 10
复制代码

indexOf 方法区分大小写。例如,下面的表达式返回 -1:

"Blue Whale".indexOf("blue") // returns -1
复制代码

当检测某个字符串是否存在于另一个字符串中时,可使用下面的方法:

"Blue Whale".indexOf("Blue") !== -1; // true
"Blue Whale".indexOf("Bloe") !== -1; // false
复制代码

使用 indexOf 统计一个字符串中某个字母出现的次数:

var str="hejje jhaidf dfei";
var count =0;
var pos=str.indexOf('e');
while(pos!=-1){
    count++;
    pos=str.indexOf('e',pos+1)
}
console.log(count);             //3
复制代码
案例:找出o出现的位置???
var str="hello world";
var pos=str.indexOf('o');
while(pos!=-1){
    console.log(pos);       //4,7
    pos=str.indexOf('o',pos+1)
}
复制代码

str.lastIndexOf(searchValue[, fromIndex])

"canal".lastIndexOf("a")   // returns 3
"canal".lastIndexOf("a",2) // returns 1
"canal".lastIndexOf("a",0) // returns -1
"canal".lastIndexOf("x")   // returns -1
复制代码

使用indexOf() 和 lastIndexOf()的区别:

var anyString = "Brave new world";

console.log("The index of the first w from the beginning is " + anyString.indexOf("w"));
// logs 8
console.log("The index of the first w from the end is " + anyString.lastIndexOf("w")); 
// logs 10

console.log("The index of 'new' from the beginning is " + anyString.indexOf("new"));   
// logs 6
console.log("The index of 'new' from the end is " + anyString.lastIndexOf("new"));
// logs 6
复制代码

str.replace(旧的,新的)

该方法并不改变调用它的字符串本身,而只是返回一个新的替换后的字符串。

在进行全局的搜索替换时,正则表达式需包含 g 标志。

var str = 'Twas the night before Xmas...';
var newstr = str.replace(/xmas/i, 'Christmas');
console.log(newstr);  // Twas the night before Christmas...
复制代码
var re = /apples/gi;
var str = "Apples are round, and apples are juicy.";
var newstr = str.replace(re, "oranges");

// oranges are round, and oranges are juicy.
console.log(newstr);
复制代码

str.slice(开始索引,结束索引)

slice() 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说,slice 不修改原字符串,只会返回一个包含了原字符串中部分字符的新字符串。

开始索引:

从该索引(以 0 为基数)处开始提取原字符串中的字符。如果值为负数,会被当做 sourceLength + beginSlice 看待,这里的sourceLength 是字符串的长度 (例如, 如果beginSlice 是 -3 则看作是: sourceLength - 3)

结束索引:

可选。在该索引(以 0 为基数)处结束提取字符串。如果省略该参数,slice会一直提取到字符串末尾。如果该参数为负数,则被看作是 sourceLength + endSlice,这里的 sourceLength 就是字符串的长度(例如,如果 endSlice 是 -3,则是, sourceLength - 3)。

var str="hello world";
str=str.slice(2,7);
console.log(str);     //llo w
复制代码
var str="hello world";
str=str.slice(2,-2);
console.log(str);     //llo wor  (相当于是slice(2,11+(-2))
复制代码
var str="hello world";
str=str.slice(-2);
console.log(str);           //ld
复制代码

注意:从开始索引位置开始提取,到结束索引前一个结束,不包含结束索引,并返回这个提取后的字符串

str.split("分隔符",切割后留下的个数)

找到分隔符后,将其从字符串中删除,并将子字符串的数组返回。如果没有找到或者省略了分隔符,则该数组包含一个由整个字符串组成的元素。如果分隔符为空字符串,则将str转换为字符数组。如果分隔符出现在字符串的开始或结尾,或两者都分开,分别以空字符串开头,结尾或两者开始和结束。因此,如果字符串仅由一个分隔符实例组成,则该数组由两个空字符串组成。

如果分隔符是包含捕获括号的正则表达式,则每次分隔符匹配时,捕获括号的结果(包括任何未定义的结果)将被拼接到输出数组中。但是,并不是所有浏览器都支持此功能。

var myString = "Hello World. How are you doing?";
var splits = myString.split(" ", 3);

console.log(splits);    //["Hello", "World.", "How"]
复制代码

Tip: 如果空字符串("")被用作分隔符,则字符串会在每个字符之间分割。

str.substr(开始的索引,个数)

start 是一个字符的索引。首字符的索引为 0,最后一个字符的索引为 字符串的长度减去1。substr 从 start 位置开始提取字符,提取 length 个字符(或直到字符串的末尾)。

var str = "abcdefghij";

console.log("(1,2): "    + str.substr(1,2));   // (1,2): bc
console.log("(-3,2): "   + str.substr(-3,2));  // (-3,2): hi
console.log("(-3): "     + str.substr(-3));    // (-3): hij
console.log("(1): "      + str.substr(1));     // (1): bcdefghij
console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
console.log("(20, 2): "  + str.substr(20,2));  // (20, 2):
复制代码

str.substring(开始索引,结束索引)

substring 提取从 indexStart 到 indexEnd(不包括)之间的字符。特别地:

如果 indexStart 等于 indexEnd,substring 返回一个空字符串。 如果省略 indexEnd,substring 提取字符一直到字符串末尾。 如果任一参数小于 0 或为 NaN,则被当作 0。 如果任一参数大于 stringName.length,则被当作 stringName.length。 如果 indexStart 大于 indexEnd,则 substring 的执行效果就像两个参数调换了一样。

var anyString = "Mozilla";

// 输出 "Moz"
console.log(anyString.substring(0,3));
console.log(anyString.substring(3,0));
console.log(anyString.substring(3,-3));
console.log(anyString.substring(3,NaN));
console.log(anyString.substring(-2,3));
console.log(anyString.substring(NaN,3));

// 输出 "lla"
console.log(anyString.substring(4,7));
console.log(anyString.substring(7,4));

// 输出 ""
console.log(anyString.substring(4,4));

// 输出 "Mozill"
console.log(anyString.substring(0,6));

// 输出 "Mozilla"
console.log(anyString.substring(0,7));
console.log(anyString.substring(0,10));
复制代码

Tip: 到此,我想大家会发现,slice()与substring()是几乎一样的,前提是括号里面的索引都是正值,若是负数,则有差别,用法不一样,具体看上面。

var str="hello world";
str=str.slice(2,7);
console.log(str);     //llo w

var str1="hello world";
str1=str1.substring(2,7);
console.log(str1);     //llo w
复制代码

案例:找到这个字符串中每个字母出现了多少次??

var str="helloworld";
var obj={};//创建一个空对象,目的:把字母作为键,次数作为值
for(var i=0;i<str.length;i++){
    var key=str[i];
    if(obj[key]){
        obj[key]++
    }else{
        obj[key]=1;
    }
}
for(key in obj){
    console.log(key+'出现了'+obj[key]+'次')
}


结果:
    h出现了1次
    e出现了1次
    l出现了3次
    o出现了2次
    w出现了1次
    r出现了1次
    d出现了1次
复制代码

Array:

js的Array对象是用于构造数组的全局对象,数组是类似于列表的高阶对象。

那么,我们需要知道创建数组有两种方式:

  • 构造函数的方式 var arr=new Array()
  • 字面量的方式 var arr=[]

验证变量是不是数组类型也有两种方式:

  • instanceof关键字
  • Array.isArray(对象) 用于确定传递的值是否是一个 Array。
var arr=[];
console.log(arr instanceof Array)    //true
复制代码
Array.isArray([1, 2, 3]);  
// true
Array.isArray({foo: 123}); 
// false
Array.isArray("foobar");   
// false
Array.isArray(undefined);  
// false
复制代码

Array.isArray(obj)

// 下面的函数调用都返回 true
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
// 鲜为人知的事实:其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype); 

// 下面的函数调用都返回 false
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray({ __proto__: Array.prototype });
复制代码

concat()

方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组

语法:var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])

concat方法创建一个新的数组,它由被调用的对象中的元素组成,每个参数的顺序依次是该参数的元素(如果参数是数组)或参数本身(如果参数不是数组)。它不会递归到嵌套数组参数中。

concat方法不会改变this或任何作为参数提供的数组,而是返回一个浅拷贝,它包含与原始数组相结合的相同元素的副本。 原始数组的元素将复制到新数组中,如下所示:

对象引用(而不是实际对象):concat将对象引用复制到新数组中。 原始数组和新数组都引用相同的对象。 也就是说,如果引用的对象被修改,则更改对于新数组和原始数组都是可见的。 这包括也是数组的数组参数的元素。 数据类型如字符串,数字和布尔(不是String,Number 和 Boolean 对象):concat将字符串和数字的值复制到新数组中。

连接两个数组:

var alpha = ['a', 'b', 'c'];
var numeric = [1, 2, 3];

alpha.concat(numeric);
// result in ['a', 'b', 'c', 1, 2, 3]
复制代码

连接三个数组

var num1 = [1, 2, 3],
    num2 = [4, 5, 6],
    num3 = [7, 8, 9];

var nums = num1.concat(num2, num3);

console.log(nums); 
// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
复制代码

将值连接到数组

var alpha = ['a', 'b', 'c'];

var alphaNumeric = alpha.concat(1, [2, 3]);

console.log(alphaNumeric); 
// results in ['a', 'b', 'c', 1, 2, 3]
复制代码

合并嵌套数组

var num1 = [[1]];
var num2 = [2, [3]];

var nums = num1.concat(num2);

console.log(nums);
// results in [[1], 2, [3]]

// modify the first element of num1
num1[0].push(4);

console.log(nums);
// results in [[1, 4], 2, [3]]
复制代码

every(函数)

测试数组的所有元素是否都通过了指定函数的测试。

返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值,第二个参数是索引值,第三个值是原来的数组(没用),如果这个数组中的每个元素的值都符合条件,最后才返回的是true。

下例检测数组中的所有元素是否都大于 10???

function isBigEnough(element, index, array) {
  return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true
复制代码

filter(函数)

返回的是数组中每一个元素都符合条件的元素,组成了一个新的数组

var arr=[10,20,30,40,50,60];
var newArr=arr.filter(function(el,index){
    return el>30;
})
console.log(newArr);        //[40, 50, 60]


去掉数组中的0,然后组成一个新数组???

var arr=[10,20,2,0,20,0,0,45,3,0,5,0,0,2,1];
var newArr=arr.filter(function(el){
    return el!==0;
})
console.log(newArr);    //[10, 20, 2, 20, 45, 3, 5, 2, 1]
复制代码

接下来的方法特别重要!!!!!

  • .push(值) 把值追加到数组中,加到最后了,返回值是追加后的数组长度
  • .pop() 删除数组中最后一个元素,返回值就是删除的这个值
  • .shift() 删除数组中第一个元素,返回值就是删除的这个值
  • .unshift() 向数组的第一个元素前面插入一个新的元素,返回值是追加后的数组长度
  • .forEach(函数)方法 遍历数组用,相当于for循环
  • .indexOf(元素值);返回的是索引,没有则是-1
  • .join("字符串");返回的是一个字符串
  • .map(函数);数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
  • .reverse();反转数组
  • .sort();排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
  • .slice(开始索引,结束索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值(这是一个浅拷贝,原数组不会改变)
  • .splice(开始的位置,要删除的个数,替换的元素的值);一般用于删除数组中的元素,或者是替换元素,或者是插入元素

push例子

var sports = ["soccer", "baseball"];
var total = sports.push("football", "swimming");

console.log(sports); 
// ["soccer", "baseball", "football", "swimming"]

console.log(total);  
// 4
复制代码

合并两个数组

该示例使用 apply() 添加第二个数组的所有元素。

var vegetables = ['parsnip', 'potato'];
var moreVegs = ['celery', 'beetroot'];

// 将第二个数组融合进第一个数组
// 相当于 vegetables.push('celery', 'beetroot');
Array.prototype.push.apply(vegetables, moreVegs);

console.log(vegetables); 
// ['parsnip', 'potato', 'celery', 'beetroot']
复制代码

pop例子

let myFish = ["angel", "clown", "mandarin", "surgeon"];

let popped = myFish.pop();

console.log(myFish); 
// ["angel", "clown", "mandarin"]

console.log(popped); 
// surgeon
复制代码

shift例子

var arr=[1,2,3,4];
var result=arr.shift();
console.log(arr);       //[2,3,4]
console.log(result)     //1
复制代码

unshift例子

let arr = [4,5,6];
var s=arr.unshift(1,2,3);
console.log(s);     //6
console.log(arr);   // [1, 2, 3, 4, 5, 6]

复制代码

forEach例子——for 循环转换为 forEach

const items = ['item1', 'item2', 'item3'];
const copy = [];

// before
for (let i=0; i<items.length; i++) {
  copy.push(items[i]);
}

// after
items.forEach(function(item){
  copy.push(item);
});
复制代码

indexOf例子

var array = [2, 5, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0
复制代码

join例子

使用四种不同的分隔符连接数组元素

var a = ['Wind', 'Rain', 'Fire'];
var myVar1 = a.join();      // myVar1的值变为"Wind,Rain,Fire"
var myVar2 = a.join(', ');  // myVar2的值变为"Wind, Rain, Fire"
var myVar3 = a.join(' + '); // myVar3的值变为"Wind + Rain + Fire"
var myVar4 = a.join('');    // myVar4的值变为"WindRainFire"
复制代码

map例子

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]
复制代码
使用 map 重新格式化数组中的对象

var kvArray = [{key: 1, value: 10}, 
               {key: 2, value: 20}, 
               {key: 3, value: 30}];

var reformattedArray = kvArray.map(function(obj) { 
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});

// reformattedArray 数组为: [{1: 10}, {2: 20}, {3: 30}], 

// kvArray 数组未被修改: 
// [{key: 1, value: 10}, 
//  {key: 2, value: 20}, 
//  {key: 3, value: 30}]
复制代码

sort例子

注意:sort不稳定,要想稳定,加以下代码

var arr=[1,3,2,5,6];
//a----arr[j]
//b----arr[j+1]

arr.sort((a,b)=>{
    if(a>b){
        return 1;
    }else if(a==b){
        return 0;
    }else{
        return -1;
    }
  }
)
console.log(arr)    //[1, 2, 3, 5, 6]
复制代码
var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return b - a;
});
console.log(numbers);       //[5, 4, 3, 2, 1]


var numbers = [4, 2, 5, 1, 3]; 
numbers.sort((a, b) => a - b); 
console.log(numbers);

// [1, 2, 3, 4, 5]
复制代码

slice例子

var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
var citrus = fruits.slice(1, 3);

// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus contains ['Orange','Lemon']
复制代码

splice例子

从第 2 位开始删除 0 个元素,插入“drum”

var myFish = ["angel", "clown", "mandarin", "sturgeon"];
var removed = myFish.splice(2, 0, "drum");

// 运算后的 myFish: ["angel", "clown", "drum", "mandarin", "sturgeon"]
// 被删除的元素: [], 没有元素被删除



从第 3 位开始删除 1 个元素

var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
var removed = myFish.splice(3, 1);

// 运算后的 myFish: ["angel", "clown", "drum", "sturgeon"]
// 被删除的元素: ["mandarin"]


从第 2 位开始删除 1 个元素,插入“trumpet”

var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
var removed = myFish.splice(2, 1, "trumpet");

// 运算后的 myFish: ["angel", "clown", "trumpet", "sturgeon"]
// 被删除的元素: ["drum"]

复制代码

练习题1:将一个字符串数组输出 小敏|小红|娜娜 这种格式,用两种不同的方式


var arr=["小敏","小红","娜娜","秀秀"];
var str=arr.join("|");      
console.log(str);       //小敏|小红|娜娜|秀秀



var arr=["小敏","小红","娜娜","秀秀"];
var str="";
for(var i=0;i<arr.length-1;i++){
    str+=arr[i]+"|"
}
console.log(str+arr[arr.length-1])    //小敏|小红|娜娜|秀秀
复制代码

练习题2:将一个字符串数组的元素的顺序进行反转(用两种不同的方式)

var arr=["how","are","you","i","am","fine","and","you"];
var newArr=arr.reverse();
console.log(newArr);        //["you", "and", "fine", "am", "i", "you", "are", "how"]


for(var i=0;i<arr.length;i++){
    var t;
    t=arr[i];
    arr[i]=arr[arr.length-i-1];
    arr[arr.length-i-1]=t;
}
console.log(arr);       //["you", "and", "fine", "am", "i", "you", "are", "how"] 
复制代码

练习题3:工资的数组[1500,1200,2000,2100,1800],把工资超过2000的删除

var arr=[1500,1200,2000,2100,1800];
var newArr=arr.filter(function(el){
    return el<=2000
})
console.log(newArr)     //[1500, 1200, 2000, 1800]
复制代码

练习题4:["c","a","z","a","x","a"]找到数组中每一个a出现的位置

var arr=["c","a","z","a","x","a"];
var index=arr.indexOf('a');
while(index!=-1){
    console.log(index);         //1   3   5
    index=arr.indexOf('a',index+1);
}
复制代码

基本包装类型:

本身是基本类型,但是在执行代码的过程中,如果这种类型的变量调用了属性或者方法,那么这种类型就不再是基本类型了,而是包装类型,这个变量也不是普通的变量了,而是基本包装类型对象

有三种:string number boolean

var str="hello";
str=str.replace("ll","KK");
console.log(str)  //heKKo
复制代码
var flag=new Boolean(false);
var result=true&&flag;
console.log(result);    //true

但是这里要注意了:
如果是一个对象&&true,那么结果是true
如果是一个true&&对象,那么结果是对象
复制代码
var num =10;
var num2=Number("10");      //转换,但是没有new,还是普通类型
var num3=new Number("10");      //基本包装类型
复制代码

总结:活学活用!虽然方法真的很多,常用就会记得啦,所以小伙伴门不用太担心啦!

转载于:https://juejin.im/post/5ccfa8426fb9a032060c3ac9

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值