• ES5总结


    ECMAScript5是2009年标准化的规范,IE9+和现代浏览器均支持,已经可以大规模应用的新特性

    (一)'use strict'

    限制一些用法,相当于弃用了一些之前的语法:http://www.cnblogs.com/snandy/p/3428171.html

    (二) Array扩展

    let arr = [1,2,3]
    {
    	//forEach
    	arr.forEach(function(val,i,arr){
    		//console.log(val,i,arr) 
    	})
    }
    {
    	//map:返回一个数组,包含该函数的返回值
    	let map_arr = arr.map(function(val,i,arr){
    		return val*2
    	})
    	//console.log(map_arr) //[2,4,6]
    }
    {
    	//filter:返回数组的一个子集。传递的函数是用来逻辑判断的:true/false。
    	//如果返回值为true或能转化为true的值,那么传递给判断函数的元素就是这个子集的成员
    	let filter_arr = arr.filter(function(val,i,arr){
    		return val > 1
    	})
    	//console.log(filter_arr) //[2,3]
    }
    {
    	//every/some: 它们对数组元素应用指定的函数进行判断,返回true或false
    	//every: 当且仅当都返回true,它才返回true。
    	//some: 当且仅当针都返回false,它才返回false
    	let every_arr = arr.every(function(val,i,arr){
    		return val > 1
    	})
    	let some_arr = arr.some(function(val,i,arr){
    		return val > 1
    	})
    	//console.log(every_arr,some_arr) //false true
    }
    {
    	//indexOf/lastIndexOf: 搜索整个数组中具有给定值的元素,返回找到的第一个元素的索引或者若果没有找到则返回-1
    	//注意:并不会做类型转换
    	let indexOf_arr = arr.indexOf(2)	
    	//console.log(indexOf_arr) //1
    }
    {
    	//reduce/reduceRight: 接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终为一个值
    	let reduce_arr = arr.reduceRight(function(previous, current, index, array){
    		console.log('previous:'+previous)
    		console.log('current:'+current)
    		console.log('index:'+index)
    		console.log('----------------')
    	  	return previous + current;
    	});
    	//console.log(reduce_arr) //1
    }
    {
    	//isArray:判断是否是数组
    	Array.isArray(arr)
    }
    

      

    (三) Object扩展

    //Object 扩展:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
    var obj = {};
    {
    	//Object.defineProperty(obj, prop, descriptor):在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象
    	//descriptor:描述符:属性描述符有两种主要形式:数据描述符和存取描述符
    	//1.数据描述符
    	Object.defineProperty(obj,"a",{
    		//这个属性起到两个作用:
    		//目标属性是否可以使用delete删除
    		//目标属性是否可以再次设置特性
    	    configurable:false,
    	    //此属性是否可以被枚举(使用for...in或Object.keys())
    	    enumerable:false,
    	    value:undefined,
    	    //值是否可以重写
    	    writable:false
    	});
    	//2.存取描述符
    	Object.defineProperty(obj,"b",{		
    	    configurable:false,
    	    enumerable:false,
    	    //注意:
    	    //当使用了getter或setter方法,不允许使用writable和value这两个属性
    	    //get或set不是必须成对出现,任写其一就可以。如果不设置方法,则get和set的默认值为undefined
    	    get:function (){return 1}
    	});
    
    	//demo
    	let _obj = {}
    	var initValue = 'hello'
    	Object.defineProperty(_obj,"newKey",{
    	    get:function (){
    	        //当获取值的时候触发的函数
    	        return initValue   
    	    },
    	    set:function (value){
    	        //当设置值的时候触发的函数,设置的新值通过参数value拿到
    	        initValue = value
    	    }
    	});
    	//获取值
    	//console.log( _obj.newKey )  //hello
    	//设置值
    	_obj.newKey = 'change value'
    	//console.log( _obj.newKey ) //change value
    }
    {
    	//Object.defineProperties() 方法在一个对象上添加或修改一个或者多个自有属性,并返回该对象
    	let _obj = {}
    	Object.defineProperties(_obj, {
    	  "property1": {
    	    value: true,
    	    writable: true
    	  },
    	  "property2": {
    	    value: "Hello",
    	    writable: false
    	  }
    	  // 等等.
    	});
    	//console.log(_obj.property2) //"Hello"
    }	
    {
    	//Object.create:创建一个拥有指定原型和若干个指定属性的对象
    	let proto = {aa:11}
    	let o = Object.create(proto, {
    	  // foo会成为所创建对象的数据属性
    	  foo: { writable:true, configurable:true, value: "hello" },
    	  // bar会成为所创建对象的访问器属性
    	  bar: {
    	    configurable: false,
    	    get: function() { return 10 },
    	    set: function(value) { console.log("Setting `o.bar` to", value) }
    	}})
    }
    {
    	//获取给丁对象的prototype对象。等价于以前的o.__proto__
    	Object.getPrototypeOf(obj)
    	//返回对象的所有可枚举(enumerable)属性的名称:不含继承
    	Object.keys(obj)
    	//获取自有属性名列表:不含继承
    	Object.getOwnPropertyNames(obj)
    
    }
    {
    	//阻止对象添加属性,但可以修改和删除
    	Object.preventExtensions(object)
    	//不能添加和删除属性
    	Object.seal(object)
    	//阻止属性和属性值得修改,防止新属性的添加
    	Object.freeze(object)
    	//对应:
    	Object.isExtensible()	
    	Object.isSealed()
    	Object.isFrozen()
    }
    

      

    (四) Date扩展

    {
    	Date.now() // 1483334011674
    }
    

    (五) JSON对象

    //JSON对象
    {
    	//JSON.parse() 解析一个JSON字符串,构造由字符串描述的JavaScript值或对象
    	//JSON.stringify() 将JavaScript值转换为JSON字符串
    }
    

      

    (六)String扩展

    {
    	//String.prototpye.trim:去掉字符串两头的空白符和换行符。
    	' ddd  '.trim()
    }
    {
    	//字符订阅
    	"abc"[2] === "b"
    }
    

      

    (七)Function扩展

    {
    	//为了指定当前函数的上下文对象和运行参数,该函数创建一个新的函数,保留给定的this对象和运行参数。
    	//Function.prototype.bind(thisTarget, arg1,...argn)
    	(function(){console.log(this,arguments)}).bind({},1,2)()
    	//下面实现一个pollfill
    	if(!Function.prototype._bind){
    		Function.prototype._bind = function(){
    			var _this = this
    			var context = [].shift.call(arguments)
    			var arg = [].slice.call(arguments)
    			return function(){
    				_this.apply(context,arg.concat([].slice.call(arguments)))
    			}
    		}
    	}
    }
    

      

  • 相关阅读:
    纯js实现10分钟倒计时
    js中的constructor
    双指放大缩小问题(不需要第三方插件)
    js异步加载的3种方式(转载)
    5种处理js跨域问题方法汇总(转载)
    oncopy="document.selection.empty()"跟oncopy="return false"什么区别?
    十进制 转换为 二进制
    99%的人都理解错了HTTP中GET与POST的区别(转载
    简单封装:检测邮箱是否合法
    Xshell记录日志的方法
  • 原文地址:https://www.cnblogs.com/webLilingyun/p/6590234.html
Copyright © 2020-2023  润新知