如何在javascript中访问函数范围外的变量

如何在javascript中访问函数范围外的变量,javascript,Javascript,我编写了简单的javascript类来使用浏览器的录音功能 我在initAudio范围内有变量mediaRecorder,我想访问它 在另一个函数中开始记录 我怎么做 navigator.getUserMedia = ( navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia );

我编写了简单的javascript类来使用浏览器的录音功能 我在initAudio范围内有变量mediaRecorder,我想访问它 在另一个函数中开始记录

我怎么做

navigator.getUserMedia = ( navigator.getUserMedia ||
        navigator.webkitGetUserMedia ||
        navigator.mozGetUserMedia ||
        navigator.msGetUserMedia );
var audioCtx = new ( window.AudioContext || window.webkitAudioContext )();
var analyser = audioCtx.createAnalyser();
var scriptProcessor = audioCtx.createScriptProcessor( 2048, 1, 1 );
var chunks = [ ], input = null;
var mediaRecorder;
analyser.smoothingTimeConstant = 0.3;
analyser.fftSize = 1024;

var AudioRecorder = function( element ) {

    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
    navigator.getUserMedia( { audio: true }, function( stream ) {
        initAudio( stream );
    }, function( err ) {
        console.log( 'usermedia error', err );
    } );

    var initAudio = function( stream ) {
        input = audioCtx.createMediaStreamSource( stream );
        mediaRecorder = new MediaRecorder( stream );

        mediaRecorder.ondataavailable = function( e ) {
            chunks.push( e.data );
        };

        mediaRecorder.onstop = function( e ) {
            console.log( "data available after MediaRecorder.stop() called." );
            var blob = new Blob( chunks, { 'type': 'audio/ogg; codecs=opus' } );
            chunks = [ ];

            var audioURL = window.URL.createObjectURL( blob );
            document.getElementById( 'blo' ).href = audioURL;
            console.log( audioURL );
        };

    };

    this.startRecording = function() {
        console.log( mediaRecorder );
        mediaRecorder.start();
        console.log( mediaRecorder.state );
        console.log( "recorder started" );
        this.isRecording = true;
    };

    this.stopRecording = function() {
        mediaRecorder.stop();
        console.log( mediaRecorder.state );
        console.log( "recorder stopped" );
    };

};

var element = document.getElementById( 'mediaPlayer' );
var record = new AudioRecorder( element );
record.startRecording();
像这样的

function foo() {
  ...
  return {
    startRecording: function() { ... },
    stopRecording: function() { ... }
  }
}

我检查了你的代码,这看起来还可以

问题不在于范围变量问题。我认为不会执行init()函数,因为不存在流向web页面的流

我做了一些修改来证明这一点

var audioCtx = new ( window.AudioContext || window.webkitAudioContext )();
var analyser = audioCtx.createAnalyser();
var scriptProcessor = audioCtx.createScriptProcessor( 2048, 1, 1 );
var chunks = [ ], input = null;
var mediaRecorder = null;
analyser.smoothingTimeConstant = 0.3;
analyser.fftSize = 1024;

var AudioRecorder = function( element ) {

/***navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
        navigator.getUserMedia( { audio: true }, function( stream ) {
            initAudio( stream );
        }, function( err ) {
            console.log( 'usermedia error', err );
        } );***/
        // First get User Media
        var md = navigator.mediaDevices.getUserMedia({ video: true, audio: true });
        md.then(function(mediaStream) {
            console.log('Media function');
            this.initAudio( stream );
        });
        md.catch(function(err) { console.log('usermedia error', err); }); // always check for errors at the end

        var initAudio = function( stream ) {
            input = audioCtx.createMediaStreamSource( stream );
            mediaRecorder = new MediaRecorder( stream );

            mediaRecorder.ondataavailable = function( e ) {
                chunks.push( e.data );
            };

            mediaRecorder.onstop = function( e ) {
                console.log( "data available after MediaRecorder.stop() called." );
                var blob = new Blob( chunks, { 'type': 'audio/ogg; codecs=opus' } );
                chunks = [ ];

                var audioURL = window.URL.createObjectURL( blob );
                document.getElementById( 'blo' ).href = audioURL;
                console.log( audioURL );
            };

        };

        this.startRecording = function() {
            console.log( mediaRecorder );
            mediaRecorder.start();
            console.log( mediaRecorder.state );
            console.log( "recorder started" );
            this.isRecording = true;
        };

        this.stopRecording = function() {
            mediaRecorder.stop();
            console.log( mediaRecorder.state );
            console.log( "recorder stopped" );
        };

    };

    var element = document.getElementById( 'mediaPlayer' );
    var record = new AudioRecorder( element );
    record.startRecording();
这些参考资料可能对您有用:


在特殊情况下,我面临音频录制@AmericanSlime的问题。无论使用何种编码方式,您都可能出错。您的代码样式看起来不错,但快速查看之后,我不禁注意到您在一个函数中声明了
mediaRecorder
变量,而稍后尝试在另一个函数中使用它,这超出了它的范围。您可能希望修复一些bug并继续使用现有的类。。。尽管如此,学习新事物并没有错;)我重写了我的问题,请试着回答