ES607-方法

ES6中的方法

数组方法

forEach遍历数组

    // forEach 迭代(遍历) 数组
    var arr = [1, 2, 3];
    var sum = 0;
    arr.forEach(function(value, index, array) {
        console.log('每个数组元素' + value);
        console.log('每个数组元素的索引号' + index);
        console.log('数组本身' + array);
        sum += value;
    });
    console.log(sum);

filter筛选数组

    // filter 筛选数组
    var arr = [12, 66, 8, 88, 3, 7];
    var newArr = arr.filter(function (value, index) {
        // return value >= 20;
        return value % 2 === 0;
    });
    console.log(newArr); // [12,66,88,8]

some 查找数组中的元素是否存在

• filter 也是查找满足条件的元素 返回的是一个数组 而且是把所有满足条件的元素返回回来
• some 也是查找满足条件的元素是否存在 返回的是一个布尔值 如果查找到第一个满足条件的元素就终止循环

    // some 查找数组中是否有满足条件的元素 
    // var arr = [10, 30, 4];
    // var flag = arr.some(function(value) {
    //     // return value >= 20;
    //     return value < 3;
    // });
    // console.log(flag);
    var arr1 = ['red', 'pink', 'blue'];
    var flag1 = arr1.some(function(value) {
        return value == 'pink';
    });
    console.log(flag1);
    // 1. filter 也是查找满足条件的元素 返回的是一个数组 而且是把所有满足条件的元素返回回来
    // 2. some 也是查找满足条件的元素是否存在  返回的是一个布尔值 如果查找到第一个满足条件的元素就终止循环

Array.from

创建长度为length的数组，下标以key为标准，若对应下标没有元素，则该下标对应的元素为NAN

	var arrayLike = {
		"0": "张三",
		"1": "李四",
		"2": "王五",
		"length": 3
	}

	var ary = Array.from(arrayLike);
	console.log(ary)

	var arrayLike = {
		"0": "1",
		"1": "2",
		"length": 2
	};

	var ary = Array.from(arrayLike, item => item * 2);
	console.log(ary)

find

• find方法找到第一个满足条件的元素，若没有，返回undefined

	var ary = [{
		id: 1,
		name: '张三'
	}, {
		id: 2,
		name: '李四'
	}];
	let target = ary.find(item => item.id == 2);
	console.log(target)

findIndex

• findIndex方法找到第一个满足条件的元素的下标

	let ary = [10, 20, 50];
	let index = ary.findIndex(item => item > 15);
	console.log(index)

include

• include方法判断该元素是否在这个数组中，返回结果的布尔值

	let ary = ["a", "b", "c"];

	let result = ary.includes('a')
	console.log(result)
	result = ary.includes('e')
	console.log(result)

set集合

• add 增加元素
• delete 删除元素
• has 判断元素是否在集合中
• clear 清空集合中的所有元素
• forEach(value => …log(value)) 遍历集合

	// const s1 = new Set();
	// console.log(s1.size)

	// const s2 = new Set(["a", "b"]);
	// console.log(s2.size)

	// const s3 = new Set(["a","a","b","b"]);
	// console.log(s3.size)
	// const ary = [...s3];
	// console.log(ary)
	
	// const s4 = new Set();
	// 向set结构中添加值 使用add方法
	// s4.add('a').add('b');
	// console.log(s4.size)

	// 从set结构中删除值 用到的方法是delete
	// const r1 = s4.delete('c');
	// console.log(s4.size)
	// console.log(r1);

	// 判断某一个值是否是set数据结构中的成员 使用has
	// const r2 = s4.has('d');
	// console.log(r2)

	// 清空set数据结构中的值 使用clear方法
	// s4.clear();
	// console.log(s4.size);
	
	// 遍历set数据结构 从中取值
	const s5 = new Set(['a', 'b', 'c']);
	s5.forEach(value => {
		console.log(value)
	})

字符串方法

trim 去除字符串首尾的空格

" 唱 跳 rap 篮球 ".trim() // "唱 跳 rap 篮球"

正则表达式

正则表达式创建的2种方式

• 利用 RegExp对象来创建 正则表达式 【new RegExp(/123/)】
• 利用字面量创建 正则表达式 【rg = /123/】

    // 1. 利用 RegExp对象来创建 正则表达式
    var regexp = new RegExp(/123/);
    console.log(regexp);

    // 2. 利用字面量创建 正则表达式
    var rg = /123/;
    // 3.test 方法用来检测字符串是否符合正则表达式要求的规范
    console.log(rg.test(123));
    console.log(rg.test('abc'));

startsWith/endsWith

	let str = 'Hello ECMAScript 2015';
	let r1 = str.startsWith('Hello');
	console.log(r1);
	let r2 = str.endsWith('2016');
	console.log(r2)

repeat 重复字符串

console.log("y".repeat(5)) // yyyyy

正则-边界符

    // 边界符 ^ $ 
    var rg = /abc/; // 正则表达式里面不需要加引号 不管是数字型还是字符串型
    // /abc/ 只要包含有abc这个字符串返回的都是true
    console.log(rg.test('abc'));
    console.log(rg.test('abcd'));
    console.log(rg.test('aabcd'));
    console.log('---------------------------');
    var reg = /^abc/;
    console.log(reg.test('abc')); // true
    console.log(reg.test('abcd')); // true
    console.log(reg.test('aabcd')); // false
    console.log('---------------------------');
    var reg1 = /^abc$/; // 精确匹配 要求必须是 abc字符串才符合规范
    console.log(reg1.test('abc')); // true
    console.log(reg1.test('abcd')); // false
    console.log(reg1.test('aabcd')); // false
    console.log(reg1.test('abcabc')); // false

常用验证

• 用户名验证

    //  量词是设定某个模式出现的次数
    var reg = /^[a-zA-Z0-9_-]{6,16}$/; // 这个模式用户只能输入英文字母 数字 下划线 短横线但是有边界符和[] 这就限定了只能多选1
    // {6,16}  中间不要有空格
    // console.log(reg.test('a'));
    // console.log(reg.test('8'));
    // console.log(reg.test('18'));
    // console.log(reg.test('aa'));
    // console.log('-------------');
    // console.log(reg.test('andy-red'));
    // console.log(reg.test('andy_red'));
    // console.log(reg.test('andy007'));
    // console.log(reg.test('andy!007'));
    var uname = document.querySelector('.uname');
    var span = document.querySelector('span');
    uname.onblur = function() {
        if (reg.test(this.value)) {
            console.log('正确的');
            span.className = 'right';
            span.innerHTML = '用户名格式输入正确';
        } else {
            console.log('错误的');
            span.className = 'wrong';
            span.innerHTML = '用户名格式输入不正确';
        }
    }

• 括号总结

    // 中括号 字符集合.匹配方括号中的任意字符. 
    // var reg = /^[abc]$/;
    // a 也可以 b 也可以 c 可以  a ||b || c
    // 大括号  量词符. 里面表示重复次数
    // var reg = /^abc{3}$/; // 它只是让c重复三次   abccc
    // console.log(reg.test('abc'));
    // console.log(reg.test('abcabcabc'));
    // console.log(reg.test('abccc'));

    // 小括号 表示优先级
    var reg = /^(abc){3}$/; // 它是让abcc重复三次
    console.log(reg.test('abc'));
    console.log(reg.test('abcabcabc'));
    console.log(reg.test('abccc'));

• 座机号码验证

    // 座机号码验证:  全国座机号码  两种格式:   010-12345678  或者  0530-1234567
    // 正则里面的或者 符号  |  
    // var reg = /^\d{3}-\d{8}|\d{4}-\d{7}$/;
    var reg = /^\d{3,4}-\d{7,8}$/;

####正则替换

text.value.replace(/激情|gay/g, '**');

Object 对象方法

Object.keys() 获取对象中的所有属性

    // 用于获取对象自身所有的属性
    var obj = {
        id: 1,
        pname: '小米',
        price: 1999,
        num: 2000
    };
    var arr = Object.keys(obj);
    console.log(arr); // ["id","pname","price","num"]
    arr.forEach(function(value) {
        console.log(value);
    })

Object.defineProperty() 定义新属性或修改原有的属性

基本使用

    Object.defineProperty(obj, 'address', {
        value: '中国山东蓝翔技校xx单元',
        // 如果只为false 不允许修改这个属性值 默认值也是false
        writable: false,
        // enumerable 如果值为false 则不允许遍历（keys()）, 默认的值是 false
        enumerable: false,
        // configurable 如果为false 则不允许删除这个属性 不允许在修改第三个参数里面的特性 默认为false
        configurable: false
    });

• value ：属性的值
• writable: 是否可写,默认false
• enumerable: 是否可以被kyes()遍历,默认false
• configuable: 是否可以被删除,默认false

补充一句，如果是使用这样直接量的方式定义的对象，
其中的writable,enumerable,configuable 的值均为true

var obj = {
    id: 1,
    pname: '小米',
    price: 1999
};