7日目TILクラスとアレイ内蔵関数

6244 ワード
テキストリンク

アレイ組み込み関数


push pop shift unshift concat/join split
forEach/map/reduceは適切に使えば本当に役に立ちます
indexOf/findIndex/find/filter(関数)findとfilterの違いは何ですか?
slice splice

23.forEach


アレイ要素を4つの方法で循環
const f=['mimi' ,'kiki','mom' ,'papa11']
(1)
for(let i=0; iconsole.log(f[i])
}
(2)
f.forEach(el=> console.log(el))
(3)
f.forEach(function(el){
console.log(el)
})
(4)
function print(family){
console.log(family)
}
f.forEach(print)

24.mapがすべての要素を変更したい場合


consta=[1,2,3,4,6]>>平方をください
(1)
const aa=a.map(el => el*el)
//空の配列を作成する必要はありません.新しい変数に直接入れることができます.
(2)
const b=[];
for(let i=0; ib.push(a[i]a[i])
}
(3)
const b=[];
a.forEach(el=> b.push(elel))
const a=[
{
id:1,
text:'mimi'
},
{
id:2,
text:'mom'
}
]
const b= a.map(el=>el.text))
//どうしてここにかっこつけられないの?
indexOF
const f=['mimi','kiki','mom']
const a= f.indexOf('mimi')
console.log(a)
//数字、文字、ブール値はindexOfで十分
//対象、条件として検索した場合…?findIndex
/findIndex(関数)/find(関数)
const f=[
{
id:1,
name:'mimi',
done:true
},
{
id:2,
name:'ki',
done:true
},
{
id:3,
name:'mom',
done:false
}
]
const a = f.find(el => el.id ===3)
//find(el=>el.id==3)オブジェクトを返します.

25.filter(関数)の要件を満たす配列要素がぼろぼろと出てくる。


const f=[
{
id:1,
name:'mimi',
done:true
},
{
id:2,
name:'ki',
done:true
},
{
id:3,
name:'mom',
done:false
}
]
const a = f.filter(el => el.done===true)
console.log(a)

26.クリップは既存の配列に触れる。私はSliceには触らない。


const a =[1,2,3,4,5]
const index=a.indexOf(3)
console.log(a.splice(index,2))
console.log(a)
const a =[1,2,3,4,5]
const b=a.slice(1,2)
console.log(b)
console.log(a)

27.shift pop unshift shift


const a=[1,2,3,4]
a.push(5)
a.shift()
a.pop()
a.unshift(0,1)
console.log(a)
concatは既存のレイアウトに触れません.
const a = [1,2,3];
const b = [4,5,10];
const c = a.concat(b);
<表計算ドキュメントの構文>
const c = [...a,...b]
concat(c)
join
const a = [1,2,3];
console.log(a.join(「和」)

28,29.reduce. すべての値で演算する必要がある場合


const a = [1,2,3];
//求和
let sum =0;
a.forEach( el => {
sum+=el
})
const sum = a.reduce((acc,cur,idx,arr) => { return acc+cur},0)
//平均を求める
const a = [1,2,3,4];
const sum = a.reduce((acc,cur,idx,arr) => { if(idx === arr.length-1){
return (acc+cur)/arr.length
}
return (acc+cur)
},0)
console.log(sum)
//要素ごとにいくつあるか教えてください
const a = ['a','a','a','b','b','c'];
const sum=a.reduce((acc,cur,idx,arr)=>{if(acc[cur])/accのcurが存在するかどうか.
acc[cur] += 1;
} else{
acc[cur] =1
}
return acc
},{})
console.log(sum)

30.アレイ内蔵関数の復習


質問する
function countBiggerThanTen(numbers) {
/実装/
}
const count = countBiggerThanTen([1, 2, 3, 5, 10, 20, 30, 40, 50, 60]);
console.log(count);//5
(1)
function countBiggerThanTen(numbers) {
return numbers.reduce((acc, current) => {
if (current > 10) {
return acc + 1;
} else {
return acc;
}
}, 0);
(2)
function countBiggerThanTen(numbers) {
return numbers.filter(n => n > 10).length;
}
(3)
function countBiggerThanTen(numbers) {
/実装/
let count = 0;
numbers.forEach(n => {
if (n > 10) {
count++;
}
});
return count;
}

カテゴリ


class 31. オブジェクト作成者


function Animal(type,name,sound){
this.type=type;
this.name=name;
this.sound=sound
this.say=function(){
console.log(this.sound)
}
}
const dog=new Animal(「子犬」「chichi」「walwal」)
dog.say()
//インスタンスを作成するたびにsayが作成されます.
再利用可能なコードを作成するには:
this.say=~~ここを拭いて
次の図に示すように、「再利用可能」:プロトタイプに設定します.
Animal.prototype.say=function (){
console.log(this.sound)
}

32.オブジェクト作成者の継承の取得]


親オブジェクト作成者、子オブジェクト作成者.
子オブジェクトは親オブジェクトの内容を継承します.
function Animal(type,name,sound){
this.type=type;
this.name=name;
this.sound=sound
}
Animal.prototype.say=function(){
console.log(this.sound);
}
function Dog(name,sound){
Animal.call(this,“個”,name,sound)/thisの後にパラメータ
}
Dog.prototype=Animal.prototype//プロトタイプを共有するために
const dog=new Dog(chichi,walwal)
dog.say()

33.es 6 class構文は、オブジェクト作成者とプロトタイプの使用を容易にするために作成された構文です。


(JavaScriptではクラス機能が全くなく、他の言語クラスとは全く異なる)
extends:クラスが「継承」されていることを示します.
super:継承クラスの構造関数を呼び出す...
class Animal{
	constructor(type,name,sound){      //constructor는 객체생성자 비슷한 함수(생성자란 의미)
	this.type=type;
	this.name=name;
	this.sound=sound;
	}
	
	this.say=function(){  //분홍색 빼고 쓰면 됨.  //클래스 안의 함수는 프로토타입에 자동등록
	console.log(this.sound)                           //따라서 console.log(Animal.prototype.say)라고 하면 
	}                                                         프로토타입에 함수가 설정된게 보임. 
}

const dog = new Animal('강아지', '치치' , '멍멍')
dog.say();

+ 클래스 문법을 사용하면 , 상속을 더 쉽게 함
해보자

class Dog extends Animal{
constructor(name,sound){
super ('개,name, sound)
}
}

const dog = new Dog("멍멍이", '멍멍')
dog.say()

34.制作

class Food{
  constructor(name){
    this.name=name;
    this.brands = [];
  }
  addBrand(brand){
    this.brands.push(brand)
  }
  print(){
    console.log(`${this.name}를 파는 음식점들`);
    console.log(this.brands.join(', '))
  }
}

const pizza = new Food('피자')
pizza.addBrand("피자헛");
pizza.addBrand("미스터피자")

pizza.print()
201512004作業で使用されたクエリー文
BOSでの符号化ルールの取得