JS知识梳理1

发布于:2023-01-04 ⋅ 阅读:(303) ⋅ 点赞:(0)

1.object.assign

        object.assign()方法用于将所有可枚举的属性的值从一个或多个源对象分配到目标对象。(将两个对象合并)

        语法:object.assign(target,...sources)(目标对象,...源对象)

        特点:对于object.assign()而言,如果对象的属性值为简单类型,通过object.assign({},srcobj);得到的新对象为深拷贝;如果属性自为对象或其他引用类型,那对于这个对象而言其实是浅拷贝。

 2.find()

        定义用法:

        find()方法返回通过测试(函数内判断)的数组的第一个元素的

        find()方法为数组中每个元素都调用一次函数执行

        ①当数组中的元素在测试条件时返回true时,find()返回符合条件的元素,之后的值不会再调用执行函数

        ②如果没有符合条件的元素返回undefined。

        注意:

        find()对于空数组,函数是不会执行的

        find()并没有改变数组的原始值

        语法:array.find(function(currentValue,index,arr),thisValue)

        currentValue——当前元素

        index——当前元素的索引值

        arr——当前元素所属的数组对象

        thisValue——可选,传递给函数的值一般用“this”值

                              如果这个参数为空,“undefined”会传递给“this”值

        返回值:返回符合测试条件的第一个数组元素值,如果没有符合条件的则返回undefined。

3.replace/replaceAll

        replaceAll() 方法使用给定的参数 replacement 替换字符串所有匹配给定的正则表达式的子字符串。

        语法:public String replaceAll(String regex, String replacement)

        参数:

        regex -- 匹配此字符串的正则表达式。

        replacement -- 用来替换每个匹配项的字符串。

        返回值:成功则返回替换的字符串,失败则返回原始字符串。

        实例:

public class Test {
    public static void main(String args[]) {
        String Str = new String("www.google.com");
        System.out.print("匹配成功返回值 :" );
        System.out.println(Str.replaceAll("(.*)google(.*)""runoob" ));
        System.out.print("匹配失败返回值 :" );
        System.out.println(Str.replaceAll("(.*)taobao(.*)""runoob" ));
    }
}

        匹配成功返回值 :runoob

        匹配失败返回值 :www.google.com

4.some()

        定义和用法:

        some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

        some() 方法会依次执行数组的每个元素:

        如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。

如果没有满足条件的元素,则返回false。

        注意: some() 不会对空数组进行检测。

        注意: some() 不会改变原始数组。

        语法:

array.some(function(currentValue,index,arr),thisValue)

        返回值: 布尔值。如果数组中有元素满足条件返回 true,否则返回 false。

        实例:<p>最小年龄: <input type="number" id="ageToCheck" value="18"></p>

<button οnclick="myFunction()">点我</button>

<p>判断结果: <span id="demo"></span></p>

<script>

var ages = [4, 12, 16, 20];

function checkAdult(age) {

    return age >= document.getElementById("ageToCheck").value;

}

function myFunction() {

    document.getElementById("demo").innerHTML = ages.some(checkAdult);

}

</script>

5.every()

        定义和用法

        every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。

        every() 方法使用指定函数检测数组中的所有元素:

        如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。

        如果所有元素都满足条件,则返回 true。

        注意: every() 不会对空数组进行检测。

        注意: every() 不会改变原始数组。

        语法:

array.every(function(currentValue,index,arr), thisValue)

        返回值: 布尔值。如果所有元素都通过检测返回 true,否则返回 false。

        实例:

        检测数组 ages 的所有元素是否都大于等于输入框中指定的数字:

<p>最小年龄: <input type="number" id="ageToCheck" value="18"></p>

<button οnclick="myFunction()">点我</button>

<p>是否所有年龄都符号条件? <span id="demo"></span></p>

<script>

var ages = [32, 33, 12, 40];

function checkAdult(age) {

    return age >= document.getElementById("ageToCheck").value;

}

function myFunction() {

    document.getElementById("demo").innerHTML = ages.every(checkAdult);

}

</script>

6.sort:从大到小排序;从小到大排序

        定义和用法

        sort() 方法用于对数组的元素进行排序。

        排序顺序可以是字母或数字,并按升序或降序。

默认排序顺序为按字母升序。

        数字排序(数字和升序):

var points = [40,100,1,5,25,10];

points.sort(function(a,b){return a-b});

        数字排序(数字和降序):

var points = [40,100,1,5,25,10];

points.sort(function(a,b){return b-a});

7.lastIndexOf  顺序问题

        lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,如果指定第二个参数 start,则在一个字符串中的指定位置从后向前搜索。

语法

        string.lastIndexOf(searchvalue,start)

        searchvalue    必需。规定需检索的字符串值。

        start  可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。

        返回值:(Number)查找的字符串最后出现的位置,如果没有找到匹配字符串则返回 -1

8.substring和substr的区别

        substr和substring 的共同之处就是都是用来获取字符串的子字符串

        substr(start,length),其中start是必选,length是可选

        substring(start,end)(得到的子字符串不包含end位置的字符)

        start是必选,end是可选

        当只有一个参数时

        如果substr和substring都是只有一个参数时,都是从start下标的位置到字符串的结尾

字符串的第一个索引都是0

const string ="hello kerry"

str1= string.substr(1)

str2=string.substring(1)

        此时得到的运算结果是一样的,substr和substring没有区别

当有两个参数时

const string = "hello kerry";

str1 = string.substr(1,5);        子字符串的length=5

str2 = string.substring(1,5);        子字符串长度为4,不包括index=5的字符

当有两个参数时,substr和substring就有区别了

9.转为首字母小写其他字母大写;首字母大写其他字母小写

        首字母大写其余小写:(另一个可参考操作)

        一些大小写不规则的字符串,如"JAMES"、“alice”、"Amy"等,如何将他们统一的变成首字母大写其余小写的形式

        首先是将字符串中所有字字符变成小写,然后提取首字符变成大写,然后再拼接后面的字符。

var name = "JAMES";

将所有字符变成小写

name = name.toLowerCase();

提取首字母转换为大写并与其余的字母拼接起来(3种方法)

var name = name.charAt(0).toUpperCase() + name.slice(1);

var name = name.slice(0,1).toUpperCase() + name.slice(1);

var name = name.subString(0,1).toUpperCase() + name.subString(1);

10.哪些API会改变原数组,哪些不会?

        会改变原来数组

        1 添加元素类:(返回新添加的字符)

push() 把元素添加到数组尾部

unshift() 在数组头部添加元素

let arr=[1,2,3,4,5]

let arrOne=arr.push(6)

console.log(arrOne);

        2 删除元素类:(返回的是被删除的元素)

pop() 移除数组最后一个元素

shift() 删除数组第一个元素

let arr=[1,2,3,4,5]

let arrOne=arr.pop()

console.log(arrOne);

        3 颠倒顺序:

reverse() 在原数组中颠倒元素的顺序

let arr=[1,2,3,4,5]

let arrOne=arr.reverse()

console.log(arrOne);

        4 插入、删除、替换数组元素:(返回被删除的数组)

splice(index, howmany, item1…intemx)

index代表要操作数组位置的索引值,必填

howmany 代表要删除元素的个数,必须是数字,可以是0,如果没填就是删除从index到数组的结尾

item1…intemx 代表要添加到数组中的新值

1)

let arr=[1,2,3,4,5]

let arrOne=arr.splice(0,3)

console.log(arrOne);

console.log(arr);

2)

let arr=[1,2,3,4,5]

let arrOne=arr.splice(0,3,"9","10","J","Q")

console.log(arrOne);

console.log(arr);

5 排序

sort() 对数组元素进行排序

let arr=[1,2,3,4,5]

let arrOne=arr.sort()

console.log(arrOne);

console.log(arr);

        不会改变原来数组

        concat()

连接两个或更多数组,返回结果

将两个数组合并成一个数组

let a = [1,2,3]

let b = [4,5,6]

let c= a.concat(b)         [1,2,3,4,5,6]

和push区别

let d = a.push(b)          [1,2,3,[4,5,6]]

        every()

检测数组中每个元素是否都符合要求

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

let flag = arr.every((value, index, array) => {

       return value > 3;

});

console.log(flag);          false

        some()

检测数组中是否有元素符合要求

let arr = [10, 30, 4];

let flag = arr.some((value, index, array) => {

       return value < 3;

});

console.log(flag); // false 返回值是布尔值,只要查找到满足条件的一个元素就立马终止循环

        filter()

挑选数组中符合条件的并返回符合要求的数组

let arr = [12, 66, 4, 88, 3, 7];

let res = arr.filter((value, index, array) => {

       参数一是:数组元素

       参数二是:数组元素的索引

        参数三是:当前的数组

       return value >= 20;

});

console.log(res); // [66,88] 返回值是一个新数组

        join()

把数组的所有元素放到一个字符串

join() 方法用于把数组中的所有元素放入一个字符串。

let a = [1,2,3]

let b = a.jion('-')        '1-2-3'

let c = a.join()          '123'

        toString()

把数组转成字符串

        slice()

截取一段数组,返回新数组

参数一:开始截取的下标位置

参数二:结束截取下标位置,但是不会截取到该位置上的值

slice()方法是可以操作字符串,也可以操作数组,splice是不可以操作字符串,只能操作数组

        indexOf

搜索数组中的元素,并返回他所在的位置

11.Object.keys()          object.values()

        Object.keys()

        Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致。

        语法:

Object.keys(obj)

        参数:obj  要返回其枚举自身属性的对象。

        返回值:一个表示给定对象的所有可枚举属性的字符串数组。

        描述:Object.keys 返回一个所有元素为字符串的数组,其元素来自于从给定的 object 上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。

        例子:

simple array

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

console.log(Object.keys(arr)); // console: ['0', '1', '2']

array like object

var obj = { 0: 'a', 1: 'b', 2: 'c' };

console.log(Object.keys(obj)); // console: ['0', '1', '2']

array like object with random key ordering

var anObj = { 100: 'a', 2: 'b', 7: 'c' };

console.log(Object.keys(anObj)); // console: ['2', '7', '100']

 getFoo is a property which isn't enumerable

var myObj = Object.create({}, {

  getFoo: {

    value: function () { return this.foo; }

  }

});

myObj.foo = 1;

console.log(Object.keys(myObj)); // console: ['foo']

        Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组,值的顺序与使用for...in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

        语法:

Object.values(obj)

        参数:obj    被返回可枚举属性值的对象。

        返回值:一个包含对象自身的所有可枚举属性值的数组。

        描述:Object.values()返回一个数组,其元素是在对象上找到的可枚举属性值。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。

        示例

var obj = { foo: 'bar', baz: 42 };

console.log(Object.values(obj));          ['bar', 42]

array like object

var obj = { 0: 'a', 1: 'b', 2: 'c' };

console.log(Object.values(obj)); // ['a', 'b', 'c']

array like object with random key ordering

when we use numeric keys, the value returned in a numerical order according to the keys

var an_obj = { 100: 'a', 2: 'b', 7: 'c' };

console.log(Object.values(an_obj));          ['b', 'c', 'a']

 getFoo is property which isn't enumerable

var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });

my_obj.foo = 'bar';

console.log(Object.values(my_obj));         ['bar']

non-object argument will be coerced to an object

console.log(Object.values('foo'));         ['f', 'o', 'o']

如果要 Object.values兼容不支持它的旧环境,可在 tc39/proposal-object-values-entries 或 es-shims/Object.values 中找到 Polyfill 。

根据**Object.keys()**的 Polyfill 仿写一个:

if (!Object.values) Object.values = function(obj) {

    if (obj !== Object(obj))

        throw new TypeError('Object.values called on a non-object');

    var val=[],key;

    for (key in obj) {

        if (Object.prototype.hasOwnProperty.call(obj,key)) {

            val.push(obj[key]);

        }

    }

    return val;

}

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到