//1.继承父类中的方法
class Father{
money(){
console.log(100);
}
}
class Son extends Father{
}
var son=new Son();
son.money();
//2.super关键字在子类中传递值给父类
class Father{
constructor(x,y){
this.x=x;
this.y=y;
}
sum(){
console.log(this.x+this.y);
}
}
class Son extends Father{
constructor(a,b){
super(a,b);
}
}
var son=new Son(20,30);
son.sum()
//3.super继承
class Father{
constructor(){
}
say(){
console.log('我是爸爸');
}
}
class Son extends Father{
say(){
super.say();
}
}
var son=new Son();
son.say();
//4.子类的super必须在子类this的前面
class Father{
constructor(x,y){
this.x=x;
this.y=y;
}
sum(a){
console.log(this.x+this.y+a);
}
}
class Son extends Father{
constructor(x,y){
super(x,y);
this.x=x;
this.y=y;
}
sum1(){
console.log(this.x+this.y);
}
}
var son=new Son(1,2);
son.sum();
son.sum1();
对象解构
let arr=[1,2,3,45];
let[a,b,c,d]=arr;
console.log(a);
console.log(b);
console.log(c);
console.log(d);
//方法一
let person={name:'ldh',age:18};
let{name,age}=person;
console.log(name);//ldh
console.log(age);//18
//方法二
let {name:myname,age:myage}=person;
console.log(myname);//ldh
console.log(myage);//18
箭头函数
function sum(num1,num2){
return num+num2;
};
//当只有一个返回值的时候可以省略大括号
const sum1=(num1,num2) => num1+num2
//如果形参只有一个可以省略小括号
const fn=a=> alert(a);
fn(6) //6
//箭头函数不绑定this箭头函数没有自己的this关键字 如果箭头函数中使用this this关键字将指向箭头函数定义的位置的this
function fn1(){
console.log(this);
return function(){
console.log(this);
}
}
const obj={name:'zhangsan'};
const resFn=fn1.call(obj);
resFn(); //this指向的是window
function fn1(){
console.log(this);
return ()=>{
console.log(this);
}
}
const obj={name:'zhangsan'};
const resFn=fn1.call(obj);
resFn(); //this指向obj
//eg列子
var age=100;
var obj={
age:20,
say:()=> console.log(this.age)
}
obj.say(); //100 箭头函数指向的是全局作用域上面因为指定了this
剩余参数及Array扩展方法
const sum=(...args)=>{
let total=0;
args.forEach(item=>total+=item
);
return total;
}
console.log(sum(10,20,30));
function sum1(...arg){
console.log(arg);
}
sum1(10,30,50,function(){
console.log(666);
});
//剩余参数和解构配合使用
let arr1=['张三','李氏','王五'];
let[s1,...s2]=arr1;
console.log(s1);//张三
console.log(s2);//["李氏", "王五"]
//扩展运算符
//(可以将数组拆分成以逗号分隔的参数序列)
let ary=['a','b','c'];
console.log(...ary);//a b c
console.log('a','b','c');//a b c
//(应用于数组合并)方法一
let arr1=[1,2,3];
let arr2=[4,5,6];
let arr3=[...arr1,...arr2];
console.log(arr3);//[1, 2, 3, 4, 5, 6]
//(应用于数组合并)方法二
let arr1=[1,2,3];
let arr2=[4,5,6];
arr1.push(...arr2);
console.log(arr1);//[1, 2, 3, 4, 5, 6]
//展开语法把伪数组转化为数组
var oDiv=document.getElementsByClassName('di');
var art=[...oDiv];
//构造函数方法 Array.from();对象转化为数组
let arrLike={
'0':'ldh',
'1':18,
'length':2
};
let newarrLike=Array.from(arrLike);
console.log(newarrLike);
//Array.find();
var fid=[{
id:1,
name:'张三'
},{
id:2,
name:'李四'
}];
let target=fid.find((item)=>{
return item.id==2;
})
console.log(target);
//Array.findindex() 查找索引
let ary=[10,20,30];
let index=ary.findIndex(item=>{
item>15
});
console.log(index);//1
//Array.includes 查看数组是否包含要查的值返回值为true flase
let result= ['a','b','c'].includes('a');
console.log(result);//true
模板字符串
let name=`张三`;
let sayHello=`我的名字是${name}`;
let name=`张三`;
let sayHello=`我的名字是${name}`;
var a={
name:'ldh',
age:18
};
var html=`
<p>${a.name}</p>
<p>${a.age}</p>
`
//构造函数set方法见最后
补充浅拷贝
var obj={
id:1,
name:'andy',
msg:{
id:01,
name:'ldh'
}
};
var o={};
for(var key in obj){
o[key]=obj[key];
}
console.log(o);
//浅拷贝直接调用方法
var obj={
id:1,
name:'andy',
msg:{
id:01,
name:'ldh'
}
};
var o={};
Object.assign(o,obj);
console.log(o);
深拷贝
var obj={
id:1,
name:'andy',
msg:{
id:01,
name:'ldh'
},
arr:[1,2,3]
};
var o={};
function deepCopy(newCopy,obj){
for(var key in obj){
var item=obj[key];
if(item instanceof Array){
newCopy[item]=[];
deepCopy(newCopy[key],item);
}else if(item instanceof Object){
newCopy[item]={};
deepCopy(newCopy[key],item);
}else{
newCopy[k]=item;
}
}
}
deepCopy(o,obj)