javascript常用方法

[Mr-jili]

javascript常用方法

数组常用方法

• concat 拼接数组
• foreach 循环数组
• includes 判断一个数组是否包含一个指定的值
• pop 删除数组的最后一个元素返回删除的元素
• push 向末尾添加一个元素
• reduce 将数组元素计算为一个值
• reverse 反转数组
• shift 删除第一个元素并返回数组的第一个元素
• unshift 删除最后元素并返回数组的最后元素
• slice 选取数组的一部分，返回一个新数组 *

new Array(1,2,3,4,5).slice(1,5)  => 2,3,4,5 

• map 处理数组的每个元素，返回处理后的数组

// 反转数组 类似reverse
var arr = new Array(1,2,3,4,5,6)
[...arr].map(arr.pop,arr)

• some 查看数组中是否有元素符合条件

new Array(1,2,3,4,5).some(item => {
	return item > 4
})
// true

• sort 排序(单独只对个位数有用)

//由小到大
new Array(22,555,444,1111,478).sort((a, b) => {
	return a - b
})

• splice 从数组中添加或删除元素

// splice与slice区别
array.slice（start,end） 1.可以从数组中提取指定元素  2.该方法不会改变元素数组，而是将截取的元素封装到一个新数组返回 3.类似于substring
var arr = [3,4,5,6,7]
arr.slice(1,-2)  => 4，5   -2代指倒数第二个，从0算起

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
// 第一参数截取初始位置
// 第二参数截取元素个数
// 在删除位置参数的元素
1.可用于删除数组 2.影响原数组，返回删除的元素	
var arr = [3,4,5,6]
arr.splice(0,1,34,56)
console.log(arr) //=> 34,56,4,5,6 

arr.splice(2,0,55)
console.log(arr) //=> 3,4,55,5,6

String常用方法

• String.prototype.charAt() 返回特定位置的字符

'cat'.charAt(1) //=>a

• charCodeAt() 返回表示给定索引的字符的Unicode的值

'cat'.charCodeAt(1) //=>97

• concat
• includes 是否包含

'cat'.includes('t')  //=> true

• indexOf/lastIndexOf 从字符串对象中返回首个/最后被发现的给定值的索引值，如果没有找到则返回-1。

'catccc'.indexOf('c') //=> 0
'cataaa'.indexOf('b') //=>-1
'cataaa'.lastIndexOf('a') //=>5

• repeat 返回指定重复次数的由元素组成的字符串对象

'a'.repeat(4) //=>'aaaa'

• toLowerCase/toUpperCase

'AA'.toLowerCase() //=>'aa'
'aa'.toUpperCase() //=>'AA'

• replace 替换

'ccbb aa'.replace(/aa/,'bb') //=> 'ccbb bb'

• toString null与undefinded不能转换

Object常用方法

• Object.assign(target,source) 通过复制一个或多个对象来创建一个新的对象 不兼容IE,实行的是浅拷贝

const source1 = {a: 1, b: 2}
const source2 = {b: 3, c: 2}
Object.assign(source1, source2) //=> {a: 1, b: 3, c: 2}
//特殊情况
Object.assign({a: 1}, undefined) === {a: 1}  //=> true null也一致
Object.assign([1], [4]) //=>[4]
//浅拷贝
const obj1 = {a: {b: 1}};
const obj2 = Object.assign({}, obj1);
obj1.a.b = 2
obj2.a.b //=> 2 

• Object.create() 使用指定的原型对象和属性创建一个新对象。

//创建一个可写的,可枚举的,可配置的属性p
//第一参数原型对象，第二参数本身实例
const obj2 = Object.create({}, {
  'p': {
    value: 2,       // 属性值
    writable: true,     //  是否可以重写值
    enumerable: true,   //是否可枚举
    configurable: true  //是否可以修改以上几项配置
  },
  'a': {
	value: 3,
	writable: true, 
    enumerable: true,
    configurable: true
  }
});
obj2 //=> {p: 2, a: 3}

• Object.defineProperty() 给对象添加一个属性并指定该属性的配置。
  https://github.com/dreamapplehappy/hacking-with-javascript/blob/master/vanilla-js/object/define-property.md

// Object.defineProperty(obj, prop, descriptor)
/**
 *参数obj表示的是需要定义属性的那个对象
 *参数prop表示需要被定义或者修改的属性名
 *参数descriptor就是我们定义的那个属性prop的描述
 * 
 * 要求就是你要给dreamapple添加一个fullName属性
 * dreamapple的firstName或者lastName发生变化的时候,fullName也要随之变化;而且当我们设置了fullName的值的时候,
 * 那么相应的它的firstName和lastName也随之发生变化; 那么我们应该怎么做呢?
 **/
var dream = {
    firstName: 'dream',
    lastName: 'apple'
}

Object.defineProperty(dream,'fullName',{
    enumerable: true, //是否可枚举
    get () {
        return this.firstName +' '+ this.lastName
    },
    set (fullName) {
        const name =  fullName.trim().split(' ')
        this.firstName = name[0]
        this.lastName = name[1]
    }
})
dream.firstName = 'lala'
dream.lastName = 'haha'
console.log(dream.fullName)

// dream.fullName = 'apple aaaaaadd'
// console.log(dream.firstName,dream.lastName)

• Object.entries() 返回给定对象自身可枚举属性的 [key, value] 数组。

//类似for..in  不兼容  
const obj = { foo: 'bar', baz: 42 }
Object.entries(obj) //=>[ ["foo", "bar"], ["baz", 42] ]

• Object.is(val1,val2) 比较两个值是否相同。所有 NaN 值都相等

Object.is(NaN,NaN)  //=>true
Object.is('1',1)    //=>false

• Object.keys(obj) 遍历可枚举的属性

let arr = ["a", "b", "c"];
let obj = { foo: "bar", baz: 42 };

Object.keys(arr)        // ['0', '1', '2']
Object.keys(obj)        // ["foo","baz"]

• Object.values(obj) 遍历可枚举的属性值

let arr = ["a", "b", "c"];
let obj = { foo: "bar", baz: 42 };

Object.keys(arr)        // ['a', 'b', 'c']
Object.keys(obj)        // ["bar","42 "]

Number常用方法

• isNaN

Number('10a') //=>NaN
isNaN(undefined) //=> true
isNaN(1) //=> false
isNaN == isNaN //=> false

• parseInt 取整，第二个参数为进制（没写的话默认十进制）

parseInt(2.45678); //2
parseInt(10,8) // 8

• parseFloat 取浮点数

parseFloat("010.01aa") //=> 10.01

• toFixed 保留小数位

Math常用方法

• Math.PI 圆周率数值
• Math.floor() 向下取整
• Math.ceil() 向上取整
• Math.pow() 两个参数;次方

Math.pow(2,3) //8  2的3次方

• Math.sqrt() 平方根

Math.sqrt(9) //=> 3
Math.sqrt(-9) //=> NaN

• Math.abs() 取绝对值
• Math.max() 取最大值
• Math.min() 取最小值
• Math.round() 四舍五入
• Math.random() 取0-1之间的随机数

// 取0-10之间的随机数
Math.round(Math.random()*10)