此问题与我的previous question有关,因此我将在此处添加与示例相同的代码。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="http://www.flotcharts.org/flot/jquery.flot.js" type="text/javascript"></script>
</head>
<body>
<h1>Audio Spectrum</h1>
<div id="placeholder" style="width:400px; height:200px; display: inline-block;">
</div>
<script>
var microphone;
var analyser;
var convolver;
//user media
navigator.getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
if (navigator.getUserMedia) {
console.log('getUserMedia supported.');
navigator.getUserMedia(
// constraints - only audio needed for this app
{
audio : true,
echoCancellation : true
},
// Success callback
user_media_setup,
// Error callback
function(err) {
console.log('The following gUM error occured: ' + err);
});
} else {
console.log('getUserMedia not supported on your browser!');
};
function user_media_setup(stream) {
console.log('user media setup');
// set up forked web audio context, for multiple browsers
// window. is needed otherwise Safari explodes
audioCtx = new (window.AudioContext || window.webkitAudioContext)();
//microphone
microphone = audioCtx.createMediaStreamSource(stream);
//analyser
analyser = audioCtx.createAnalyser();
analyser.fftSize = 1024;
analyser.smoothingTimeConstant = 0.85;
//convolver
convolver = audioCtx.createConvolver();
convolver.normalize = true;
convolverBuffer = audioCtx.createBuffer(1, 1, audioCtx.sampleRate);
// convolverBuffer[0] = 1; //wrong
convolverChannel = convolverBuffer.getChannelData(0);
convolverChannel[0] = 1;
convolver.buffer = convolverBuffer;
//connectivity
var use_convolver = false;
if (use_convolver) {
//through convolver:
microphone.connect(convolver);
convolver.connect(analyser);
} else {
//direct:
microphone.connect(analyser);
}
visualize();
}
function visualize() {
console.log('visualize');
dataArray = new Float32Array(analyser.frequencyBinCount);
draw = function() {
analyser.getFloatFrequencyData(dataArray);
var data = [];
for (var i = 0; i < dataArray.length; i++) {
freq = audioCtx.sampleRate * i / dataArray.length / 2;
data.push([freq, dataArray[i]]);
}
var options = {
yaxis : {
min : -200,
max : 0
}
};
$.plot("#placeholder", [data], options);
window.requestAnimationFrame(draw);
};
window.requestAnimationFrame(draw);
}
</script>
</body>
</html>
现在我需要知道是否可以以某种方式绑定这两个函数,而不会影响来自另一个对象的Ease.bezier = function(mX1, mY1, mX2, mY2) {
return _bezier.processBezier(mX1, mY1, mX2, mY2);
};
var _bezier = Ease.bezier.prototype;
_bezier.processBezier = function (mX1, mY1, mX2, mY2) {
return _bezier.render; // this is where I need the `this`, mX1, mY1, mX2, mY2 to be passed into the next function
};
_bezier.render = function(aX){ //the aX value here comes from another object
var mX1 = [bound function attributes[1]]; // I think you can understand what I mean here
if (mX1 === mY1 && mX2 === mY2) return aX;
if (aX === 0) return 0;
if (aX === 1) return 1;
return _bezier.computeBezier(_bezier.gx(aX), mY1, mY2);
};
值,并且可以访问aX
和this
个参数到第二个功能
有可能吗?我该怎么办?
答案 0 :(得分:2)
你可以像这样使用arguments
对象吗?
_bezier.processBezier = function (mX1, mY1, mX2, mY2) {
return _bezier.render.bind(this, arguments); // <--- bind all the arguments and the context "this"
};
_bezier.render = function(){ // <--- aX is not required anymore instead use arguments object
var args = arguments[0]; // <--- this corresponds to [mX1, mY1, mX2, mY2]
var aX = arguments[1]; // <--- this corresponds to aX now
if (args[0] === args[1] && args[2] === args[3]) return aX; // <--- notice args object here
if (aX === 0) return 0;
if (aX === 1) return 1;
return _bezier.computeBezier(_bezier.gx(aX), mY1, mY2);
};