前端---JavaScript基础2

文章目录

前端---JavaScript基础2
- 对象类型判断
- - call函数
- 对象属性操作
- - 深拷贝方法

前端—JavaScript基础2

重构以下代码：（以面向对象的方式）

重构后：（其中this指针问题也可改成箭头函数）

对象类型判断

call函数

对象属性操作

//对象属性操作
//属性增加
var obj = {};
obj.name = "jack";
obj['age'] = 20;
var addr = "wh";
obj[addr] = "武汉";   //使用的变量
console.log(obj);//属性删除
var obj2 = {};
obj2.name = "aaaaa";
obj2['age'] = 22;
delete obj2.name;
console.log(obj2);//检测属性
var obj = {name:"bbb",age:23,action:function(){this.addr = "beijing"}
}
obj.action();
console.log(obj);
//in
console.log('name' in obj)
//hasOwnProperty
console.log(obj.hasOwnProperty('age'))//属性枚举  遍历
var arr = ['a','b','c','d'];
var obj = {name:"bbb",age:23}
//for in
for(var key in obj){//属性名 属性值console.log(key,obj[key])
}
for(var v in arr){console.log(v,arr[v])
}
//for
for(var i=0;i<arr.length;i++){console.log(arr[i])//if(条件ok) 终止  return break;
}
//forEach  没有返回值
arr.forEach(function(item,index){//不能终止console.log(item)
})
//map -- 可修改数组的值  有返回值
var m = arr.map(function(item){ //循环每一个属性 并返回改变后的属性return item+1;
})
//filter 过滤器  返回满足条件的数组
var f = arr.filter(item){return item === 'c';
})
//every  返回true false  都必须满足条件
var e = arr.every(item){return item === 'c';
})
//some  返回true false  满足其中一个即可
var e = arr.every(item){return item === 'c';
})
//reduce
var arr = [1,3,5,7];
//总数  当前数
var s = arr.filter(total,currentValue){return total+currentValue;
},10) //10初始值//对象属性拷贝
//对象序列化与反序列化
//JSON --- 浏览器中对象
var obj = {name:"bbb",age:23};
console.log(JSON.stringify(obj));
var str = '{name:"bbb",age:23}';
console.log(JSON.parse(str))

深拷贝方法

function deep(dest,ori){  //dest目标对象  ori源对象for(var i in ori){if(typeof ori[i] === 'object'){//递归  判断是数组还是对象dist[i] = (ori[i].constructor === Array) ? []:{}; //初始化属性deep(dest[i],ori[i]);}else{dest[i] = ori[i]; //非引用属性}}return dest;
}var a = deep({},Animal);

前端---JavaScript基础2相关推荐

Web前端-JavaScript基础教程上
Web前端-JavaScript基础教程将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...
前端---JavaScript基础4
文章目录前端---JavaScript基础3 call&apply 原型链原型链操作例子:按钮组件封装:(类似于Bootstrsp里的按钮组件封装) 前端-JavaScript基础3 c ...
前端---JavaScript基础3
文章目录前端---JavaScript基础3 普通对象与函数对象原型及属性判断构造函数继承原型继承组合继承寄生组合式继承前端-JavaScript基础3 普通对象与函数对象原型及属性判 ...
前端---JavaScript基础1
文章目录前端---JavaScript基础1 数据类型面向对象对象创建方式对象类型判断前端-JavaScript基础1 JS是解释型语言:跨平台慢编译型语言:不能跨平台快数据类型 ...
Web前端-JavaScript基础教程下
Web前端-JavaScript基础教程下 <script>有6个属性: async对外部脚本有效,可以用来异步操作,下载东西,不妨碍其他操作. charset为src属性指定字符集. d ...
前端JavaScript基础知识点
JavaScript基础阶段说明 JavaScript基础 Web API JavaScript高级 ##第一天重点内容变量的声明及使用数据类型类型转换运算符 JavaScript的组成 E ...
菜鸟学前端--javascript基础
在学习过css相关的知识,有了前端工程师的一些基础知识.但要较好的掌握前端,必须要学习好javascript的知识. 下面将从基本语法.变量.关键字.保留字.语句.函数.BOM等角度阐释. 一.基本语 ...
前端JavaScript基础
目录 JavaScript基础 1:JS概述 1.1:历史: 1.2:现状: 1.3:特点: 1.4:应用场景 2.搭建开发环境 2.1:浏览器: 2.2:服务器端 2.3:运行JS 3.语法规范 4 ...
前端——javascript基础-ECMAScript
文章目录 JavaScript简介 ECMAScript JavaScript的引入方式 javascript得输出方式: 变量五种基本数据类型运算符数据类型转换 if语句 switch语句 w ...

前端---JavaScript基础2

文章目录

前端—JavaScript基础2

对象类型判断

call函数

对象属性操作

深拷贝方法

前端---JavaScript基础2相关推荐

最新文章

热门文章