Atribuir uma variável PhP para Javascript não é uma tarefa fácil. Não podemos simplesmente abrir uma tag PhP e usar o comando echo dentro de um bloco javascript, pois o mesmo não funciona dependendo da ocasião.
Neste artigo veremos como podemos passar uma variável e até mesmo objetos em PhP para o Javascript de maneira direta e muito simples, sem usar json ou ajax, nem mesmo Jquery.

Atenção: você já deve ter ouvido isso muitas vezes (e lido rsrs), mas nunca se esqueça que PhP é uma linguagem do lado do servidor, enquanto Javascript trabalha do lado do cliente. Esteja sempre ciente disso, pois se você precisa utilizar a comunicação de linguagem do lado servidor para se comunicar diretamente com a linguagem do lado do cliente, tenha cautela, pois talvez você tenha traçado uma estrutura delicada em seu projeto. Não digo que é errado, pois algumas coisas não tem como serem evitadas. Um exemplo disso é aqui mesmo no blog, onde precisei utilizar a comunicação de PhP com Javascript para o campo de pesquisa que temos na home do blog.
O campo de pesquisa deste blog utiliza uma função chamada pesquisa dinâmica que eu ensino como fazê-la neste artigo aqui [ainda não publicado]. Lembrando que este artigo que você está lendo agora é um complemento para a pesquisa dinâmica.

Sem mais delongas, vamos lá.

Variáveis simples

Creio que todas as pessoas que iniciaram seus estudos com PhP e já possuiam conhecimento prévio com JavaScript, algum dia na vida, teve a inocencia de tentar:

E isso realmente não funciona.

O que funciona?
Também é bem comum quando estamos aprendendo.. cof cof programando PhP utilizar comandos como:

 alert("+$texto+") ";
?>
	

E dessa maneira funciona.
Sabemos também que, caso em um arquivo html você referencie um arquivo .js no começo do body, e esse arquivo .js tem uma variável global var olaMundo = "Olá, Mundo."; , podemos declarar um outro arquivo .js no final da tag body e ele também terá acesso ao conteúdo da variável olaMundo desde que não haja fatores internos que impessam isso.

Sabendo disso, considere o seguinte código:

	
		
	
	
	

		";
			$fimScript = "";
			$criaVar = "var mensagem = 'Olá, Mundo.';";
			$script = $inicioScript.$mensagem.$fimScript;
			echo $script;
		?>


		
Testando uma variável Javascript passada pelo PhP
		
			
		
		


		


	

Isso funciona.
Isso acontece porque você não está jogando a variável dentro da tag de script. Você pode transferir qualquer dado para o javascript utilizando este método, desde que você utilize o echo antes de chamar o arquivo .js ou abrir a tag script que irá utilizar tal variável.

Objetos e Arrays

Considere a classe em PhP:

";
	private static $fimScript = "";
	
	function __construct($nome, $sobrenome, $altura) {
       $this->setNome($nome);
	   $this->setSobrenome($sobrenome);
	   $this->setIdade($altura);
    }
	
	function criaObjJS(){
		$pessoaNomeJS = "nome: '"+$nome+"', ";
		$pessoaSobrenomeJS = "sobrenome: '"+$sobrenome+"', ";
		$pessoaAlturaJS = "altura: "+$altura+"";
		$pessoaJS = "var pessoa = { "+pessoaNomeJS.pessoaSobrenomeJS.pessoaAlturaJS+" };";
		$script = Pessoa::$inicioScript.$pessoaJS.Pessoa::$fimScript;
		// 
		return $script;
	}
	
	function criaArrayJS(){
		$pessoaNomeJS = "'"+$nome+"', ";
		$pessoaSobrenomeJS = "'"+$sobrenome+"', ";
		$pessoaAlturaJS = $altura;
		$pessoaJS = "var pessoa = [ "+pessoaNomeJS.pessoaSobrenomeJS.pessoaAlturaJS+" ];";
		$script = Pessoa::$inicioScript.$pessoaJS.Pessoa::$fimScript;
		// 
		return $script;
	}
	
	// métodos get e set ...
}

?>

Considere também o html:

	
		
	
	
	

		criaArrayJS(); // passa array
			echo $objPessoa->criaObjJS(); // passa objeto
		?>


		
Testando um objeto Javascript passada pelo PhP
		
Nome: 
		
Sobrenome: 
		
Altura: 


		
	

	

Como pode-se ver, o arquivo PhP foi chamado antes de ser referenciado o script.js, sendo assim, poderemos utilizar a variavel var pessoa e pegar tudo o que foi transferido pela função do echo realizada logo após ter sido aberto a tag body. Como chamamos a função criaObjJS por último, iremos utilizar no arquivo script.js um objeto. Como desde o começo do artigo (assim como sua proposta) não utilizamos JQuery, vou transferir os dados para o html utilizando apenas javascript.
Segue o arquivo script.js:

document.getElementById("txtNome").innerHTML = pessoa.nome;
document.getElementById("txtSobrenome").innerHTML = pessoa.sobrenome;
document.getElementById("txtAltura").innerHTML = pessoa.altura;

Por que utilizar essa estrutura?
Como já dito, não é comum utilizar este tipo de estrutura, mas as vezes é preciso. O exemplo citado aqui foi bem superficial, mas possa ser que no seu projeto você traga da classe Pessoa (ou qualquer outra classe) dados do banco que precisam ser filtrados e/ou apresentados de uma maneira agradável na view, e para isso, geralmente usamos frameworks de Javascript, como o JQuery por exemplo.
Vale a pena citar que este mesmo processo pode ser facilitado caso você utilize Angular.js no seu projeto. Não sabia? Leia este artigo do blog [ainda não publicado] onde explico como pegar dados do back-end (PhP) utilizando Javascript (Angular.js) de uma maneira bem simples, até mais simples que este artigo, pois não é necessário criar uma lógica no back-end como criamos nos métodos extras da classe Pessoa.php.

Pesquisa dinâmica

Através deste método, caso você utilize PhP no seu projeto junto de Javascript (sem o Angular.js como dito acima), você poderá fazer uma função para pesquisa dinâmica no seu site, onde a cada palavra que você digita no campo de pesquisa, todos os artigos relacionados aquela letra e palavra já são filtrados sem que o usuário precisa clicar em algum botão de "Pesquisar" e tenha de ser feito um submit, recarregada a página, etc e etc.
É exatamente igual ao campo de pesquisa deste blog.
> Clique aqui para ler este artigo [ainda não publicado]