說(shuō)到j(luò)avascript這門(mén)語(yǔ)言，相信大家都不陌生。javascript可以在網(wǎng)頁(yè)中動(dòng)態(tài)地更新HTML、CSS和網(wǎng)頁(yè)中的圖片，可以實(shí)現(xiàn)與用戶的互動(dòng)，讓網(wǎng)頁(yè)變得更加生動(dòng)有趣。但是javascript的知識(shí)點(diǎn)非常多，資料也很豐富，那么我們?cè)趯W(xué)習(xí)javascript的時(shí)候應(yīng)該如何查找資料呢？

首先，我們可以從官方文檔入手。javascript的官方文檔在MDN（Mozilla Developer Network）網(wǎng)站上可以找到，地址為https://developer.mozilla.org/zh-CN/docs/Web/JavaScript，該網(wǎng)站提供了非常多的javascript相關(guān)資料，包括javascript基礎(chǔ)教程、ES6、DOM等內(nèi)容。舉個(gè)例子，在MDN網(wǎng)站上，我們可以查找字符串相關(guān)ES6新特性，我們可以看下面的例子：

let str = 'Hello World';
console.log(str.startsWith('H')); // true
console.log(str.endsWith('d')); // true
console.log(str.includes('o')); // true
console.log(str.repeat(2)); // 'Hello WorldHello World'

上面的代碼展示了ES6新特性中字符串的新方法，我們可以使用startsWith()來(lái)判斷一個(gè)字符串是否以另一個(gè)字符串開(kāi)頭，使用endsWith()來(lái)判斷一個(gè)字符串是否以另一個(gè)字符串結(jié)尾，使用includes()來(lái)判斷一個(gè)字符串中是否包含另一個(gè)字符串，使用repeat()來(lái)重復(fù)一個(gè)字符串若干次。這就是查閱官方文檔時(shí)可以得到的知識(shí)。

其次，我們可以查閱一些javascript的經(jīng)典書(shū)籍。經(jīng)典的javascript書(shū)籍很多，像《JavaScript高級(jí)程序設(shè)計(jì)》、《JavaScript權(quán)威指南》等，這些書(shū)籍可以幫助我們更好地理解javascript的一些概念和使用方法。比如下面的代碼：

function debounce(fn, delay) {
let timer = null;
return function() {
clearTimeout(timer);
timer = setTimeout(() =>{
fn.apply(this, arguments);
}, delay);
}
}
function log() {
console.log('scroll event');
}
window.addEventListener('scroll', debounce(log, 500));

上面的代碼展示了一個(gè)函數(shù)防抖的示例，當(dāng)使用者滾動(dòng)頁(yè)面時(shí)，會(huì)頻繁地觸發(fā)scroll事件，可以使用函數(shù)防抖來(lái)減少函數(shù)的執(zhí)行次數(shù)，從而減少頁(yè)面的資源消耗。具體防抖函數(shù)的實(shí)現(xiàn)可以參考上面的代碼。

最后，我們可以查閱一些開(kāi)源項(xiàng)目的javascript代碼。開(kāi)源項(xiàng)目是一種很好的學(xué)習(xí)資源，我們可以通過(guò)查閱一些優(yōu)秀的開(kāi)源項(xiàng)目代碼來(lái)學(xué)習(xí)javascript的使用方法和最佳實(shí)踐。比如，我們可以查看jQuery等一些著名的javascript庫(kù)的源碼，下面是一段簡(jiǎn)單的jQuery動(dòng)畫(huà)代碼：

$.fn.animateClip = function (options) {
var defaults = {
direction: ['top', 'left'],
target: null,
duration: 500,
start: 'auto',
end: 'auto',
complete: function () { }
};
var opts = $.extend(true, {}, defaults, options);
this.each(function () {
var $this = $(this);
var start = {}, end = {};
var h = $this.height();
var w = $this.width();
if (opts.start === 'auto') {
opts.start = '0 ' + h + 'px';
}
if (opts.end === 'auto') {
opts.end = w + 'px 0';
}
var starts = opts.start.split(' ');
var ends = opts.end.split(' ');
for (var i = 0; i< opts.direction.length; i++) {
start[opts.direction[i]] = starts[i];
end[opts.direction[i]] = ends[i];
}
if (!opts.target) {
opts.target = $this;
}
opts.target.css({
clip: 'rect(' + start.top + ' ' + start.right + ' ' + start.bottom + ' ' + start.left + ')',
position: 'absolute'
}).animate({
clip: 'rect(' + end.top + ' ' + end.right + ' ' + end.bottom + ' ' + end.left + ')'
}, {
duration: opts.duration,
complete: opts.complete
});
});
return this;
};

這段代碼展示了一個(gè)jQuery動(dòng)畫(huà)插件的代碼，該插件可以對(duì)指定的元素進(jìn)行裁剪動(dòng)畫(huà)，具有很好的可配置性和拓展性，學(xué)習(xí)該插件的源碼可以學(xué)習(xí)到j(luò)Query的使用方法以及動(dòng)畫(huà)插件的編寫(xiě)方法。

以上就是我總結(jié)的javascript學(xué)習(xí)資料的查閱方法，希望對(duì)大家有所幫助。