[知識(shí)分享]React Native 常用語(yǔ)法總結(jié)
自定義組件導(dǎo)出
自定義組件在a.js文件中export xx。接受方需用import xx from a弄贿，如果在a.js中是export default xx待秃。那么在接受方就不需要也用xx接收嘹吨，隨便aa，bb祥诽，cc接收都行譬圣，import aa/bb/cc/xx from a.
注意：在自定義的a.js文件中可多次export xx。但是只能有唯一的export default xx雄坪。來(lái)聲明導(dǎo)出厘熟。export default的時(shí)候變量名不能用{}包裹屯蹦，接收也不用。rest參數(shù)-擴(kuò)展運(yùn)算符（神奇三點(diǎn)）
例子：
let foo = (x,y,…h(huán)d)=> {
console.log(hd);
return x+y
}
console.log(foo(3,4,5,6,7)) //…h(huán)d 表示聲明一個(gè)rest參數(shù)绳姨，用來(lái)接收多余的實(shí)參(形參情況下)
打印結(jié)果：Array[5,6,7]. 是將多余的參數(shù)5登澜，6，7拼接數(shù)組打印出來(lái)
例子：
Function foo(x,y){
return x+y;
}
在非形參情況下飘庄，三個(gè)點(diǎn)表示將數(shù)組拆分成獨(dú)立的值脑蠕。
let arr = [3,4];
console.log(foo(…arr)) 等同于 console.log(foo(3，4))
let arr=[1,2,3];
let hd=[4,5,6,…arr];
相當(dāng)于let hd = [4,5,6,1,2,3]-
數(shù)組遍歷的方法
forEach：
ary:[1,2,3,5]
this.ary.forEach(x=>{
console.log(x*x)
})this.ary.map(x=>{
console.log(x*x)
})
Map和foreach用法幾乎一樣跪削，但是如果對(duì)數(shù)組本身進(jìn)行操作的話谴仙，要用foreach，可以對(duì)數(shù)組自身操作碾盐。map對(duì)數(shù)組的元素操作完成后是返回一個(gè)新的數(shù)組晃跺。要用新的數(shù)組來(lái)接收，原數(shù)組不變毫玖。 數(shù)組的解構(gòu)賦值
let [aa,bb,cc]=['111','222','333']
console.log(aa+'A'+bb+'B'+cc) 結(jié)果：111A222B333
解構(gòu)賦值是“模式匹配”掀虎，說(shuō)白了，只要是左右兩邊的解構(gòu)一樣付枫，就能一一對(duì)應(yīng)烹玉。
例如：一個(gè)比較簡(jiǎn)潔的用法，交換兩個(gè)變量的值
let x = 1;
let y = 2;
[x,y] = [y,x]
console.log(x)
console.log(y)
其中x,y是同一個(gè)變量阐滩。
注意：
let [a,b]=[1]
console.log(a) 1
console.log(b). Undefined
解構(gòu)失敗的話就是undefined對(duì)象的解構(gòu)賦值
let {ee,ff} = {ee:'12121',ff:'33333'}
console.log(ee+ff) //1212133333
let {ff,ee} = {ee:'12121',ff:'33333’}也一樣二打。字符串解構(gòu)賦值 函數(shù)參數(shù)解構(gòu)賦值
let [a,b,c] = ‘后盾人’；
console.log(a) //后
console.log（c）//人
let {length:len} = ‘后盾人’叶眉；
console.log(len); //3
tt1([x,y]){
return x*y
}
console.log(this.tt1([3,5])). //15
在傳入?yún)?shù)那一刻址儒，參數(shù)變量被解構(gòu)成q和z。對(duì)于代碼內(nèi)部來(lái)說(shuō)衅疙，他們感受到的參數(shù)就是x和y
[[1,2],[3,4]].map(([q,z]) => q+z) //[3,7]set數(shù)據(jù)結(jié)構(gòu) set本身是一個(gè)構(gòu)造函數(shù)，用來(lái)生成set數(shù)據(jù)結(jié)構(gòu)鸳慈。（類似于數(shù)組饱溢，但是成員的值都是唯一的，沒(méi)有重復(fù)的值）
//創(chuàng)建set數(shù)據(jù)解構(gòu)
let sett = new Set();
//向set數(shù)據(jù)結(jié)構(gòu)追加數(shù)據(jù)
sett.add(1);
sett.add(2);
sett.add(1);
console.log(sett) //set{1,2} 自動(dòng)過(guò)濾重復(fù)元素
let s = new Set([1,2,3,4,5,6,7,2,3,1]);
console.log(s);//Set(7) {1, 2, 3, 4, 5,6,7}
//可以通過(guò)size屬性獲得set數(shù)據(jù)結(jié)構(gòu)的長(zhǎng)度
console.log(sett.size)
//數(shù)組去重
let arr = [1,2,3,4,5,6,7,2,3,1,2,3]
let db = [...new Set(arr)];
console.log(db)
//set數(shù)據(jù)結(jié)構(gòu)方法
let ss = new Set([1,2,3,4,5,5,5,5])
console.log(ss)
//追加數(shù)據(jù)
ss.add(7)
console.log(ss)
//刪除數(shù)據(jù)
ss.delete(3);
console.log(ss)
//判斷數(shù)據(jù)中是否有某值
let rs = ss.has(2);
console.log(rs) //true
//清除所有成員
ss.clear()
console.log(ss)
let sa = new Set([1,2,3,4,5,6,6])
//set數(shù)據(jù)轉(zhuǎn)數(shù)組（如果有重復(fù)元素去除）
let ew = Array.from(sa); // 《==》 let ew = [...new Set(sa)];
console.log(ew)
//set結(jié)構(gòu)的實(shí)例有四個(gè)遍歷方法
keys():返回鍵名的遍歷器
values():返回鍵值的遍歷器
entries():返回健值對(duì)的遍歷器
forEach():使用回調(diào)函數(shù)遍歷每個(gè)成員
console.log(sa.keys());//SetIterator {1, 2, 3, 4, 5, 6}
console.log(sa.values());//SetIterator {1, 2, 3, 4, 5, 6}//這里沒(méi)有健名所以和健值一樣
//用x去遍歷s.keys()產(chǎn)生的值
for(x of sa.values()){
console.log(x) // 1,2,3,4,5,6
}
for(x of sa.entries()){
//sa.entries()將set數(shù)據(jù)的值組成健值對(duì)走芋，形成一個(gè)集合（因?yàn)檫@里沒(méi)有鍵名绩郎，所有鍵名和健值一樣）
console.log(x) // [1,1] [2,2] [3,3] [4,4] [5,5] [6,6]
}
sa.forEach(x => {
console.log(x);
})map數(shù)據(jù)結(jié)構(gòu). 里面的‘對(duì)象’（類似于對(duì)象但不是），鍵名可以是任意類型的（傳統(tǒng)json的健值對(duì)只能是字符串）
let m = new Map()
m.set('name','后盾人')
let ewq = m.get('name')
console.log(ewq)//后盾人
console.log(m)//Map(1) {"name" => "后盾人"}
m.set(123,'abc')
console.log(m.get(123))//abc
let obj = {a:1}
m.set(obj,111)
console.log(m.get(obj))
//作為構(gòu)造函數(shù)翁逞，Map也可以接收一個(gè)數(shù)組作為參數(shù)肋杖，該數(shù)組的成員是一個(gè)個(gè)表示健值對(duì)的數(shù)組
let mmap = new Map([
[123,'健值1'],
[456,'健值2']
])
console.log(mmap.get(123)) //健值1
//注意：只有針對(duì)同一個(gè)對(duì)象的引用，Map結(jié)構(gòu)才將其視為同一個(gè)健挖函。
mmap.set(['a'],123)
console.log(mmap.get(['a']))//undefined 此處的['a']是兩個(gè)內(nèi)容相同的不同對(duì)象状植。
let obb = ['a']
mmap.set(obb,123)
console.log(mmap.get(obb))//123
//map數(shù)據(jù)結(jié)構(gòu)方法
keys():返回鍵名的遍歷器
values():返回鍵值的遍歷器
entries():返回健值對(duì)的遍歷器
forEach():使用回調(diào)函數(shù)遍歷每個(gè)成員
for(let xx of mmap.keys()){
console.log(xx) //123,456,['a'],['a']
}
for(let xx of mmap.values()){
console.log(xx) //健值1，健值2，123津畸，123
}
for(let xx of mmap.entries()){
console.log(xx) // [123, "健值1"],[456, "健值2"],[Array(1), 123],[Array(1), 123]
}
//v代表當(dāng)前遍歷到的健值對(duì)的健值
//k代表當(dāng)前遍歷到的健值對(duì)的鍵名
mmap.forEach((v,k) =>{
console.log(v,k)//健值1 123 健值2 456 123 ["a"] 123 ["a"]
})
//map結(jié)構(gòu)轉(zhuǎn)化為數(shù)組（最簡(jiǎn)單的使用擴(kuò)展運(yùn)算符 ...神奇三點(diǎn)）
const map = new Map([
[1,'one'],
[2,'two'],
[3,'three']
])
let ree = [...map.keys()]
console.log(ree) //[1, 2, 3]
let reee = [...map.values()]
console.log(reee) //["one", "two", "three"]
let reeee = [...map.entries()] // [...map]
console.log(reeee) //[Array(2), Array(2), Array(2)]
let bxc = Array.from(map)//[Array(2), Array(2), Array(2)] 也可將map結(jié)構(gòu)轉(zhuǎn)化為數(shù)組
for(x of map){
console.log(x). //[1,'one'],[2,'two'], [3,'three']
}
//傳統(tǒng)的數(shù)組 字典遍歷用forin循環(huán)遍歷振定，x代表數(shù)組中的下標(biāo)鍵名。
//對(duì)于set結(jié)構(gòu)和map結(jié)構(gòu)必須用of遍歷肉拓，x此時(shí)代表的是鍵值后频。類
calss animal{
//構(gòu)造函數(shù)，會(huì)在類被實(shí)例化的時(shí)候自動(dòng)執(zhí)行
//一般來(lái)講暖途，需要定義的屬性卑惜，都聲明在constructor里面
constructor(){
this.weight = ‘重量’；
this.color = ‘顏色’驻售；
}
//創(chuàng)建類的時(shí)候残揉，方法之間不需要逗號(hào)或分號(hào)
//類里面的方法不需要用function聲明
move(){
console.log(‘會(huì)動(dòng)’)
}
//通過(guò)類創(chuàng)建對(duì)象
let map = new animal();
Class fish extends animal{
constructor(){
super();//如果繼承父類，需要添加屬性芋浮，必須先聲明super方法抱环。
this.sao = ’21’;
//super當(dāng)作對(duì)象使用的時(shí)候，指向的是父類的原型（prototype） 說(shuō)白了纸巷，super對(duì)象指向的就是父類镇草，可以通過(guò)super對(duì)象得到父類中的方法
super.move();
}}ReactNative中的platform選擇
const platformText = Platform.select({
ios:' 我是ios',
android:'我是android'
})
<Text> {platformText} </Text>state和props
state：我們使用兩種數(shù)據(jù)來(lái)控制一個(gè)組件，props和state瘤旨。props是在父組件中指定梯啤，而且一經(jīng)指定，在被指定的組件的生命周期中則不再改變存哲。對(duì)于需要改變的數(shù)據(jù)因宇，我們需要使用state。
一般來(lái)說(shuō)祟偷，你需要在constructor中初始化state察滑，然后再需要修改時(shí)調(diào)用setState方法。Promise.
//Promise修肠。簡(jiǎn)單說(shuō)就是一個(gè)容器贺辰，里面保存著某個(gè)未來(lái)才會(huì)結(jié)束的事件（通常是一個(gè)異步操作）的結(jié)果。
var p = new Promise((resolve,reject)=>{
setTimeout(() => {
//resolve表示將promise對(duì)象的狀態(tài)變?yōu)槌晒η妒髸?huì)執(zhí)行后續(xù)的處理流程
// reject()// 表示失敗
resolve() //表示成功
}, 2000);
})
.then((x)=>{//then方法會(huì)等promise對(duì)象狀態(tài)變?yōu)榻Y(jié)束后執(zhí)行
// console.log(x)
console.log('淘寶11')
})
Fetch本身也屬于promise的一種對(duì)象
fetch('http:www.baidu.com',{
methods:'POST',
body:'sasasasas'
}).then(x=>{
})除了系統(tǒng)的循環(huán)組件饲化，最基本的循環(huán)組件展示
constructor(props){
super(props)
this.state = {
ary:[1,2,3,4],
}
render(){
let alltitle = []
this.state.ary.map((x)=>{
alltitle.push(<Text>標(biāo)題:{x}</Text>)
})
return(
{alltitle}. //循環(huán)展示組件
)}
