【移動(dòng)應(yīng)用開發(fā)技術(shù)】小程序開發(fā)中如何使用Underscore.js

【移動(dòng)應(yīng)用開發(fā)技術(shù)】小程序開發(fā)中如何使用Underscore.js

這篇文章主要介紹小程序開發(fā)中如何使用Underscore.js，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！前言Underscore.js是一個(gè)很精干的庫(kù)，壓縮后只有4KB。Underscore提供了100多個(gè)函數(shù)，包括常用的：map、filter、invoke—當(dāng)然還有更多專業(yè)的輔助函數(shù)，如：函數(shù)綁定、JavaScript模板功能、創(chuàng)建快速索引、強(qiáng)類型相等測(cè)試等等。彌補(bǔ)了標(biāo)準(zhǔn)庫(kù)的不足，大大方便了JavaScript的編程。微信小程序無(wú)法直接使用require('underscore.js')進(jìn)行調(diào)用。微信小程序模塊化機(jī)制微信小程序運(yùn)行環(huán)境支持CommoJS模塊化，通過(guò)module.exports暴露對(duì)象，通過(guò)require來(lái)獲取對(duì)象。微信小程序QuickStartutils/util.jsfunction

formatTime(date)

{

var

year

=

date.getFullYear()

var

month

=

date.getMonth()

+

1

var

day

=

date.getDate()

var

hour

=

date.getHours()

var

minute

=

date.getMinutes()

var

second

=

date.getSeconds();

return

[year,

month,

day].map(formatNumber).join('/')

+

'

'

+

[hour,

minute,

second].map(formatNumber).join(':')

}

function

formatNumber(n)

{

n

=

n.toString()

return

n[1]

?

n

:

'0'

+

n

}

module.exports

=

{

formatTime:

formatTime

}pages/log/log.jsvar

util

=

require('../../utils/util.js')

Page({

data:

{

logs:

[]

},

onLoad:

function

()

{

this.setData({

logs:

(wx.getStorageSync('logs')

||

[]).map(function

(log)

{

return

util.formatTime(new

Date(log))

})

})

}

})原因分析UnderscoreCommonJs模塊導(dǎo)出代碼如下：//

Export

the

Underscore

object

for

**Node.js**,

with

//

backwards-compatibility

for

the

old

`require()`

API.

If

we're

in

//

the

browser,

add

`_`

as

a

global

object.

if

(typeof

exports

!==

'undefined')

{

if

(typeof

module

!==

'undefined'

&&

module.exports)

{

exports

=

module.exports

=

_;

}

exports._

=

_;

}

else

{

root._

=

_;

}exports、module必須都有定義，才能導(dǎo)出。通過(guò)測(cè)試，微信小程序運(yùn)行環(huán)境exports、module并沒(méi)有定義//index.js

//獲取應(yīng)用實(shí)例

var

app

=

getApp();

Page({

onLoad:

function

()

{

console.log('onLoad');

var

that

=

this;

console.log('typeof

exports:

'

+

typeof

exports);

console.log('typeof

module:

'

+

typeof

exports);

var

MyClass

=

function()

{

}

module.exports

=

MyClass;

console.log('typeof

module.exports:

'

+

typeof

module.exports);

}

})解決方法修改Underscore代碼，注釋原有模塊導(dǎo)出語(yǔ)句，使用module.exports=_強(qiáng)制導(dǎo)出

/*

//

Export

the

Underscore

object

for

**Node.js**,

with

//

backwards-compatibility

for

the

old

`require()`

API.

If

we're

in

//

the

browser,

add

`_`

as

a

global

object.

if

(typeof

exports

!==

'undefined')

{

if

(typeof

module

!==

'undefined'

&&

module.exports)

{

exports

=

module.exports

=

_;

}

exports._

=

_;

}

else

{

root._

=

_;

}

*/

module.exports

=

_;

/*

//

AMD

registration

happens

at

the

end

for

compatibility

with

AMD

loaders

//

that

may

not

enforce

next-turn

semantics

on

modules.

Even

though

general

//

practice

for

AMD

registration

is

to

be

anonymous,

underscore

registers

//

as

a

named

module

because,

like

jQuery,

it

is

a

base

library

that

is

//

popular

enough

to

be

bundled

in

a

third

party

lib,

but

not

be

part

of

//

an

AMD

load

request.

Those

cases

could

generate

an

error

when

an

//

anonymous

define()

is

called

outside

of

a

loader

request.

if

(typeof

define

===

'function'

&&

define.amd)

{

define('underscore',

[],

function()

{

return

_;

});

}

*/使用Underscore.js//index.js

var

_

=

require(

'../../libs/underscore/underscore.modified.js'

);

//獲取應(yīng)用實(shí)例

var

app

=

getApp();

Page(

{

onLoad:

function()

{

//console.log('onLoad');

var

that

=

this;

var

lines

=

[];

lines.push(

"_.map([1,

2,

3],

function(num){

return

num

*

3;

});"

);

lines.push(

_.map(

[

1,

2,

3

],

function(

num

)

{

return

num

*

3;

})

);

lines.push(

"var

sum

=

_.reduce([1,

2,

3],

function(memo,

num){

return

memo

+

num;

},

0);"

);

lines.push(

_.reduce(

[

1,

2,

3

],

function(

memo,

num

)

{

return

memo

+

num;

},

0

)

);

lines.push(

"var

even

=

_.find([1,

2,

3,

4,

5,

6],

function(num){

return

num

%

2

==

0;

});"

);

lines.push(

_.find(

[

1,

2,

3,

4,

5,

6

],

function(

num

)

{

return

num

%

2

==

0;

})

);

lines.push(

"_.sortBy([1,

2,

3,

4,

5,

6],

function(num){

return

Math.sin(num);

});"

);

lines.push(

_.sortBy(

[

1,

2,

3,