2. 程式人生 > >Immutable.js中在react的運用

Immutable.js中在react的運用

阿新 • • 發佈：2018-12-28

Immutable 的幾種資料型別

  1. List: 有序索引集，類似JavaScript中的Array。
  2. Map: 無序索引集，類似JavaScript中的Object。
  3. OrderedMap: 有序的Map，根據資料的set()進行排序。
  4. Set: 沒有重複值的集合。
  5. OrderedSet: 有序的Set，根據資料的add進行排序。
  6. Stack: 有序集合，支援使用unshift（）和shift（）新增和刪除。
  7. Range(): 返回一個Seq.Indexed型別的集合，這個方法有三個引數，start表示開始值，預設值為0，end表示結束值，預設為無窮大，step代表每次增大的數值，預設為1.如果start = end,則返回空集合。
  8. Repeat(): 返回一個vSeq.Indexe型別的集合，這個方法有兩個引數，value代表需要重複的值，times代表要重複的次數，預設為無窮大。
  9. Record: 一個用於生成Record例項的類。類似於JavaScript的Object，但是隻接收特定字串為key，具有預設值。
  10. Seq: 序列，但是可能不能由具體的資料結構支援。
  11. Collection: 是構建所有資料結構的基類，不可以直接構建。

用的最多就是List和Map，所以在這裡主要介紹這兩種資料型別的API。

API的使用

1.fromJS()

作用：將一個js資料轉換為Immutable型別的資料。

用法：fromJS(value, converter)

簡介：value是要轉變的資料，converter是要做的操作。第二個引數可不填，預設情況會將陣列準換為List型別，將物件轉換為Map型別，其餘不做操作。

程式碼實現：

    const obj = Immutable.fromJS({a:'123',b:'234'},function (key, value, path) {
        console.log(key, value, path)
        return isIndexed(value) ? value.toList() : value.toOrderedMap())
    })

2.toJS()

作用：將一個Immutable資料轉換為JS型別的資料。

用法：value.toJS()

3.is()

作用：對兩個物件進行比較。

用法：is(map1,map2)

簡介：和js中物件的比較不同，在js中比較兩個物件比較的是地址，但是在Immutable中比較的是這個物件hashCode和valueOf，只要兩個物件的hashCode相等，值就是相同的，避免了深度遍歷，提高了效能。

程式碼實現：

import { Map, is } from 'immutable'
const map1 = Map({ a: 1, b: 1, c: 1 })
const map2 = Map({ a: 1, b: 1, c: 1 })
map1 === map2   //false
Object.is(map1, map2) // false
is(map1, map2) // true

4.List 和 Map

建立

List() 和 Map()

作用：用來建立一個新的List/Map物件

用法:

//List

List(): List<any>
List<T>(): List<T>

//Map

Map(): Map<any>
Map<T>(): Map<T>

List.of() 和 Map.of()

作用：建立一個新的包含value的List/Map物件

用法：

List.of<T>(...values: Array<T>): List<T>

Map.of<T>(...values: Object<T>): Map<T>

判斷

List.isList() 和 Map.isMap()

作用：判斷一個數據結構是不是List/Map型別

用法：

List.isList(maybeList: any): boolean

Map.isMap(maybeMap: any): boolean

長度

size

作用：獲取List/Map的長度

資料讀取

get() 、 getIn()

Immutable.fromJS([1,2,3,{a:4,b:5}]).get('0'); //1
Immutable.fromJS([1,2,3,{a:4,b:5}]).getIn(['0']); //1
Immutable.fromJS([1,2,3,{a:4,b:5}]).getIn([3,'b']) //5

 

作用：獲取資料結構中的資料

has() 、 hasIn()

作用:判斷是否存在某一個key

用法：

Immutable.fromJS([1,2,3,{a:4,b:5}]).has('0'); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).has('0'); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).hasIn([3,'b']) //true

includes()

作用：判斷是否存在某一個value

用法：

Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(2); //true
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes('2'); //false 不包含字元2
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(5); //false 
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes({a:4,b:5}) //false
Immutable.fromJS([1,2,3,{a:4,b:5}]).includes(Immutable.fromJS({a:4,b:5})) //true

first() 、 last()

作用：用來獲取第一個元素或者最後一個元素，若沒有則返回undefined

程式碼：

Immutable.fromJS([1,2,3,{a:4,b:5}]).first()//1
Immutable.fromJS([1,2,3,{a:4,b:5}]).last()//{a:4,b:5}

Immutable.fromJS({a:1,b:2,c:{d:3,e:4}}).first() //1
Immutable.fromJS({a:1,b:2,c:{d:3,e:4}}).first() //{d:3,e:4}

資料修改

注：這裡對於資料的修改，是對原資料進行操作後的值賦值給一個新的資料，並不會對原資料進行修改，因為Immutable是不可變的資料型別。

設定 set()

作用：設定第一層key、index的值

用法：

set(index: number, value: T): List<T>
set(key: K, value: V): this

List在使用的時候，將index為number值設定為value。Map在使用的時候，將key的值設定為value。

在List中使用時，若傳入的number為負數，則將index為size+index的值設定為value，例，若傳入-1，則將size-1的值設為value。若傳入的number的值超過了List的長度，則將List自動補全為傳入的number的值，將number設定為value，其餘用undefined補全。注：跟js中不同，List中不存在空位，[,,,],List中若沒有值，則為undefined。

程式碼實現：

//////List
const originalList = List([ 0 ]);
// List [ 0 ]
originalList.set(1, 1);
// List [ 0, 1 ]
originalList.set(0, 'overwritten');
// List [ "overwritten" ]
originalList.set(2, 2);
// List [ 0, undefined, 2 ]

List().set(50000, 'value').size;
// 50001

//////Map
const { Map } = require('immutable')
const originalMap = Map()
const newerMap = originalMap.set('key', 'value')
const newestMap = newerMap.set('key', 'newer value')

originalMap
// Map {}
newerMap
// Map { "key": "value" }
newestMap
// Map { "key": "newer value" }

setIn()

作用：設定深層結構中某屬性的值

用法：

setIn(keyPath: Iterable<any>, value: any): this


foo = Im.fromJS({a: {b: 1}});
bar = foo.setIn(['a', 'b'], 2);   // 使用 setIn 賦值
console.log(foo.getIn(['a', 'b']));  // 使用 getIn 取值，列印 1
console.log(foo === bar);  // false

用法與set()一樣，只是第一個引數是一個數組，代表要設定的屬性所在的位置

刪除 delete

作用：用來刪除第一層結構中的屬性

用法：

delete(index: number): List<T>  //List
delete(key: K): this  //Map

deleteIn()

用來刪除深層資料，用法參考setIn

deleteAll() (Map獨有，List沒有)

作用：用來刪除Map中的多個key

用法：deleteAll(keys: Iterable<K>): this

程式碼示例：

const names = Map({ a: "Aaron", b: "Barry", c: "Connor" })
names.deleteAll([ 'a', 'c' ])
// Map { "b": "Barry" }

更新 update()

作用：對物件中的某個屬性進行更新，可對原資料進行相關操作

用法：

update(index: number, updater: (value: T) => T): this //List
update(key: K, updater: (value: V) => V): this  //Map

程式碼示例：

////List
const list = List([ 'a', 'b', 'c' ])
const result = list.update(2, val => val.toUpperCase())

///Map
const aMap = Map({ key: 'value' })
const newMap = aMap.update('key', value => value + value)

updateIn()

用法參考setIn

清除 clear()

作用：清除所有資料

用法：clear(): this

程式碼示例：

Map({ key: 'value' }).clear()  //Map
List([ 1, 2, 3, 4 ]).clear()   // List

List中的各種刪除與插入

List對應的資料結構是js中的陣列，所以陣列的一些方法在Immutable中也是通用的，比如push，pop,shift，unshift，insert。

  1. push()：在List末尾插入一個元素
  2. pop(): 在List末尾刪除一個元素
  3. unshift: 在List首部插入一個元素
  4. shift: 在List首部刪除一個元素
  5. insert：在List的index處插入元素

程式碼實現：

List([ 0, 1, 2, 3, 4 ]).insert(6, 5) 
//List [ 0, 1, 2, 3, 4, 5 ]
List([ 1, 2, 3, 4 ]).push(5)
// List [ 1, 2, 3, 4, 5 ]
List([ 1, 2, 3, 4 ]).pop()
// List[ 1, 2, 3 ]
List([ 2, 3, 4]).unshift(1);
// List [ 1, 2, 3, 4 ]
List([ 0, 1, 2, 3, 4 ]).shift();
// List [ 1, 2, 3, 4 ]

List中還有一個特有的方法用法設定List的長度，setSize()

List([]).setSize(2).toJS() //[undefined,undefined]

關於merge

merge

作用：淺合併，新資料與舊資料對比，舊資料中不存在的屬性直接新增，就資料中已存在的屬性用新資料中的覆蓋

mergrWith

作用：自定義淺合併，可自行設定某些屬性的值

mergeIn

作用：對深層資料進行淺合併

mergeDeep

作用：深合併，新舊資料中同時存在的的屬性為新舊資料合併之後的資料

mergeDeepIn

作用：對深層資料進行深合併

mergrDeepWith

作用:自定義深合併，可自行設定某些屬性的值

這裡用一段示例徹底搞懂merge，此示例為Map結構，List與Map原理相同

 const Map1 = Immutable.fromJS({a:111,b:222,c:{d:333,e:444}});
 const Map2 = Immutable.fromJS({a:111,b:222,c:{e:444,f:555}});

 const Map3 = Map1.merge(Map2);
  //Map {a:111,b:222,c:{e:444,f:555}}
 const Map4 = Map1.mergeDeep(Map2);
  //Map {a:111,b:222,c:{d:333,e:444,f:555}}
 const Map5 = Map1.mergeWith((oldData,newData,key)=>{
      if(key === 'a'){
        return 666;
      }else{
        return newData
      }
    },Map2);
  //Map {a:666,b:222,c:{e:444,f:555}}

序列演算法

concat()

作用：物件的拼接，用法與js陣列中的concat()相同，返回一個新的物件。

用法：const List = list1.concat(list2)

map()

作用：遍歷整個物件，對Map/List元素進行操作，返回一個新的物件。

用法：

Map({a:1,b:2}).map(val=>10*val)
//Map{a:10,b:20}

Map特有的mapKey()

作用：遍歷整個物件，對Map元素的key進行操作，返回一個新的物件。

用法：

Map({a:1,b:2}).mapKey(val=>val+'l')
//Map{al:10,bl:20}

Map特有的mapEntries()

作用：遍歷整個物件，對Map元素的key和value同時進行操作，返回一個新的物件。Map的map()也可實現此功能。

用法：

Map({a:1,b:2}).map((key,val)=>{
  return [key+'l',val*10]
})
//Map{al:10,bl:20}

過濾 filter

作用：返回一個新的物件，包括所有滿足過濾條件的元素

用法：

Map({a:1,b:2}).filter((key,val)=>{
  return val == 2
})
//Map{b:2}

還有一個filterNot()方法，與此方法正好相反。

反轉 reverse

作用：將資料的結構進行反轉

程式碼示例：

Immutable.fromJS([1, 2, 3, 4, 5]).reverse();
// List [5,4,3,2,1]
Immutable.fromJS({a:1,b:{c:2,d:3},e:4}).recerse();
//Map {e:4,b:{c:2,d:3},a:1}

排序 sort & sortBy

作用：對資料結構進行排序

程式碼示例：

///List
Immutable.fromJS([4,3,5,2,6,1]).sort()
// List [1,2,3,4,5,6]
Immutable.fromJS([4,3,5,2,6,1]).sort((a,b)=>{
  if (a < b) { return -1; }
  if (a > b) { return 1; }
  if (a === b) { return 0; }
})
// List [1,2,3,4,5,6]
Immutable.fromJS([{a:3},{a:2},{a:4},{a:1}]).sortBy((val,index,obj)=>{
  return val.get('a')
},(a,b)=>{
  if (a < b) { return -1; }
  if (a > b) { return 1; }
  if (a === b) { return 0; }
})
//List  [ {a:3}, {a:2}, {a:4}, {a:1} ]

//Map

Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sort()
//Map {b: 1, c: 2, a: 3, d: 5}
Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sort((a,b)=>{
  if (a < b) { return -1; }
  if (a > b) { return 1; }
  if (a === b) { return 0; }
})
//Map {b: 1, c: 2, a: 3, d: 5}
Immutable.fromJS( {b:1, a: 3, c: 2, d:5} ).sortBy((value, key, obj)=> {
  return value
})
//Map {b: 1, c: 2, a: 3, d: 5}

分組 groupBy

作用：對資料進行分組

const listOfMaps = List([
  Map({ v: 0 }),
  Map({ v: 1 }),
  Map({ v: 1 }),
  Map({ v: 0 }),
  Map({ v: 2 })
])
const groupsOfMaps = listOfMaps.groupBy(x => x.get('v'))
// Map {
//   0: List [ Map{ "v": 0 }, Map { "v": 0 } ],
//   1: List [ Map{ "v": 1 }, Map { "v": 1 } ],
//   2: List [ Map{ "v": 2 } ],
// }

查詢資料

indexOf() 、 lastIndexOf Map不存在此方法

作用：和js陣列中的方法相同，查詢第一個或者最後一個value的index值，找不到則返回-1

用法：

Immutable.fromJS([1,2,3,4]).indexof(3) //2
Immutable.fromJS([1,2,3,4]).lastIndexof(3) //2

findIndex() 、 findLastIndex() Map不存在此方法

作用：查詢滿足要求的元素的index值

用法：

Immutable.fromJS([1,2,3,4]).findIndex((value,index,array)=>{
  return value%2 === 0;
})   // 1
Immutable.fromJS([1,2,3,4]).findLastIndex((value,index,array)=>{
  return index%2 === 0;
})  // 3

find() 、 findLast()

作用：查詢滿足條件的元素的value值

用法：

Immutable.fromJS([1,2,3,4]).find((value,index,array)=>{
  return value%2 === 0;
})  // 2

Immutable.fromJS([1,2,3,4]).findLast((value,index,array)=>{
  return value%2 === 0;
})  // 4

findKey() 、 findLastKey()

作用：查詢滿足條件的元素的key值

用法：

Immutable.fromJS([1,2,3,4]).findKey((value,index,array)=>{
  return value%2 === 0;
})  // 1

Immutable.fromJS([1,2,3,4]).findLastKey((value,index,array)=>{
  return value%2 === 0;
})  // 3

findEntry() 、 findLastEntry()

作用：查詢滿足條件的元素的鍵值對 key:value

用法：

Immutable.fromJS([1,2,3,4]).findEntry((value,index,array)=>{
  return value%2 === 0;
})  // [1,2]

Immutable.fromJS([1,2,3,4]).findLastEntry((value,index,array)=>{
  return value%2 === 0;
})  // [3,4]

keyOf() lastKeyOf()

作用：查詢某一個value對應的key值

用法：

Immutable.fromJS([1,2,3,4]).keyOf(2) //1
Immutable.fromJS([1,2,3,4]).lastKeyOf(2) //1

max() 、 maxBy()

作用：查詢最大值

用法:

Immutable.fromJS([1, 2, 3, 4]).max() //4

Immutable.fromJS([{a;1},{a:2},{a: 3},{a:4}]).maxBy((value,index,array)=>{
  return value.get('a')
})  //{a:4}

min() 、 minBy()

作用：查詢最小值

用法:

Immutable.fromJS([1, 2, 3, 4]).min() //1

Immutable.fromJS([{a;1},{a:2},{a: 3},{a:4}]).minBy((value,index,array)=>{
  return value.get('a')
})  //{a:1}

建立子集

slice()

作用： 和原生js中陣列的slice陣列一樣，包含兩個引數，start和end，start代表開始擷取的位置，end代表結束的位置，不包括第end的元素。若不包括end，則返回整個物件，若end為負數，則返回（start，length-end）對應的資料。若start只有一個並且為負數，則返回最後的end個元素。

用法：

Immutable.fromJS([1, 2, 3, 4]).slice(0); //[1,2,3,4]
Immutable.fromJS([1, 2, 3, 4]).slice(0,2); //[1,2]
Immutable.fromJS([1, 2, 3, 4]).slice(-2); //[3,4]
Immutable.fromJS([1, 2, 3, 4]).slice(0,-2); //[1,2]

rest()

作用：返回除第一個元素之外的所有元素

用法:Immutable.fromJS([1, 2, 3, 4]).rest()//[2,3,4]

butLast()

作用：返回除最後一個元素之外的所有元素

用法:Immutable.fromJS([1, 2, 3, 4]).rest()//[1,2,3]

skip()

作用：有一個引數n, 返回截掉前n個元素之後剩下的所有元素

用法:Immutable.fromJS([1, 2, 3, 4]).skip(1)//[2,3,4]

skipLast()

作用：有一個引數n, 返回截掉最後n個元素之後剩下的所有元素

用法:Immutable.fromJS([1, 2, 3, 4]).skip(1)//[1,2,3]

skipWhile()

作用：返回從第一次返回false之後的所有元素

Immutable.fromJS([1, 2, 3, 4]).skipWhile(list.skipWhile((value,index,list)=>{
  return value > 2;
}))// [1,2,3,4]

skipUntil()

作用：返回從第一次返回true之後的所有元素

Immutable.fromJS([1, 2, 3, 4]).skipUntil(list.skipWhile((value,index,list)=>{
  return value > 2;
}))// [3,4]

take()

作用：有一個引數n, 返回前n個元素

用法:Immutable.fromJS([1, 2, 3, 4]).take(2)//[1,2]

takeLast()

作用：有一個引數n, 返回最後n個元素

用法:Immutable.fromJS([1, 2, 3, 4]).takeLast(2)//[3,4]

takeWhile()

作用：返回從第一次返回false之前的所有元素

Immutable.fromJS([1, 2, 3, 4]).skipWhile(list.takeWhile((value,index,list)=>{
  return value > 2;
}))// []

takeUntil()

作用：返回從第一次返回true之前的所有元素

Immutable.fromJS([1, 2, 3, 4]).skipUntil(list.takeUntil((value,index,list)=>{
  return value > 2;
}))// [1,2]

處理資料

reduce()

作用：和js中陣列中的reduce相同,按索引升序的順序處理元素

用法：

Immutable.fromJS([1,2,3,4]).reduce((pre,next,index,arr)=>{
  console.log(pre+next)
  return pre+next; 
})
// 3 6 10

reduceRight()

作用：和js中陣列中的reduce相同,按索引降序的順序處理元素

用法：

Immutable.fromJS([1,2,3,4]).reduceRight((pre,next,index,arr)=>{
  console.log(pre+next)
  return pre+next; 
})
// 7 9 10

every()

作用：判斷整個物件總中所有的元素是不是都滿足某一個條件，都滿足返回true，反之返回false。

程式碼：

Immutable.fromJS([1,2,3,4]).every((value,index,arr)=>{
  return value > 2
}) // false

some()

作用：判斷整個物件總中所有的元素是不是存在滿足某一個條件的元素，若存在返回true，反之返回false。

程式碼：

Immutable.fromJS([1,2,3,4]).some((value,index,arr)=>{
  return value > 2
}) // true

join()

作用：同js中陣列的join方法。把準換為字串

用法：Immutable.fromJS([1,2,3,4]).join(',') //1,2,3,4

isEmpty()

作用：判斷是否為空

用法:

Immutable.fromJS([]).isEmpty(); // true
Immutable.fromJS({}).isEmpty(); // true

count()

作用：返回元素個數，可自定義條件，返回滿足條件的個數

用法：

const list = Immutable.fromJS([1,2,3,4]);
const map = Immutable.fromJS({a:1,b:2,c:3,d:4});

list.count((value,index,list)=>{
  return value > 2;
})    //2

map.count((value,index,list)=>{
  return value > 2;
})    //2

countBy()

作用：與count不同的是，countBy返回一個物件

用法：

const list = Immutable.fromJS([1,2,3,4]);
const map = Immutable.fromJS({a:1,b:2,c:3,d:4});

list.countBy((value,index,list)=>{
  return value > 2;
} //{false: 2, true: 2}

map.countBy((value,index,list)=>{
  return value > 2;
} //{false: 2, true: 2}

相關推薦

Immutable.js中在react的運用

Immutable 的幾種資料型別 List: 有序索引集，類似JavaScript中的Array。 Map: 無序索引集，類似JavaScript中的Object。 OrderedMap: 有序的Map，根據資料的set()進行排序。 Set: 沒有重複

（譯）函式式元件在Vue.js中的運用

你是否曾經遇到過這樣一個場景，你有個需求需要引入一個第三方庫，然而你只需要使用這個庫裡面某一個功能，如果這個庫不支援分模組匯出的話，就會因為引入整個庫而導致專案體積變大，進而影響專案載入效能。 再比如，下拉列表、時間選擇器或者自動填充屬性等自定義控制元件都是非常複雜的，需要考慮很多邊緣的複雜

js 中prototype運用（陣列）

 /*   *  方法:Array.removeAt(Index)   *  功能:刪除陣列元素.   *  引數:Index刪除元素的下標.&n

Immutable.js 以及在 react+redux 專案中的實踐

來自一位美團大牛的分享，相信可以幫助到你。 原文連結：https://juejin.im/post/5948985ea0bb9f006bed7472?utm_source=tuicool&utm_medium=referral 前言   本文主要介紹facebook推出的一個類庫

如何理解和熟練運用js中的call及apply？

tex app 前端開發 對象 方便 有一個 ons arguments 定義 在前端開發過程中，我們經常需要改變this指向，通常我們想到的就是用call方法，但是對於call的理解很多人不是很清晰，那麽下面小提莫就給大家詳細說一說call和apply的詳細知識。 cal

React:JS中的this和箭頭函數

-c c++ upload per 初始 正常 develop pan pre JS中的this和純面向對象（java，c++）中的this有點不大一樣，其原因就是作用域不同，導致JS中的this的指向不明確，在java中的this指當前對象的this或當前類的this，在

js中位運算子的運用

js中位運算子的運用 位操作符的優勢在於它執行相同的操作執行速度更快。 位運算子取整 // 異或運算取整::位運算只對整數有效，遇到小數時，會將小數部分捨去，只保留整數部分。所以，將一個小數與0進行或運算，等同於對該數去除小數部分，即取整數位。 12.

使用immutable.js來管理store中的資料

安裝： yarn add immutable 將state變為immutable物件，以防止state被改變 import { fromJs } from 'immutable' fromJs 方法可以把一個js物件轉化為一個immutable物件； 利用這個方法把state

react+node.js中body-parser外掛傳送post請求,拿不到req.body問題

只需要把body-parser放在user.js檔案前面引入 sever.js const express = require('express') const bodyParser = require('body-parser') const use

JS中BootStrap效果的運用——表格列印

描述： JS中BootStrap效果的運用——表格列印 主要是引用檔案，教程https://blog.csdn.net/qlwangcong518/article/details/86032763 效果： 程式碼： <!DOCTYPE html> <h

countUp.js在react中的應用

公司專案需要做一個數字顯示器，讓我找到一個有趣的專案——CountUp.js。它是一個免費的輕量級javaScript工具，可用於快速建立動畫，以更有趣的方式顯示數字資料。作用：動畫顯示數字，千位分隔符，新增前後綴等等。 github在countUp的Gi

React.js中ES6 和 ES5寫法的一些差別

1、 Modules引入和輸出方式 ES5 使用 CommonJS 標準，一般使用 require() 用法引入模組： var React = require('react'); var MyComponent = require('./MyComponen

在JS中Function()和this的巧妙運用

1.構造器呼叫模式當我們把一個函式前面帶上new來呼叫,則相同於 java中的實體初始化賦值,函式內建屬性都會賦值123456789101112131415161718192021functiontes

一個結合map函式與React.js中的this.props.children結合的例子

題目： 實現一個元件 BlackBorderContianer，它會把作為它的巢狀結構的 每個直接子元素 都用一個黑色邊框的 div 包裹起來。例如： <BlackBorderContainer> <div classN

js中回撥函式的運用

在javascript中，會經常用到回撥的方式，比如，當某一請求執行完成後，要完成某一指定的動作，但是程式無法知道請求什麼時候完成，這時我們便可以使用回撥來實現，像ajax就用到了回撥的概念。下面，筆者列舉自己在專案中用到的兩個例項。 例項一、ajax請求遮罩

redux在react-native中的運用

利用下班回家後的時間、週末的時間學習。因為比較喜歡記筆記，所以整理完自己的筆記，也就懶得寫部落格，今天有時間，一下子寫三篇哈哈哈。。。 看下我自己寫的筆記，字有點醜： 寫一個redux運用的例子： 效果圖 一、先安裝內容： 1、安裝外掛 2、首先先寫好框架

JS中showModalDialog 詳細使用

button 開發者 設置 方式 log () model lan and 基本介紹： showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持)

js中cookie的使用具體分析

一個 全局變量 加密 下使用 txt 保存 返回 每次 格式 JavaScript中的還有一個機制：cookie，則能夠達到真正全局變量的要求。 cookie是瀏覽器 提供的一種機制，它將document 對象的cookie屬性提供給Jav

JS中isPrototypeOf 和hasOwnProperty 的區別

另一個 strong 是否 指定 不同 名稱 功能 成員 eof 1、isPrototypeOf isPrototypeOf是用來判斷指定對象object1是否存在於另一個對象object2的原型鏈中，是則返回true，否則返回false。 格式如下： object1.is

JS中創造構建函數的方法

blog 構造函數 span prot logs 一模一樣 原型 pre pan 1.工廠模式 1 function CreatObject(){ 2 var obj = new Object(); 3 obj.name = "zackbee"; 4